Prototyping Ideas Simplicity is the ultimate sophistication Leonardo
- Slides: 21
Prototyping Ideas
“ Simplicity is the ultimate sophistication. -- Leonardo Da Vinci
13, 000 pages
Screen sketch Software Cardboard mockup 3 D printed model Video What does prototype mean in interaction design?
Communication Create shared preview among all stakeholders Decision-Making Compare design variations and resolve conflicts Evaluation & Feedback Fast and inexpensive ways to refine design Why do we need prototypes ?
High Medium Low Prototypes categorized by Fidelity
Low Medium Prototypes categorized by Fidelity High
Paper Prototypes categorized by Digital Medium
Only How to prototype ? 2 Steps ?!
r e p a P 1. Sketch key pages on separate paper 2. Specify how user will transition between them using Arrows 1. Create key pages by placing UI elements in the right place. 2. Add interactivity by establishing links between them D l a t i ig
anything 1 2 familiar?
1. Balsamiq Sketchy Style Balsamiq Mockups lightweight, low fidelity, rapid prototyping tool 75 built-in UI elements + 187 icons + UGC community Easy to use, intuitive, but not interactive enough
Widgets Workspace
2. Axure RP PS In Prototype Design Medium-high fidelity enterprise-level prototyping solution Generate realistic functional prototype without coding Highly interactive , longer learning curve
Sitemap d ad ag dr Interact ! Workspace Widgets Static property Masters Dynamic property Page
3. POP (Prototyping On Paper) Paper and Mobile Only! Hand-drawn joy + easy mobile presentation Design on paper Take pictures Simulate
Design in the wild…
Resources Printable sketching templates http: //www. tripwiremagazine. com/2012/07/free-printable-sketching-wireframing-templates. html Balsamiq Download: http: //balsamiq. com/download/ Liscense name: HCI Online 0214 Liscense key: e. Jzzz. U/OLi 0 odswsqv. Fw 9 l. Twz 8 v. Jz. Et. VMDAy. NKkx. NLY 0 Nj. M 0 Nz. MAg. Zq. QGk. MAR 9 g. NSA== UI Library: https: //mockupstogo. mybalsamiq. com/projects Chrome plug-in: https: //chrome. google. com/webstore/detail/balsamiq-mockups/pplbmgaodhjmbklkgkgmlghaekcfhhkk Example: http: //web. cs. dal. ca/~hzhou/3130/prototype/balsimiq. rar Axure 7: http: //www. axure. com/downloadthanks? dl=70 pc UI Library: http: //www. axure. com/community/widget-libraries Example: http: //web. cs. dal. ca/~hzhou/3130/prototype/axure. rar
POP https: //popapp. in/ Mockflow http: //www. mockflow. com/ Justinmind Download: http: //www. justinmind. com/ Installation instruction: http: //www. justinmind. com/media/Justinmind_Prototyper_license_installation. pdf Liscense key: JP-evaluation-50 -professional-42864482 -4473== By using this software and this academic licence provided for UC San Diego / Coursera you agree that the software will not be used on any projects whose outputs will be used by a commercial, government, political or religious organisation. If you cannot agree, you must purchase a full licence.
Reference 1. 2. 3. 4. 5. http: //arthistory. about. com/cs/namesdd/a/leonardo. htm http: //www. slideshare. net/UXPA/design-like-davinciv 11 web. nmsu. edu/~ogden/cs 485/class 9 -10. ppt http: //www. smashingmagazine. com/2010/06/16/designbetter-faster-with-rapid-prototyping/ http: //www. slideshare. net/Rachel_Hinman/mobileprototyping-essentials-workshop-part-2
Exercise Design a low-fidelity prototype (paper or digital) for at least one user story in your project. * Be sure to answer the following questions before you start: • Who is the user? • What is the task? • Why would the user need to complete this task? • When and Where (scenario/context)? • How could the user go through the task with your prototype?
- Leonardo fibonacci leonardo pisano (fibonacci)
- Maturity/sophistication ads examples
- Verbs of sophistication
- Stratégie de sophistication
- Brand resonance pyramid apple
- Attack sophistication vs intruder technical knowledge
- Blue chinese opera mask
- Political sophistication
- Sigma simplicity
- Affordability quality simplicity and accountability
- Simplicity is prosperity
- Simplicity favours regularity
- Simplicity is a great virtue
- Simplicity favours regularity
- Simplicity vs snapper
- Simplicity smart lockers
- Sigma simplicity
- Simplicity favours regularity
- Virtual router simplicity
- Operational simplicity
- Sigma simplicity
- Greek god of simplicity