UX Playbook - 15 Minutes to Better Performance

Chris Feix
Chris FeixUX, Business Strategy, Start-ups
UX Playbook
15 minutes to better performance.
Theory
Digital UX is to make very difficult decisions with screen space,
interactions, content, and branding.
Then, follow up with rigorous monitoring, testing, and subtle
improvements.
It takes time (patience), monetary investment, trust in the
processes, and most importantly a great team.
Intro…
Get out your product and follow along.
Intro…
Get out your product and follow along.
Also, bring a snack, this may take a
while.
Accessibility
What good is a design…
if it’s not accessible?
Fonts
Accessibility
Accessibility.Fonts
Use larger fonts.
Article Title
Author Name / Date
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy
text ever since the 1500s, when an unknown printer took a galley
of type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into electronic
typesetting, remaining essentially unchanged.
Article Title
Author Name / Date
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy
text ever since the 1500s, when an unknown printer took a galley
of type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into electronic
typesetting, remaining essentially unchanged.
Accessibility.Fonts
Cut the number of fonts down to
ONE.
“Not very stylish.”, you say?
Fine… I’ll give you TWO.
(PS: This presentation is Roboto Black (900) &
Roboto Light (300). Yes, technically ONE font; but the
weight extremes make it seem like TWO.)
Article Title
Author Name / Date
Lorem Ipsum is simply dummy text of the printing
and typesetting industry. Lorem Ipsum has been the
industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and
scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into
electronic typesetting, remaining essentially unchanged.
Article Title
Author Name / Date
Lorem Ipsum is simply dummy text of the printing and
typesetting industry. Lorem Ipsum has been the industry's
standard dummy text ever since the 1500s, when an unknown
printer took a galley of type and scrambled it to make a type
specimen book. It has survived not only five centuries, but also
the leap into electronic typesetting, remaining essentially
unchanged.
Accessibility.Fonts
Allow for font sizing.
Accessibility.Fonts
When in doubt, use serif
fonts when they are smaller.
(Though no concrete evidence has ever surfaced
to argue either way. AND there are exceptions.)
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when
an unknown printer took a galley of type and scrambled it to make a type
specimen book. It has survived not only five centuries, but also the leap into
electronic typesetting, remaining essentially unchanged.
LoremIpsumissimplydummy text of the printingandtypesettingindustry.LoremIpsumhas beenthe industry'sstandard
dummytext eversincethe 1500s,when anunknown printertooka galleyof typeand scrambleditto make atypespecimen
book. Ithassurvivednot onlyfivecenturies,but alsothe leapintoelectronictypesetting,remainingessentiallyunchanged.
Accessibility.Fonts
It’s much more important to
use fonts that have
monospacing and consistent
x-height and ascender /
descender values.
Also try to choose something
with open counters.
Accessibility.Fonts
Black on white.
I repeat, black on white
Lorem Ipsumis simply dummytext of the printingand typesetting industry.Lorem Ipsumhas beenthe industry's
standard dummytext ever since the 1500s, whenanunknownprinter took a galley of type and scrambled it to makea
type specimenbook. It hassurvived not only five centuries,butalso the leap into electronic typesetting, remaining
essentially unchanged.
Lorem Ipsumis simply dummytext of the printingand typesetting industry.Lorem Ipsumhas beenthe industry's
standard dummytext ever since the 1500s, whenanunknownprinter took a galley of type and scrambled it to makea
type specimenbook. It hassurvived not only five centuries,butalso the leap into electronic typesetting, remaining
essentially unchanged.
Links
Accessibility
Accessibility.Links
Never underline text that are
NOT links.
Links must be tab tested.
Alt and Title tags are
mandatory.
WHERE’STHELINK?
LoremIpsum is simply dummy textof theprinting and typesettingindustry. LoremIpsum has
beentheindustry's standard dummy text eversince the1500s,whenan unknown printertook
a galley of typeand scrambled it to makea typespecimen book.
WHERE’STHELINK?
LoremIpsum is simply dummy textof theprinting and typesettingindustry. LoremIpsum has
beentheindustry's standard dummy text eversince the1500s,whenan unknown printertook
a galley of typeand scrambled it to makea typespecimen book.
WHERE’STHELINK?
LoremIpsum is simply dummy textof theprinting and typesettingindustry. LoremIpsum has
beentheindustry's standard dummy text eversince the1500s,whenan unknown printertook
a galley of typeand scrambled it to makea typespecimen book.
Animation
Accessibility
Accessibility.Animation
Sometimes it’s a good idea to disable
most animation via cookies if you are
sure the user is older or has
accessibility issues.
Accessibility.Animation
Always use subtle, helpful animation.
Animation for animation sake is
usually not a good UX practice,
regardless of the user.
Accessibility.Animation
Always use subtle, helpful animation.
Animation for animation sake is
usually not a good UX practice,
regardless of the user.
Planning
Accessibility
Accessibility.Planning
1. Hire a professional.
2. GET THEM INVOLVED ON THE GROUND LEVEL.
1. Use the guide: http://webaim.org/standards/508/checklist
2. Use this guide too: https://www.w3.org/TR/WCAG20/
3. Creating Accessible Videos: http://www.washington.edu/accessibility/videos/
Accessibility.Planning
Accessibility must take significant form in your…
• User stories
• Journey maps
• Testing
• Development estimation
Forms
Accessibility
(See Payments)
Accessibility.Forms
Forms are the most overlooked, under-scrutinized part of many digital products.
Forms are CRITICAL for:
• Conversion
• Participation
• Retention
• Income
Accessibility.Forms
Inputs (text, select, dropdowns…)
Email Address
john.smith@emailaddress.com
Email Address
Email Address
EX: john.smith@emailaddress.com
BAD
BETTE
R
BEST
Accessibility.Forms
Tapable…
chris.feix.71@gmail.com
Email Address
EX: john.smith@emailaddress.com
chris.feix.71@gmail.com
Email Address
EX: john.smith@emailaddress.com
Accessibility.Forms
Obfuscation
5oftT@c0
Password
Must contain at least 8 characters comprised of letters,
numbers, and at least one symbol.
••••••••
Password
Must contain at least 8 characters comprised of letters,
numbers, and at least one symbol.
SHOW
Accessibility.Forms
Obfuscation
5oftT@c0
Password
Must contain at least 8 characters comprised of letters,
numbers, and at least one symbol.
X HIDE PASSWORD
Accessibility.Forms
5
Password
HINT:
7 more characters
A number
A symbol
SHOW
5oftT@
Password
HINT:
2 more characters
A number
A symbol
SHOW
5oftT@c0
Password
HINT:
8 characters
A number
A symbol
SHOW
Expectation…
Accessibility.Forms
Input masks…
Accessibility.Forms
Buttons…
CancelNext × Cancel Next ›
Accessibility.Forms
Buttons…
× Cancel Next › × Cancel Login
I forgot my password.?
Accessibility.Forms
Color Placement
Retention
Driving traffic to a product is the second hardest task of any
company - retaining those customers is paramount.
Reduce
Retention
Retention.Reduce
Much of what goes on a page can
be removed if:
• Main navigation is muy facil
• Search optimization has been
properly implemented
• Your marketing people aren’t total
douchebags
Retention.Reduce
Much of what goes on a page can
be removed if:
• Main navigation is muy facil
• Search optimization has been
properly implemented
• Your marketing people aren’t total
douchebags
Retention.Reduce
Much of what goes on a page can
be removed if:
• Main navigation is muy facil
• Search optimization has been
properly implemented
• Your marketing people aren’t total
douchebags
Retention.Reduce
Much of what goes on a page can
be removed if:
• Main navigation is muy facil
• Search optimization has been
properly implemented
• Your marketing people aren’t total
douchebags
Retention.Reduce
Much of what goes on a page can
be removed if:
• Main navigation is muy facil
• Search optimization has been
properly implemented
• Your marketing people aren’t total
douchebags
Retention.Reduce
Conversion
If it can’t convert a user into a customer, what good is it?
Personalization
Conversion
Conversion.Personalization
• Allow users to switch currency (€/$/£)
• Allow users to switch pricing monthly/yearly
• Indicate that users can cancel any time
• Indicate what group each pricing plan is for (e.g. freelancers)
• Avoid mentioning “account” anywhere
(nobody *wants* to create an account)
• Allow users to switch table/slider views
• Allow users to select features of interest
• Allow users to configure their own pricing plan
• Make sure each section drops a bit of delight
• Provide a way out if a user isn’t interested
(“buy our books instead”)
Conversion.Personalization
• Allow users to switch currency (€/$/£)
• Allow users to switch pricing monthly/yearly
• Indicate that users can cancel any time
• Indicate what group each pricing plan is for (e.g. freelancers)
• Avoid mentioning “account” anywhere
(nobody *wants* to create an account)
• Small commitments are better than big ones,
• Allow users to switch table/slider views
• Allow users to select features of interest
• Allow users to configure their own pricing plan
• Make sure each section drops a bit of delight
• Provide a way out if a user isn’t interested
(“buy our books instead”)
Conversion.Personalization
• Allow users to switch currency (€/$/£)
• Allow users to switch pricing monthly/yearly
• Indicate that users can cancel any time
• Indicate what group each pricing plan is for (e.g. freelancers)
• Avoid mentioning “account” anywhere
(nobody *wants* to create an account)
• Allow users to switch table/slider views
• Allow users to select features of interest
• Allow users to configure their own pricing plan
• Make sure each section drops a bit of delight
• Provide a way out if a user isn’t interested
(“buy our books instead”)
Conversion.Personalization
• Allow users to switch currency (€/$/£)
• Allow users to switch pricing monthly/yearly
• Indicate that users can cancel any time
• Indicate what group each pricing plan is for (e.g. freelancers)
• Avoid mentioning “account” anywhere
(nobody *wants* to create an account)
• Allow users to switch table/slider views
• Allow users to select features of interest
• Allow users to configure their own pricing plan
• Make sure each section drops a bit of delight
• Provide a way out if a user isn’t interested
(“buy our books instead”)
Conversion.Personalization
• Allow users to switch currency (€/$/£)
• Allow users to switch pricing monthly/yearly
• Indicate that users can cancel any time
• Indicate what group each pricing plan is for (e.g. freelancers)
• Avoid mentioning “account” anywhere
(nobody *wants* to create an account)
• Allow users to switch table/slider views
• Allow users to select features of interest
• Allow users to configure their own pricing plan
• Make sure each section drops a bit of delight
• Provide a way out if a user isn’t interested
(“buy our books instead”)
Conversion.Personalization
Provide a way out if a user isn’t interested…
(“buy our books instead, join the club, subscribe for free tips”)
Forms
Conversion
Conversion.Forms
HTML Attributes
Conversion.Forms
HTML Attributes
Conversion.Forms
HTML Attributes
Conversion.Forms
Prefills and Typeahead
Framing
Conversion
Conversion.Framing
Know how the brain works.
Conversion.Framing
Know how the brain works.
Conversion.Framing
Know how the brain works.
Conversion.Framing
Stay out of peoples’ cerebral cortex!
Conversion.Framing
Conversion.Framing
Conversion.Framing
Conversion.Framing
Conversion.Framing
Conversion.Framing
Profits 21%
Form Completion 54%
Conversion.Framing
77% 19% 3% |
1% .
2% 9% 33%
66%
Conversion.Framing
DIGITAL
$59/yr.
PRINT & DIGITAL
$125/yr.
Conversion.Framing
DIGITAL
$59/yr.
PRINT & DIGITAL
$125/yr.
68% 32%
Completion
34%
Conversion.Framing
DIGITAL
$59/yr.
PRINT & DIGITAL
$125/yr.
Conversion.Framing
DIGITAL
$59/yr.
PRINT & DIGITAL
$125/yr.
PRINT
$125/yr.
Conversion.Framing
DIGITAL
$59/yr.
PRINT & DIGITAL
$125/yr.
PRINT
$125/yr.
16%
68%
0% 84%
32%
Completion
49%
34%
1 of 70

