Your SlideShare is downloading. ×

UX Eye - From Idea to Reality


Published on

Presentation given to the UX Eye for the Developer Guy Meetup on June 21, 2012

Presentation given to the UX Eye for the Developer Guy Meetup on June 21, 2012

Published in: Design, Technology
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. FROM IDEATO REALITYGlen LipkaVice President, User eXperienceMarketo
  • 2. Google Images
  • 3. Design Granularity Stages of Design The Long Tail Part The Design Part The Idea Part % Complete
  • 5. I GOTS AN IDEA! UH OHExecutive Sponsor UX Designer
  • 6. 2 WORD IDEAS • Dynamic Content • Purposeful Duplicates • Archive Folders • Spend Management • Nurture Module • Scoring Module • Analytics Home
  • 7. DISCOVERY • Listen • Explore • Imagine • Empathize
  • 8. Understand the current UX
  • 9. Define the requirements Not the solution
  • 10. Sketch on paper
  • 11. Sketch on whiteboard
  • 12. Talk it out
  • 13. Let the conversation flow
  • 14. Converge Ideas
  • 15. Conceptual Design
  • 17. Computer Time
  • 18. Prototypes OmniGraffle
  • 19. Dynamic Content StoryboardDesign SpecificationLast Updated: October 27, 2011
  • 20. Change LogDate Designer Change7-1-2011 Divya Ramachandran Started document7-5-2011 Divya Ramachandran Worked out first case – extending tokens7-8-2011 Divya Ramachandran Add rules, languages to tokens; edit tokens from within landing page/email7-12-2011 Divya Ramachandran Token editor (separate window)7-15-2011 Divya Ramachandran Previewer, Clone7-26-2011 Divya Ramachandran Started over and split my.tokens from dynamic content7-27-2011 Divya Ramachandran Add versions and languages7-28-2011 Divya Ramachandran Version rules; changed back to dynamic content set (no tracks).8-2-2011 Divya Ramachandran Creating new dynamic content from within local asset email use case8-3-2011 Divya Ramachandran Dynamic content editor in separate window launched from email8-4-2011 Divya Ramachandran Updated dynamic content editor to have two tabs – one for set and second for selected token8-8-2011 Divya Ramachandran Added landing page editor8-9-2011 Divya Ramachandran Added details on global dynamic content sets (design studio), and validation on clone/activate campaigns8-10-2011 Divya Ramachandran Eliminated 3rd window; navigate main window to dynamic content editor area when editing from email/lp8-11-2011 Divya Ramachandran Redesign of previewer8-11-2011 Divya Ramachandran Split previewer into separate document8-12-2011 Divya Ramachandran Clean up8-19-2011 Divya Ramachandran Changed everything8-22-2011 Divya Ramachandran Changed right panel to check boxes8-23-2011 Divya Ramachandran Cleaned up right panel; added previewing options8-24-2011 Divya Ramachandran Added flobule validation rules8-25-2011 Divya Ramachandran Changed to add rules only to mkteditable sections8-26-2011 Divya Ramachandran Added options to edit inside of TinyMCE; changed right side to tree8-29-2011 Divya Ramachandran Added header, text version; previewer modes
  • 21. Change Log – Page 2Date Designer Change8-30-2011 Divya Ramachandran Global dynamic content, using global from email8-31-2011 Divya Ramachandran Landing page editor9-1-2011 Divya Ramachandran More on landing page editor9-2-2011 Divya Ramachandran Clean up9-6-2011 Divya Ramachandran clean up9-7-2011 Divya Ramachandran More detail and clean up on flobule, tree9-13-2011 Divya Ramachandran Changed text version to be on a per section basis9-16-2011 Divya Ramachandran Updated text version and header fields; clean up9-19-2011 Divya Ramachandran Finished details for email editor10-3-2011 Divya Ramachandran Incorporated segmentation and segments; replaced rule sets10-12-2011 Divya Ramachandran Updated segmentation design10-17-2011 Divya Ramachandran Details for approval/drafts/edits; workspace behavior10-18-2011 Divya Ramachandran Added detail10-24-2011 Divya Ramachandran Updated names/icons10-27-2011 Divya Ramachandran New segmentation UI with field/smart list types11-1-2011 Divya Ramachandran Cleaned up icons/terminology through email editor11-15-2011 Divya Ramachandran Updated segmentation edit modal; segmentation summary page11-17-2011 Divya Ramachandran Deleted segment behavior2-15-2012 Divya Ramachandran Added segment triggers/filters6-1-2012 Divya Ramachandran Enhancement to Segmentation summary page to account for approx count6-12-2012 Divya Ramachandran Clean up options for dynamic content report
  • 22. Lead Database New Smart List Lead Database New List Import List New Lead New Segmentation SegmentationsNotes:
  • 23. New Segmentation Name: Industry Define By: Rules Description: Core industry segments Should add row at the top Segments Add Segment Order Segment Resolve overlapping Validation: 1. Health segments. Cannot have ties. Names unique w/i segmentation. 2. Big Finance Must have ONE minimum 3. Small Finance Default Default Start with one empty choice + defaultNo warning for rename ofsegments; update label Save Cancelwherever used
  • 25. All the Decisions!
  • 26. Decisionsthat matter Other decisions
  • 27. Why we disagree
  • 28. Different Data
  • 29. Different Assumptions
  • 30. Optimization Difference
  • 31. Its Personal
  • 32. Don’t wait until its too late
  • 33. The cutting room floor
  • 34. Pick your battles
  • 35. Lay on the tracks
  • 37. Don’t move the cheese
  • 38. Strive for consistency
  • 39. Strive for consistency
  • 40. Don’t ask the user
  • 41. UX sits with EngUX Eng PM
  • 42. Design is the details
  • 43. Design Granularity Stages of Design The Long Tail Part The Design Part The Idea Part % Complete
  • 44. QUESTIONS?Glen LipkaVice President, User eXperienceMarketo•• @glenlipka•