Mobile UX Prototyping & Storytelling
•
5 likes•1,402 views
A very hands on 3 hour workshop where participants had to sketch and prototype specific app ideas per team. The presentation was projected onto a whiteboard where I wrote notes, sketches & examples needed.
Recommended
Recommended
More Related Content
Viewers also liked
Viewers also liked (20)
Similar to Mobile UX Prototyping & Storytelling
Similar to Mobile UX Prototyping & Storytelling (20)
More from Vincent Baskerville
More from Vincent Baskerville (9)
Recently uploaded
Recently uploaded (20)
Mobile UX Prototyping & Storytelling
- 2. MOBILE UX PROTOTYPING & STORYTELLING Presentation & Workshop by: Vince Baskerville | VP of Product TripLingo
- 3. THANK YOU SPONSORS VINCENT BASKERVILLE | VP of PRODUCT
- 4. VINCENT BASKERVILLE | VP of PRODUCT
- 5. 10 SIMPLE MOBILE PRINCIPLES VINCENT BASKERVILLE | VP of PRODUCT
- 6. CREATE A VISUAL HIERARCHY THAT MATCHES USERS NEEDS VINCENT BASKERVILLE | VP of PRODUCT
- 7. WEIGHT BALANCE VINCENT BASKERVILLE | VP of PRODUCT
- 8. THUMB OR FINGER RULE VINCENT BASKERVILLE | VP of PRODUCT
- 9. EASILY NAVIGABLE VINCENT BASKERVILLE | VP of PRODUCT
- 10. LIMIT DISTRACTIONS VINCENT BASKERVILLE | VP of PRODUCT
- 11. USE APPROPRIATE DEFAULTS VINCENT BASKERVILLE | VP of PRODUCT
- 12. MAKE ACTIONS REVERSIBLE VINCENT BASKERVILLE | VP of PRODUCT
- 13. BE CONSISTENT VINCENT BASKERVILLE | VP of PRODUCT
- 14. DON’T BE AFRAID TO SHOW SOME EMOTION VINCENT BASKERVILLE | VP of PRODUCT
- 15. AVOID JARGON VINCENT BASKERVILLE | VP of PRODUCT
- 16. RECAP 1. Create a visual hierarchy 6. Use appropriate defaults that matches users needs 7. Make actions reversible 2. Weight balance 8. Be consistent 3. Thumb or finger rule? 9. Don’t be afraid to show - don’t forget fat fingers some emotion 4. Easily navigable 10. Avoid jargon 5. Limit distractions VINCENT BASKERVILLE | VP of PRODUCT
- 17. •Truly understand your medium •Solve the right problem, don’t just make pretty interfaces •Try to keep things simple •but remember *Less is more* not always the answer VINCENT BASKERVILLE | VP of PRODUCT
- 18. SKETCH & WIREFRAME TIPS VINCENT BASKERVILLE | VP of PRODUCT
- 19. VERSUS VINCENT BASKERVILLE | VP of PRODUCT
- 20. NOT RECOMMENDED VINCENT BASKERVILLE | VP of PRODUCT
- 21. • Sketches aren’t the *product* • the focus isn’t instagrammable wireframes • Consider actual content • don’t get too caught up with lorem text • Focuson communication • remember the purpose of the interactions VINCENT BASKERVILLE | VP of PRODUCT
- 22. • Keep it fast and in short bursts • Sketches & prototypes should always be communicating those in between steps.. try not to leave anything for interpretation VINCENT BASKERVILLE | VP of PRODUCT
- 23. UNDERSTANDING MOBILE CONTEXT VINCENT BASKERVILLE | VP of PRODUCT
- 24. • Design for partial attention spans and interrupted states • We don’t just create interfaces.. remember to focus on interaction • Where will your users be? VINCENT BASKERVILLE | VP of PRODUCT
- 25. • Will they have gloves on? • Are they driving? • Walking and frustratingly looking for something? • Relaxed, sipping on a latte? VINCENT BASKERVILLE | VP of PRODUCT
- 26. SKETCH TIME VINCENT BASKERVILLE | VP of PRODUCT
- 27. BE RUTHLESS & BRAVE EDIT.. EDIT.. EDIT.. EDIT VINCENT BASKERVILLE | VP of PRODUCT
- 28. PROTOTYPING VINCENT BASKERVILLE | VP of PRODUCT
- 29. • Hi or lo fidelity? • Prototyping reduces misinterpretation • in comparison to detailed requirement docs • Remember to set expectations VINCENT BASKERVILLE | VP of PRODUCT
- 30. • Eventually saves time, money & overall effort • Helpsto create a constant feedback loop, which helps produce a better product • Thisisn’t a means to an end, but wrather it is to help better articulate ‘show & tell’ VINCENT BASKERVILLE | VP of PRODUCT
- 31. iterative feedback loop VINCENT BASKERVILLE | VP of PRODUCT
- 32. VINCENT BASKERVILLE | VP of PRODUCT
- 33. WHY PROTOTYPE? VINCENT BASKERVILLE | VP of PRODUCT
- 34. • It’ll help you improve design making decision • Communicate your ideas better & get buy-in from your team / client easily • Gather proper user feedback • Explore unknowns • Further refine concepts VINCENT BASKERVILLE | VP of PRODUCT
- 35. • Multiple ways to prototype your product • paper • power point / keynote • balsamiq • axure • adobe photoshop / fireworks / flash • html / js • etc... VINCENT BASKERVILLE | VP of PRODUCT
- 36. STORYTELLING VINCENT BASKERVILLE | VP of PRODUCT
- 37. The goal of sketches & prototypes is to convince yourself & others VINCENT BASKERVILLE | VP of PRODUCT
- 38. • Telling stories: • helps put a ‘face’ on data • helps paint in missing details from sketches & prototypes • helps encourage collaboration & innovation VINCENT BASKERVILLE | VP of PRODUCT
- 39. Stories turn profile information into a persona; with this information we can better design a solution for this & other similar user needs VINCENT BASKERVILLE | VP of PRODUCT
- 40. • Stories can illustrate problems & ‘pain points’ that wasn’t discovered through sketching prototypes VINCENT BASKERVILLE | VP of PRODUCT
- 41. INSTRUCTIONS / PEE BREAK VINCENT BASKERVILLE | VP of PRODUCT
- 42. WRAP UP VINCENT BASKERVILLE | VP of PRODUCT
- 43. THANK YOU SPONSORS VINCENT BASKERVILLE | VP of PRODUCT
- 44. AU REVOIR VINCE BASKERVILLE @WHOISVINCE VINCE@TRIPLINGO.COM VINCENT BASKERVILLE | VP of PRODUCT