More Related Content

Viewers also liked(18)

UX & Digital Design weekUX & Digital Design week
UX & Digital Design week
Future London Academy377 views
Typography and Branding Week in LondonTypography and Branding Week in London
Typography and Branding Week in London
Future London Academy1.2K views
Creating and using personasCreating and using personas
Creating and using personas
AndrewUX1.7K views
Hands-on Lean UX for Digital DesignersHands-on Lean UX for Digital Designers
Hands-on Lean UX for Digital Designers
Lane Goldstone2.4K views
UX For Digital Humanists: A PrimerUX For Digital Humanists: A Primer
UX For Digital Humanists: A Primer
craigmmacdonald1.8K views
A Survival Guide for Complex UXA Survival Guide for Complex UX
A Survival Guide for Complex UX
Jennifer Cham2.4K views
UX <3 Digital Transformation UX <3 Digital Transformation
UX <3 Digital Transformation
Caroline Andersson1.5K views
Design due diligenceDesign due diligence
Design due diligence
Thomas Sutton8.6K views
Ux design processUx design process
Ux design process
Junying Chang13.2K views
Intervento apogea marzo 2017Intervento apogea marzo 2017
Intervento apogea marzo 2017
Davide Zucchetti238 views
2017 NAEC2017 NAEC
2017 NAEC
Milena Palahanska-Mavrov, P.E., LEED AP BD+C139 views
ICDS1 IARIA presentation M. HartogICDS1 IARIA presentation M. Hartog
ICDS1 IARIA presentation M. Hartog
eSociety Institute of The Hague University of Applied Sciences187 views

