Data driven design

405 views

Published on

Kelly Housholder, Emerald Coast WordPress Meetup, Data Driven design

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
405
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Data driven design

  1. 1. Data driven design
  2. 2. Don’t start from zero. source: http://www.fastcodesign.com/1672922/the-future-of-ux-design-tiny-humanizing-details Always know something about the user, the context, and the audience. Use that knowledge to make good guesses about what the user wants to do or know, then create shortcuts to that action or information.
  3. 3. source: http://www.fastcodesign.com/1672922/the-future-of-ux-design-tiny-humanizing-details Nothing should be arbitrary. Fluff should be eliminated. If an element is not essential to the goal of the site - it gets cut. Every layout, font, color and graphic is a deliberate, data based decision
  4. 4. "If everything is important, then nothing is." - PATRICK LENCIONI Establish goals and information heirarchy.
  5. 5. Information hierarchy: How should my site be organized?
  6. 6. Establishing heirarchy.
  7. 7. Where should the Call to Action (CTA) be? How much copywriting should I be using?
  8. 8. How to choose colors? Links, buttons, etc?
  9. 9. layout:kellyhousholder/design:saracannon
  10. 10. Bring the data FORWARD. Google Analytics (free) Clicktale.com (free trial, then paid) Usertesting.com (paid) mouseflow.com (paid, cheaper than clicktale) A/B Testing: Google Analytics Content Experiments (formerly Website Optimizer) (free) A/B Testing: Max A/B WordPress Plugin (free) A/B Testing:Optimizely.com
  11. 11. clicktale: heatmap
  12. 12. A/B testing
  13. 13. Golden rule: Test one variable at a time. Copywriting (easiest to test, highest ROI according web team that did the Obama campaign) CTA placement, color Image placement / Text placement
  14. 14. Don’t make assumptions.
  15. 15. Obama Website: Executed about 500 a/b tests, 20 month period, increased donation conversions by 49% and sign up conversions by 161%. source: http://kylerush.net/blog/optimization-at-the-obama-campaign-ab-testing/
  16. 16. Obama Website: By changing the photo on the splash page we lifted conversions by more than 19%. source: http://kylerush.net/blog/optimization-at-the-obama-campaign-ab-testing/
  17. 17. original source: http://blog.optimizely.com/2013/06/14/ea_simcity_optimizely_casestudy/ performed 43.4% better
  18. 18. - original - 30% better - 27% better - 15% better Writing Decisions: Headline tests on the Highrise signup page http://37signals.com/svn/posts/1525-writing-decisions-headline-tests-on-the-highrise-signup-page
  19. 19. Client trust & approval. Besides making your website better (!!) it helps your client relationships. Your clients will trust that you are making good decisions, based on data.
  20. 20. PUBLIC SERVICE ANNOUNCEMENT: typography.com - the best fonts on the interweb.

×