Post on 04-Jul-2015
description
FROM IDEA
TO REALITY
Glen Lipka
Vice President, User eXperience
Marketo
Google Images
% Complete
De
sign
Gra
nu
lari
ty
The Long Tail Part
The Design Part
The Idea Part
Stages of Design
THE IDEA PART
I GOTS AN IDEA!
UH OH
Executive Sponsor UX Designer
2 WORD IDEAS
• Dynamic Content
• Purposeful Duplicates
• Archive Folders
• Spend Management
• Nurture Module
• Scoring Module
• Analytics Home
DISCOVERY
• Listen
• Explore
• Imagine
• Empathize
Understand the current UX
Define the requirements
Not the solution
Sketch on paper
Sketch on whiteboard
Talk it out
Let the conversation flow
Converge Ideas
Conceptual Design
THE LONG TAIL PART
Computer Time
Prototypes
OmniGraffle
Dynamic Content StoryboardDesign SpecificationLast Updated: October 27, 2011
Change LogDate Designer Change
7-1-2011 Divya Ramachandran Started document
7-5-2011 Divya Ramachandran Worked out first case – extending tokens
7-8-2011 Divya Ramachandran Add rules, languages to tokens; edit tokens from within landing page/email
7-12-2011 Divya Ramachandran Token editor (separate window)
7-15-2011 Divya Ramachandran Previewer, Clone
7-26-2011 Divya Ramachandran Started over and split my.tokens from dynamic content
7-27-2011 Divya Ramachandran Add versions and languages
7-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 case
8-3-2011 Divya Ramachandran Dynamic content editor in separate window launched from email
8-4-2011 Divya Ramachandran Updated dynamic content editor to have two tabs – one for set and second for selected token
8-8-2011 Divya Ramachandran Added landing page editor
8-9-2011 Divya Ramachandran Added details on global dynamic content sets (design studio), and validation on clone/activate campaigns
8-10-2011 Divya Ramachandran Eliminated 3rd window; navigate main window to dynamic content editor area when editing from email/lp
8-11-2011 Divya Ramachandran Redesign of previewer
8-11-2011 Divya Ramachandran Split previewer into separate document
8-12-2011 Divya Ramachandran Clean up
8-19-2011 Divya Ramachandran Changed everything
8-22-2011 Divya Ramachandran Changed right panel to check boxes
8-23-2011 Divya Ramachandran Cleaned up right panel; added previewing options
8-24-2011 Divya Ramachandran Added flobule validation rules
8-25-2011 Divya Ramachandran Changed to add rules only to mkteditable sections
8-26-2011 Divya Ramachandran Added options to edit inside of TinyMCE; changed right side to tree
8-29-2011 Divya Ramachandran Added header, text version; previewer modes
Date Designer Change
8-30-2011 Divya Ramachandran Global dynamic content, using global from email
8-31-2011 Divya Ramachandran Landing page editor
9-1-2011 Divya Ramachandran More on landing page editor
9-2-2011 Divya Ramachandran Clean up
9-6-2011 Divya Ramachandran clean up
9-7-2011 Divya Ramachandran More detail and clean up on flobule, tree
9-13-2011 Divya Ramachandran Changed text version to be on a per section basis
9-16-2011 Divya Ramachandran Updated text version and header fields; clean up
9-19-2011 Divya Ramachandran Finished details for email editor
10-3-2011 Divya Ramachandran Incorporated segmentation and segments; replaced rule sets
10-12-2011 Divya Ramachandran Updated segmentation design
10-17-2011 Divya Ramachandran Details for approval/drafts/edits; workspace behavior
10-18-2011 Divya Ramachandran Added detail
10-24-2011 Divya Ramachandran Updated names/icons
10-27-2011 Divya Ramachandran New segmentation UI with field/smart list types
11-1-2011 Divya Ramachandran Cleaned up icons/terminology through email editor
11-15-2011 Divya Ramachandran Updated segmentation edit modal; segmentation summary page
11-17-2011 Divya Ramachandran Deleted segment behavior
2-15-2012 Divya Ramachandran Added segment triggers/filters
6-1-2012 Divya Ramachandran Enhancement to Segmentation summary page to account for approx count
6-12-2012 Divya Ramachandran Clean up options for dynamic content report
Change Log – Page 2
Lead Database
Lead Database
Segmentations
New Smart List
New List
Import List
New Lead
New Segmentation
Notes:
New Segmentation
CancelSave
Order SegmentAdd Segment
Segments
Resolve overlapping segments. Cannot have ties.
Start with one empty choice + default
Validation:Names unique w/i segmentation. Must have ONE minimum
No warning for rename of segments; update label wherever used
Name: Industry
Description:Core industry segments
Define By: Rules
2. Big Finance
3. Small Finance
Default Default
Health1.
Should add row at the top
THE DECISIONS PART
All the Decisions!
Other decisions
Decisionsthat matter
Why we disagree
Different Data
Different Assumptions
Optimization Difference
Its Personal
Don’t wait until its too late
The cutting room floor
Pick your battles
Lay on the tracks
DESIGN PRINCIPLES
Don’t move the cheese
Strive for consistency
Strive for consistency
Don’t ask the user
UX Eng
PM
UX sits with Eng
Design is the details
% Complete
De
sign
Gra
nu
lari
ty
The Long Tail Part
The Design Part
The Idea Part
Stages of Design
QUESTIONS?
Glen Lipka
Vice President, User eXperience
Marketo
• http://commadot.com
• @glenlipka
• http://linkedin.com/in/glenlipka