Similar to UX Playbook - 15 Minutes to Better Performance

Similar to UX Playbook - 15 Minutes to Better Performance(20)

S118 toolbox richardsS118 toolbox richards
S118 toolbox richards
Debbie Richards799 views
IT-Infographic-Greenn.pptxIT-Infographic-Greenn.pptx
IT-Infographic-Greenn.pptx
ssuser3bbeb52 views
Maximum_16x10_Blue_Dark.pptMaximum_16x10_Blue_Dark.ppt
Maximum_16x10_Blue_Dark.ppt
chukudiogune1 view
Maximum_16x10_Blue_Light.pptMaximum_16x10_Blue_Light.ppt
Maximum_16x10_Blue_Light.ppt
chukudiogune1 view
Business Plan Google Slides TemplateBusiness Plan Google Slides Template
Business Plan Google Slides Template
PoweredTemplate.com12 views
[RD_tree].pptx[RD_tree].pptx
[RD_tree].pptx
ssuserc358e522 views
Sbac digital guideline presentationSbac digital guideline presentation
Sbac digital guideline presentation
zoheb hossain mollick275 views
International Market Entry Methods FlatInternational Market Entry Methods Flat
International Market Entry Methods Flat
SlideShop.com2.2K views
automobileautomobile
automobile
TharinduGamage93 views
Craigslist (1)Craigslist (1)
Craigslist (1)
Sahithya Baskaran3.4K views
High Impact Power Point TemplatesHigh Impact Power Point Templates
High Impact Power Point Templates
Manish Parsuramka638 views
PowerPoint Deck 1.pptxPowerPoint Deck 1.pptx
PowerPoint Deck 1.pptx
theBeatlesriseagain13 views
Graphic model   offer electronic menuGraphic model   offer electronic menu
Graphic model offer electronic menu
Graphic_Model82 views

