Data Driven Design

1,027 views

Published on

Building interactive prototypes is becoming a standard in today’s UX practice. This allows to simulate and test the complete workflow in apps and applications. The biggest drawback though: most interactive prototypes are confined to being able to link between screens and enter data to test the affordance of forms.
This talk is about why it is important to build rich functional prototypes that focus on content and how this can be achieved. It gives an overview of the benefits and obstacles of data driven prototyping.

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

No Downloads
Views
Total views
1,027
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
12
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Data Driven Design

  1. 1. Memi Beltrame Data Driven Design UX Camp Zürich May 24. 2014
  2. 2. Memi Beltrame I make things fun and easy to use.
  3. 3. Users Love their Data.
  4. 4. Add complexity
  5. 5. Hence: Data Driven Design
  6. 6. Focus on Behaviour
  7. 7. Content First will change your workflow.
  8. 8. Asking the users the right questions at an early stage.
  9. 9. The point of DDD is to simulate everything users can do with data.
  10. 10. Things users can do with data • Read • Enter new • Edit & change existing • Delete • Search & Filter • Combine
  11. 11. The point of DDD is to simulate everything users can do with data. Simulation = Testing
  12. 12. Well, do you test?
  13. 13. Testing is the best way to making needs visible.
  14. 14. DDD Scenarios • A lot of different data. • Similar data with small differences that matter. • A lot of domain specific data.
  15. 15. A lot of data
  16. 16. Similar Data & 
 Domain specific Data
  17. 17. Prototype Data:! (Fonds in an application ! for bankers) VF - European Mid and Small Cap Equity B (Lux)! Aberdeen Global - Emerging Markets Equity A Acc! UBS (Lux) Medium Term Bond Fund - CHF P-acc! UBS (Lux) Medium Term Bond Fund - EUR P-acc! UBS (Lux) Medium Term Bond Fund - USD P-acc! Real Data:
  18. 18. Fake it till you make it.
  19. 19. Things to fake • Realistic data • Userroles (Authentication) • State
  20. 20. A Data Layer • Variables
 (e.g. to change the language of the prototype) • Session
 Make it possible to have persistent data to test the whole chain of event. • Datasets
 Simulate a lot of data, e.g. 200 news-entries.
  21. 21. Benchmarking
  22. 22. Benchmarking Ganz Grischa! Find Infos to Places in Grischun ! Paper Prototype 2 Screens + Lightbox
  23. 23. Benchmarking Prototype! ! - Use different Tools - Stop time - See what works
  24. 24. Tools • Balsamiq • Prototyper • Protostrap
  25. 25. Tools
  26. 26. Adobe Edge Reflow Balsamiq Axure Prototyper Protostrap Templates ✖ ✔ ✔ ✔ ✔ Data ✖ ✖ ✖ ✔ ✔ Variables! ✖ ✖ (✔) ✔ ✔ Session ✖ ✖ ✔ ✔ ✔ Testability on Device ✔ ✖ ✔ ✔ ✔ Responsive ✔ ✖ ✔ ✔ ✔ GUI ✔ ✔ ✔ ✔ ✖ Reuse ✔ ✖ ✖ ✖ ✔ Tool comparison
  27. 27. Prepare your designs for real data, or else…
  28. 28. Thank you! I’m @bratwurstkomet on Twitter Protostrap: http://protostrap.ch

×