Prototypes

A prototype is a representation of a design before the final solution is decided upon, that is a prototype is a living representation of our idea and as our idea evolves to meet our challenges so does our prototype. Sometimes we drop our prototype and start fresh but we should always learn something from our prototypes, if not what works then definitely what doesn't and with these lessons we improve or build new prototypes that get us closer to a resolution or solve our problem becoming our finished product.

Reasons for prototyping 

• Reification: is the process of taking an idea or concept and making it real, by creating our prototypes we create the opportunity to verify our ideas are going to resolve our problems.
• Reflection: by createing a prototype it gives us a chance to reflect on our design to ensure that they are meeting the design goal or taking us in a different direction
• Communication: Prototypes communicate our design ideas to the stakeholders to validate that our solution is going to solve the right problem.
• Assessment: allow us to run user tests on our ideas to verify that they are going to satisfy user needs.

Various forms of a prototype

• Verbal description
• sketch or wireframe
• storyboard
• Navigation/flow diagram 
• Physical model
• Video
• Formal specifications 

any of the above are valid prototypes however in user experience we usually mean a depiction of the system as a user will experience it. there are vaious levels of prototype

• Low-fidelity
• Addresses
• Functionality of what needs to be done
• Organization of how the UI is going to look, grouping
• Task flow & Coverage: Solve the tasks users need and how many of them
• Ignores
• Graphics: colors, fonts
• Programming: no programming done on paper to keep costs down
• Real Data: don't wory about actual data
• Mid-fidelity
• Addresses
• Layout: how are the fields and controls going to be layed out
• Interactivity: How does it feel to interact with the system 
• Navigation: from one part of the system to another 
• Ignores
• Graphics: colors, fonts
• Programming: no programming done on paper to keep costs down
• Real Data: don't wory about actual data
• High-fidelity
• Addresses
• Graphic design: colors, fonts, images
• Interaction details: animations, transitions
• Realistic data: actual data for system 
• Ignores 
• Background programming: services, security, etc
• Complete functionality coverage: focused on task trying to resolve 

KISS (Keep it simple stupid)

The best prototype communicates the design idea in the simplest most economical way possible to the stakeholders or the team, the idea to prototype to most minimal level is to save time and money to let the needs of the product guide the design and not the prototype fashion the needs.

Low-fidelity prototypes will also receive more open and honest feedback, stakeholders are more likely to challenge a design when it's on paper than if significant resources where put into constructing it.

the iterative design process

Assess	Design	Build	Assess
Asses current needs Understanding current problem Establish guidelines & constraints Personas, scenarios, user stories, requirements	Ideation Sketching Selection Synthesis	Develop Prototype	Assessment redesign More prototyping

Sketching 

sketching is one of if not the most valuable tool in a UI/UX professionals box, sketching allows designers to workout problems quickly and cheaply. sketches have the following characteristics 

• Quick: to produce
• Timely: can be inserted in multiple ways
• inexpensive: cost is low
• disposable: you're not committed to them
• plentiful: you can make dozens if not more
• minimal: very little detail 
• ambiguity: let you evolve them

sketching is an activity it is central to the design process, it is not just the product of sketching it is also the process, it gives us an opportunity to: 

• reflect on our designs 
• explore directions they may lead
• communicate our ideas

What to sketch?

Problem: sketching what's wrong gives insight to what we are trying to solve

Resolution: what would it look like for the problem to be solved 

System: to solve the problem

Sketch		Prototype
Evocative	→	Didactic: try to explain
Suggest: possibilities & opportunities	→	Describe: a paticular idea
Explore: ideas	→	Refine: initial explorations
Question: raise questions about solution	→	Answer: try to answer questions
Propose: ideas	→	Test: ideas
Provoke: ideas push boundaries	→	Resolve: problems
Tentative: possibilities	→	Specific: testing potential solution
Noncommittal: no investment	→	Depiction: committing idea for testing

Sketches are used for generating ideas and creating options whereas prototyping is narrowing down ideas for problem resolution. sketching is used to come up with ideas and strategies whereas prototyping is used to narrow those ideas down to the ones that work best.

when sketching it's very common to get stuck, where as there are many ways to try and get unstuck there is one simple method known as "The worst idea" this is the processes of sketching the worst solution to your problem, the idea is that by understanding what not to do it may give you new insight on what to do.