Recently uploaded(20)

Benzodiazepines--Medicinal ChemistryBenzodiazepines--Medicinal Chemistry
Benzodiazepines--Medicinal Chemistry
NarminHamaaminHussen6 views
Anthelmintic Drugs-Medicinal ChemistryAnthelmintic Drugs-Medicinal Chemistry
Anthelmintic Drugs-Medicinal Chemistry
NarminHamaaminHussen5 views
Design System in Figma A to Z.pdfDesign System in Figma A to Z.pdf
Design System in Figma A to Z.pdf
Atiqur Rahaman13 views
Task 3.pptxTask 3.pptx
Task 3.pptx
ZaraCooper216 views
3 Dark Design Templates3 Dark Design Templates
3 Dark Design Templates
Pixeldarts12 views
Doing Footwear - Footwear FactoryDoing Footwear - Footwear Factory
Doing Footwear - Footwear Factory
Doing Footwear6 views
FMP E1 pitch packFMP E1 pitch pack
FMP E1 pitch pack
MonnaS241 views
polarispolaris
polaris
scribddarkened352188 views
The Last GrainsThe Last Grains
The Last Grains
pulkkinenaliisa33 views
The dedicated christmas cookbookThe dedicated christmas cookbook
The dedicated christmas cookbook
petrusmorebane18 views
My Creative Resume DIAPOS.pptxMy Creative Resume DIAPOS.pptx
My Creative Resume DIAPOS.pptx
BrayanQuispe237 views
Viking passive.pdfViking passive.pdf
Viking passive.pdf
Matis Velt15 views
Task 3 copy.pptxTask 3 copy.pptx
Task 3 copy.pptx
ZaraCooper215 views
Anti-Cancer Drugs-Medicinal ChemistryAnti-Cancer Drugs-Medicinal Chemistry
Anti-Cancer Drugs-Medicinal Chemistry
NarminHamaaminHussen6 views
Scopic UX Design Test Task.pdfScopic UX Design Test Task.pdf
Scopic UX Design Test Task.pdf
Atiqur Rahaman237 views
Nomor Meja RUANG-4.docNomor Meja RUANG-4.doc
Nomor Meja RUANG-4.doc
ssuserc40b916 views
Anti -Parkinsonian Drugs-Medicinal ChemistryAnti -Parkinsonian Drugs-Medicinal Chemistry
Anti -Parkinsonian Drugs-Medicinal Chemistry
NarminHamaaminHussen7 views
Presentation (1).pdfPresentation (1).pdf
Presentation (1).pdf
hjksa15 views

UX Playbook - 15 Minutes to Better Performance

  • 1. UX Playbook 15 minutes to better performance.
  • 2. Theory Digital UX is to make very difficult decisions with screen space, interactions, content, and branding. Then, follow up with rigorous monitoring, testing, and subtle improvements. It takes time (patience), monetary investment, trust in the processes, and most importantly a great team.
  • 3. Intro… Get out your product and follow along.
  • 4. Intro… Get out your product and follow along. Also, bring a snack, this may take a while.
  • 5. Accessibility What good is a design… if it’s not accessible?
  • 7. Accessibility.Fonts Use larger fonts. Article Title Author Name / Date Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. Article Title Author Name / Date Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
  • 8. Accessibility.Fonts Cut the number of fonts down to ONE. “Not very stylish.”, you say? Fine… I’ll give you TWO. (PS: This presentation is Roboto Black (900) & Roboto Light (300). Yes, technically ONE font; but the weight extremes make it seem like TWO.) Article Title Author Name / Date Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. Article Title Author Name / Date Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
  • 10. Accessibility.Fonts When in doubt, use serif fonts when they are smaller. (Though no concrete evidence has ever surfaced to argue either way. AND there are exceptions.) Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. LoremIpsumissimplydummy text of the printingandtypesettingindustry.LoremIpsumhas beenthe industry'sstandard dummytext eversincethe 1500s,when anunknown printertooka galleyof typeand scrambleditto make atypespecimen book. Ithassurvivednot onlyfivecenturies,but alsothe leapintoelectronictypesetting,remainingessentiallyunchanged.
  • 11. Accessibility.Fonts It’s much more important to use fonts that have monospacing and consistent x-height and ascender / descender values. Also try to choose something with open counters.
  • 12. Accessibility.Fonts Black on white. I repeat, black on white Lorem Ipsumis simply dummytext of the printingand typesetting industry.Lorem Ipsumhas beenthe industry's standard dummytext ever since the 1500s, whenanunknownprinter took a galley of type and scrambled it to makea type specimenbook. It hassurvived not only five centuries,butalso the leap into electronic typesetting, remaining essentially unchanged. Lorem Ipsumis simply dummytext of the printingand typesetting industry.Lorem Ipsumhas beenthe industry's standard dummytext ever since the 1500s, whenanunknownprinter took a galley of type and scrambled it to makea type specimenbook. It hassurvived not only five centuries,butalso the leap into electronic typesetting, remaining essentially unchanged.
  • 14. Accessibility.Links Never underline text that are NOT links. Links must be tab tested. Alt and Title tags are mandatory. WHERE’STHELINK? LoremIpsum is simply dummy textof theprinting and typesettingindustry. LoremIpsum has beentheindustry's standard dummy text eversince the1500s,whenan unknown printertook a galley of typeand scrambled it to makea typespecimen book. WHERE’STHELINK? LoremIpsum is simply dummy textof theprinting and typesettingindustry. LoremIpsum has beentheindustry's standard dummy text eversince the1500s,whenan unknown printertook a galley of typeand scrambled it to makea typespecimen book. WHERE’STHELINK? LoremIpsum is simply dummy textof theprinting and typesettingindustry. LoremIpsum has beentheindustry's standard dummy text eversince the1500s,whenan unknown printertook a galley of typeand scrambled it to makea typespecimen book.
  • 16. Accessibility.Animation Sometimes it’s a good idea to disable most animation via cookies if you are sure the user is older or has accessibility issues.
  • 17. Accessibility.Animation Always use subtle, helpful animation. Animation for animation sake is usually not a good UX practice, regardless of the user.
  • 18. Accessibility.Animation Always use subtle, helpful animation. Animation for animation sake is usually not a good UX practice, regardless of the user.
  • 20. Accessibility.Planning 1. Hire a professional. 2. GET THEM INVOLVED ON THE GROUND LEVEL. 1. Use the guide: http://webaim.org/standards/508/checklist 2. Use this guide too: https://www.w3.org/TR/WCAG20/ 3. Creating Accessible Videos: http://www.washington.edu/accessibility/videos/
  • 21. Accessibility.Planning Accessibility must take significant form in your… • User stories • Journey maps • Testing • Development estimation
  • 23. Accessibility.Forms Forms are the most overlooked, under-scrutinized part of many digital products. Forms are CRITICAL for: • Conversion • Participation • Retention • Income
  • 24. Accessibility.Forms Inputs (text, select, dropdowns…) Email Address john.smith@emailaddress.com Email Address Email Address EX: john.smith@emailaddress.com BAD BETTE R BEST
  • 26. Accessibility.Forms Obfuscation 5oftT@c0 Password Must contain at least 8 characters comprised of letters, numbers, and at least one symbol. •••••••• Password Must contain at least 8 characters comprised of letters, numbers, and at least one symbol. SHOW
  • 27. Accessibility.Forms Obfuscation 5oftT@c0 Password Must contain at least 8 characters comprised of letters, numbers, and at least one symbol. X HIDE PASSWORD
  • 28. Accessibility.Forms 5 Password HINT: 7 more characters A number A symbol SHOW 5oftT@ Password HINT: 2 more characters A number A symbol SHOW 5oftT@c0 Password HINT: 8 characters A number A symbol SHOW Expectation…
  • 31. Accessibility.Forms Buttons… × Cancel Next › × Cancel Login I forgot my password.?
  • 33. Retention Driving traffic to a product is the second hardest task of any company - retaining those customers is paramount.
  • 35. Retention.Reduce Much of what goes on a page can be removed if: • Main navigation is muy facil • Search optimization has been properly implemented • Your marketing people aren’t total douchebags
  • 36. Retention.Reduce Much of what goes on a page can be removed if: • Main navigation is muy facil • Search optimization has been properly implemented • Your marketing people aren’t total douchebags
  • 37. Retention.Reduce Much of what goes on a page can be removed if: • Main navigation is muy facil • Search optimization has been properly implemented • Your marketing people aren’t total douchebags
  • 38. Retention.Reduce Much of what goes on a page can be removed if: • Main navigation is muy facil • Search optimization has been properly implemented • Your marketing people aren’t total douchebags
  • 39. Retention.Reduce Much of what goes on a page can be removed if: • Main navigation is muy facil • Search optimization has been properly implemented • Your marketing people aren’t total douchebags
  • 41. Conversion If it can’t convert a user into a customer, what good is it?
  • 43. Conversion.Personalization • Allow users to switch currency (€/$/£) • Allow users to switch pricing monthly/yearly • Indicate that users can cancel any time • Indicate what group each pricing plan is for (e.g. freelancers) • Avoid mentioning “account” anywhere (nobody *wants* to create an account) • Allow users to switch table/slider views • Allow users to select features of interest • Allow users to configure their own pricing plan • Make sure each section drops a bit of delight • Provide a way out if a user isn’t interested (“buy our books instead”)
  • 44. Conversion.Personalization • Allow users to switch currency (€/$/£) • Allow users to switch pricing monthly/yearly • Indicate that users can cancel any time • Indicate what group each pricing plan is for (e.g. freelancers) • Avoid mentioning “account” anywhere (nobody *wants* to create an account) • Small commitments are better than big ones, • Allow users to switch table/slider views • Allow users to select features of interest • Allow users to configure their own pricing plan • Make sure each section drops a bit of delight • Provide a way out if a user isn’t interested (“buy our books instead”)
  • 45. Conversion.Personalization • Allow users to switch currency (€/$/£) • Allow users to switch pricing monthly/yearly • Indicate that users can cancel any time • Indicate what group each pricing plan is for (e.g. freelancers) • Avoid mentioning “account” anywhere (nobody *wants* to create an account) • Allow users to switch table/slider views • Allow users to select features of interest • Allow users to configure their own pricing plan • Make sure each section drops a bit of delight • Provide a way out if a user isn’t interested (“buy our books instead”)
  • 46. Conversion.Personalization • Allow users to switch currency (€/$/£) • Allow users to switch pricing monthly/yearly • Indicate that users can cancel any time • Indicate what group each pricing plan is for (e.g. freelancers) • Avoid mentioning “account” anywhere (nobody *wants* to create an account) • Allow users to switch table/slider views • Allow users to select features of interest • Allow users to configure their own pricing plan • Make sure each section drops a bit of delight • Provide a way out if a user isn’t interested (“buy our books instead”)
  • 47. Conversion.Personalization • Allow users to switch currency (€/$/£) • Allow users to switch pricing monthly/yearly • Indicate that users can cancel any time • Indicate what group each pricing plan is for (e.g. freelancers) • Avoid mentioning “account” anywhere (nobody *wants* to create an account) • Allow users to switch table/slider views • Allow users to select features of interest • Allow users to configure their own pricing plan • Make sure each section drops a bit of delight • Provide a way out if a user isn’t interested (“buy our books instead”)
  • 48. Conversion.Personalization Provide a way out if a user isn’t interested… (“buy our books instead, join the club, subscribe for free tips”)
  • 58. Conversion.Framing Stay out of peoples’ cerebral cortex!
  • 65. Profits 21% Form Completion 54% Conversion.Framing 77% 19% 3% | 1% . 2% 9% 33% 66%

Editor's Notes

  1. Luke Wroblewski writes of a study that determined top-aligned labels result in the shortest completion times, due to the reduced amount of eye movement needed.  Placeholder text (a.k.a. hint text), on the other hand, is generally agreed to be the opposite of helpful. Including the label as placeholder causes it to disappear once the field gains focus, meaning the user can no longer view it. This causes strain on short-term memory and increases the chances of error.
  2. Tab tested.
  3. A mask only appears once a user focuses on a field, preventing the scanning issue. Masks format the text automatically, while the field is being filled out, allowing users to focus on the required data and more easily notice errors.
  4. Incentivizing conversion doesn’t always have to cost you money. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  5. Incentivizing conversion doesn’t always have to cost you money. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  6. Incentivizing conversion doesn’t always have to cost you money. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  7. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  8. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  9. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  10. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  11. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  12. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  13. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  14. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  15. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  16. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  17. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  18. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump
  19. Tim Ash (CEO of SiteTuners) Simon Sinek – The Golden Circle Cerebral cortex Limbic – Emotional memory 160th jump