SlideShare uma empresa Scribd logo
1 de 206
Baixar para ler offline
Title,[object Object],Mobile Prototyping Essentials,[object Object],UX Australia 2011,[object Object],Rachel Hinman,[object Object],Senior Research Scientist  ,[object Object],Nokia Research Lab ,[object Object],Palo Alto, California USA,[object Object],Hinman,[object Object]
I used to be a web designer, too,[object Object],2,[object Object]
What makes mobile UX different?,[object Object],Q:,[object Object],Q:,[object Object],3,[object Object]
A,[object Object],What are the similarities,[object Object],4,[object Object]
What are the similarities,[object Object],A,[object Object],:-(,[object Object],5,[object Object]
A,[object Object],What are the similarities,[object Object],6,[object Object]
?,[object Object],7,[object Object]
8,[object Object],Web designers know how to work in a rapidly evolving field,[object Object],8,[object Object]
Web designers know how to work in a rapidly evolving field,[object Object],Bad Decision-Making,[object Object],9,[object Object]
The final diamonds are where good design decisions matter most…,[object Object],…and where designers new to mobile have the least domain specific skill and confidence.,[object Object],10,[object Object]
Seated in a relatively predictable environment,[object Object],Large screen enables multi-tasking,[object Object],Keyboard and a mouse for input,[object Object],11,[object Object]
Differences in the mobile environment,[object Object],Highly variable context and environment,[object Object], Small screen size and limited text input,[object Object], UI takes up the entire screen ,[object Object], Difficult to multi-task and easy to get lost,[object Object],12,[object Object]
Designers new to mobile don’t have the domain specific skills or heuristics to lean on.,[object Object],A,[object Object],13,[object Object]
Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],Prototype,[object Object],14,[object Object]
PC Prototypingis considered a  ,[object Object],A,[object Object],Um… duh!,[object Object],Luxury,[object Object],15,[object Object]
Mobile Prototyping is,[object Object],Essential,[object Object],A,[object Object],16,[object Object]
The best way to develop those skills is to prototype early ,[object Object],and often.,[object Object],17,[object Object]
A,[object Object],Prototypes are the ultimate ,[object Object],decision-making aid,[object Object],18,[object Object]
Our plan for today…,[object Object],Our plan for today,[object Object],Review the  four “whys” of mobile prototyping,[object Object],Identify the two genres of prototyping and overview of six prototyping methods,[object Object],Review the key differences between NUI and GUI interfaces,[object Object],Overview of animation principles that can be incorporated into your mobile experiences,[object Object],Three hands-on activities,[object Object],19,[object Object]
Our plan for today…,[object Object],Our plan for today,[object Object],Review the  four “whys” of mobile prototyping,[object Object],Identify the two genres of prototyping and overview of six prototyping methods,[object Object],Review the key differences between NUI and GUI interfaces,[object Object],Overview of animation principles that can be incorporated into your mobile experiences,[object Object],Three hands-on activities,[object Object],20,[object Object]
Our plan for today…,[object Object],Our plan for today,[object Object],Review the  four “whys” of mobile prototyping,[object Object],Identify the two genres of prototyping and overview of six prototyping methods,[object Object],Review the key differences between NUI and GUI interfaces,[object Object],Overview of animation principles that can be incorporated into your mobile experiences,[object Object],Three hands-on activities,[object Object],21,[object Object]
Our plan for today…,[object Object],Our plan for today,[object Object],Review the  four “whys” of mobile prototyping,[object Object],Identify the two genres of prototyping and overview of six prototyping methods,[object Object],Review the key differences between NUI and GUI interfaces,[object Object],Overview of animation principles that can be incorporated into your mobile experiences,[object Object],Three hands-on activities,[object Object],22,[object Object]
Our plan for today…,[object Object],Our plan for today,[object Object],Review the  four “whys” of mobile prototyping,[object Object],Identify the two genres of prototyping and overview of six prototyping methods,[object Object],Review the key differences between NUI and GUI interfaces,[object Object],Overview of animation principles that can be incorporated into your mobile experiences,[object Object],Three hands-on activities,[object Object],23,[object Object]
Okay, let’s get started!,[object Object],Okay… let’s get started,[object Object],24,[object Object]
Prototyping,[object Object],25,[object Object]
steal this slide!,[object Object],“Whys” of prototyping,[object Object],Improve your design decision-making,[object Object],Communicate an Idea,[object Object],Gather User Feedback,[object Object],Explore the “Unknowns”,[object Object],Fine-tune an Idea,[object Object],26,[object Object]
Communicating an Idea or Experience,[object Object],YouTube Video,[object Object],27,[object Object]
Hypothesis vs. Agenda,[object Object],Gather User Feedback,[object Object],28,[object Object]
Hypothesis vs. Agenda,[object Object],Explore the Unknowns,[object Object],29,[object Object]
Hypothesis vs. Agenda,[object Object],Fine-Tune an Idea,[object Object],30,[object Object]
Two Genres,[object Object],31,[object Object]
Hypothesis vs. Agenda,[object Object],Experiential Prototyping,[object Object],32,[object Object]
Tactical Prototyping,[object Object],33,[object Object]
You are working on a “broader” mobile project.,[object Object],1,[object Object],Sympathy to context principles,[object Object],Experiential Prototyping:,[object Object],Best suited for design explorations where:,[object Object],steal this slide!,[object Object],2,[object Object],Target mobile hardware and software scope is unknown.(perhaps being created).,[object Object],3,[object Object],The design space is relatively unchartered. ,[object Object],34,[object Object]
You are working on a “focused” mobile project.,[object Object],1,[object Object],Sympathy to context principles,[object Object],Tactical Prototyping:,[object Object],Best suited for design explorations where:,[object Object],steal this slide!,[object Object],2,[object Object],Target mobile hardware and software scope is known.,[object Object],3,[object Object],The design space is relatively known.,[object Object],35,[object Object]
Experiential Prototyping,[object Object],36,[object Object]
37,[object Object]
38,[object Object]
Context Matters,[object Object],39,[object Object]
Context will likely beyour blindside,[object Object],40,[object Object]
Context Framework,[object Object],Context Framework,[object Object],steal this slide!,[object Object],41,[object Object]
Context Framework,[object Object],Context Framework,[object Object],steal this slide!,[object Object],42,[object Object]
Experiential Prototypingwill help you understand,[object Object],context,[object Object],43,[object Object]
Sympathy to context principles,[object Object],Experiential Prototyping:,[object Object],Best suited for design explorations where:,[object Object],You are working on a “broader” mobile project.,[object Object],1,[object Object],Target mobile hardware and software scope is unknown.(perhaps being created).,[object Object],2,[object Object],The design space is relatively unchartered. ,[object Object],3,[object Object]
What we learned from the web,[object Object],Experiential Prototypes,[object Object],Body Storming,[object Object],Speed Dating Prototypes,[object Object],Concept Videos,[object Object],Storyboarding,[object Object]
Paper Prototype example,[object Object],Bodystorming,[object Object],46,[object Object]
Through Lines,[object Object]
Mobile Prototyping Essentials
Mobile Prototyping Essentials
Mobile Prototyping Essentials
Mobile Prototyping Essentials
In reality… people’s lives are messy,[object Object]
Paper Prototype example,[object Object],Similar to improvisational theater, body storming involves acting out possible scenarios or use cases with actors and props. Unlike computer-based technology that is logic based and only makes visible the conditions that existed before, people are illogical, perceptive, aware, and self-correcting. Body storming is a technique that helps capture and harness these messy yet essential aspects of human behavior and account for them in the mobile design process.,[object Object],53,[object Object]
Select groups of five to eight participants in a troupe. ,[object Object],Photo by Christian Crumlish (xian), 2009 on Flickr,[object Object],54,[object Object]
Paper Prototype example,[object Object],Select groups of five to eight participants in a troupe. ,[object Object],Identify 3-5 experience scenarios for your troupe to “perform.” Examples: Purchasing a cup of coffee with my iPhone, selecting which phone to purchase in a carrier’s store. ,[object Object],Photo by Christian Crumlish (xian), 2009 on Flickr,[object Object],55,[object Object]
Paper Prototype example,[object Object],3. Every player must have a role; there should be no “trees” that are just for background. Use large cards that label the roles people are playing.,[object Object], ,[object Object],56,[object Object],Photo by Christian Crumlish (xian), 2009 on Flickr,[object Object]
Paper Prototype example,[object Object], 4. Props can have feelings, thoughts, and the ability to speak. Use thought-bubble cards to show what a participant is thinking versus saying. ,[object Object],Photo by Christian Crumlish (xian), 2009 on Flickr,[object Object],57,[object Object]
Paper Prototype example,[object Object],5. Have a narrator or color commentator who can explain things. The narrator can pretend the scenario is like television, using a remote to stop action, rewind, or fast-forward.,[object Object],Photo by Christian Crumlish (xian), 2009 on Flickr,[object Object],58,[object Object]
Paper Prototype example,[object Object],6. De-brief after each scenario. What did the group learn? What was surprising? What seemed important? Capture what you learned from the exercise and discuss how you can integrate it into what happens next. ,[object Object],Photo by Christian Crumlish (xian), 2009 on Flickr,[object Object],59,[object Object]
Bodystorming will help you capture the emotional tenor of mobile interactions,[object Object],60,[object Object]
Paper Prototype example,[object Object],Design in Context,[object Object],61,[object Object]
What we learned from the web,[object Object],Experiential Prototypes,[object Object],Body Storming,[object Object],Speed Dating Prototypes,[object Object],Concept Videos,[object Object],Storyboarding,[object Object]
Paper Prototype example,[object Object],Speed Dating Prototypes,[object Object],Illustration courtesy of Scott Davidoff Rapidly Exploring Application Design through Speed Dating,[object Object],63,[object Object]
Paper Prototype example,[object Object],Scott Davidoff of CMU,[object Object],[object Object]
High Cost of Failure
Unpredictable social consequencesRapidly Exploring Application Design through Speed Dating,[object Object],64,[object Object]
Speed Dating Prototypes,[object Object],Builds on three theories:,[object Object],1,[object Object],Abundance brings perspective.,[object Object],Need to cross boundaries to know they exist.,[object Object],2,[object Object],Multiple low-cost engagements with multiple concepts enables a broader perspective to emerge. ,[object Object],3,[object Object],65,[object Object]
“in the wild” ideation,[object Object],Step One,[object Object],Identify most promising,[object Object],concepts,[object Object],66,[object Object]
Paper Prototype example,[object Object],Step Two,[object Object],Create storyboards thatdepict each concept,[object Object],Illustration courtesy of Scott Davidoff Rapidly Exploring Application Design through Speed Dating,[object Object],67,[object Object]
Paper Prototype example,[object Object],Step Three,[object Object],Present storyboards tousers & gather feedback,[object Object],68,[object Object]
Step Four,[object Object],Create prototypes,[object Object],Photo courtesy of Scott Davidoff Rapidly Exploring Application Design through Speed Dating,[object Object],69,[object Object]
Step Five,[object Object],Conduct user enactments with prototypes,[object Object],Photo courtesy of Scott Davidoff Rapidly Exploring Application Design through Speed Dating,[object Object],70,[object Object]
Speed Dating Prototypes are especially well-suited for gathering user impressions of a new-to-the-world experience,[object Object],71,[object Object]
What we learned from the web,[object Object],Experiential Prototypes,[object Object],Body Storming,[object Object],Speed Dating Prototypes,[object Object],Concept Videos,[object Object],Storyboarding,[object Object]
Paper Prototype example,[object Object],Concept Videos,[object Object],Nokia 888 communicator concept phone design by Tamer Nakisci,[object Object],73,[object Object]
Paper Prototype example,[object Object],74,[object Object]
Paper Prototype example,[object Object],75,[object Object],75,[object Object]
Paper Prototype example,[object Object],Concept Videos,[object Object],Pros,[object Object],[object Object]
Highly Shareable
Good for High-Level  Ideas
Technology still in  development 76,[object Object]
Paper Prototype example,[object Object],Concept Videos,[object Object],Pros,[object Object],Cons,[object Object],[object Object]
Highly Shareable
Good for High-Level  Ideas
Technology still in  development
Resource Intensive!!!
Skill Intensive
Cultural Fit
Concept videos don’t   make bad ideas good.77,[object Object]
The first step of creating a concept video is….,[object Object],78,[object Object]
What we learned from the web,[object Object],Experiential Prototypes,[object Object],Body Storming,[object Object],Speed Dating Prototypes,[object Object],Concept Videos,[object Object],Storyboarding,[object Object],79,[object Object]
Paper Prototype example,[object Object],Storyboarding,[object Object],80,[object Object]
“in the wild” ideation,[object Object],81,[object Object]
What we learned from the web,[object Object],Mobile UX Storyboarding,[object Object],Identify the central idea(s) you are trying to communicate. ,[object Object],82,[object Object]
What we learned from the web,[object Object],Mobile UX Storyboarding,[object Object],Identify the central idea(s) you are trying to communicate. ,[object Object],Create a character and identify the key issues he/she currently faces. ,[object Object],83,[object Object]
What we learned from the web,[object Object],Mobile UX Storyboarding,[object Object],Identify the central idea(s) you are trying to communicate. ,[object Object],Create a character and identify the key issues he/she currently faces. ,[object Object],Rough out a basic story. ,[object Object],84,[object Object]
What we learned from the web,[object Object],Mobile UX Storyboarding,[object Object],Identify the central idea(s) you are trying to communicate. ,[object Object],Create a character and identify the key issues he/she currently faces. ,[object Object],Rough out a basic story. ,[object Object],Start filling in the cells. Rough out the complete story, then fill in details. ,[object Object],85,[object Object]
What we learned from the web,[object Object],Mobile UX Storyboarding,[object Object],Identify the central idea(s) you are trying to communicate. ,[object Object],Create a character and identify the key issues he/she currently faces. ,[object Object],Rough out the basic story ,[object Object],Start filling in the cells. Rough out the complete story, then fill in details. ,[object Object],86,[object Object]
Paper Prototype example,[object Object],87,[object Object]
Paper Prototype example,[object Object],88,[object Object]
Pivoting people through information,[object Object],Your Design Challenge!,[object Object],Storyboarding,[object Object],Activity,[object Object],89,[object Object]
Pivoting people through information,[object Object],Your Design Challenge!,[object Object],Storyboarding: Ideas,[object Object],Activity,[object Object],90,[object Object]
Your Design Challenge!,[object Object],Storyboarding,[object Object],Activity,[object Object],Select one concept you’d like to explore more deeply using the storyboarding technique.,[object Object],Storyboard one scenario using the templates provided.,[object Object],Remember to identify the key issues the character faces and rough out the complete story before filling in details.  ,[object Object],1,[object Object],2,[object Object],3,[object Object]
Hypothesis vs. Agenda,[object Object],Tactical Prototyping,[object Object]
What we learned from the web,[object Object],steal this slide!,[object Object],Tactical Prototypes,[object Object],Sketching/Paper Prototyping,[object Object],In-Screen Mobile Prototypes,[object Object],Mobile Browser Prototypes,[object Object],Keynote/Powerpoint Prototypes,[object Object],Flash Prototype,[object Object],Platform Specific Prototype,[object Object],93,[object Object]
steal this slide!,[object Object],Tactical Prototypes,[object Object],Sketching/Paper Prototyping,[object Object],In-Screen Mobile Prototypes,[object Object],Mobile Browser Prototypes,[object Object],Keynote/Powerpoint Prototypes,[object Object],Flash Prototype,[object Object],Platform Specific Prototype,[object Object],94,[object Object]
Hypothesis vs. Agenda,[object Object],Sketching,[object Object],95,[object Object]
Hypothesis vs. Agenda,[object Object],Great mobile UIs,[object Object],speak their power,[object Object],96,[object Object]
Speak their power?,[object Object],Huh?,[object Object],Q:,[object Object],A,[object Object],97,[object Object]
A light switch,[object Object],98,[object Object]
Shopping cart,[object Object],99,[object Object]
100,[object Object]
We can annotate expectations in the web world,[object Object],We can annotate expectations,[object Object],in the web world,[object Object],101,[object Object]
We can annotate expectations in the web world,[object Object],REALLY!Look inside the book,[object Object],Free two-day shipping,[object Object],Look inside the book,[object Object],Get it new OR used!,[object Object],Sell mine,[object Object],Add to cart,[object Object],Shipping!,[object Object],Collectible!,[object Object],Maybe a kindle!,[object Object],102,[object Object]
Options have to be apparent and intuitive in mobile for people to ,[object Object],103,[object Object]
104,[object Object],Text entry will never be easy,[object Object],Design for partial attention andinterruption,[object Object]
How do you make interfaces that speak their power,[object Object],How do I create mobile interfaces that “speak their power”?,[object Object],Q:,[object Object],A,[object Object],105,[object Object]
Web designers know how to work in a rapidly evolving field,[object Object],Edit!!!,[object Object],106,[object Object]
Web designers know how to work in a rapidly evolving field,[object Object],RuthlessEditing,[object Object],107,[object Object]
108,[object Object],Wireframe,[object Object],A Brave NUI World,[object Object]
Wireframe,[object Object],109,[object Object]
Seated in a relatively predictable environment,[object Object],Large screen enables multi-tasking,[object Object],Keyboard and a mouse for input,[object Object],110,[object Object]
111,[object Object],Wireframe,[object Object],We’re reaching the edges ,[object Object],of what GUI can do,[object Object]
Wireframe,[object Object],Most mobile smartphones,[object Object],have touchscreens with Natural User Interfaces,[object Object],112,[object Object]
113,[object Object],Wireframe,[object Object],GUIs Become Brittle,[object Object],on a Mobile Device,[object Object]
Hypothesis vs. Agenda,[object Object]
Hypothesis vs. Agenda,[object Object]
116,[object Object],Wireframe,[object Object]
Wireframe,[object Object],GUI/NUI Chasm,[object Object],117,[object Object]
Key differences between NUI and GUI,[object Object],Okay… let’s get started,[object Object],118,[object Object]
Defining Attributes of ,[object Object],GUIs…,[object Object],119,[object Object]
Paper Prototype example,[object Object],GUI Mental Model = ,[object Object],Computer as tool,[object Object],120,[object Object]
Paper Prototype example,[object Object],GUI = Recognition,[object Object],“What you see is what you get”,[object Object],121,[object Object]
Wireframe,[object Object],GUI = Metaphorics, containment and place,[object Object],122,[object Object]
GUIs = Heavy Chrome, Icons & Buttons,[object Object],123,[object Object]
Defining Attributes of ,[object Object],NUIs…,[object Object],124,[object Object]
Paper Prototype example,[object Object],NUI Mental Model = ,[object Object],Computer as media,[object Object],125,[object Object]
Paper Prototype example,[object Object],NUI = Intuition,[object Object],“What you do is what you get”,[object Object],126,[object Object]
127,[object Object],Wireframe,[object Object],NUI = Fluid, Unmediated, and Organic,[object Object]
NUIs = Content is the Star,[object Object],It’s like a game of cards,[object Object],128,[object Object]
Differences in the mobile environment,[object Object],Highly variable context and environment,[object Object], Small screen size and limited text input,[object Object], UI takes up the entire screen ,[object Object], Difficult to multi-task and easy to get lost,[object Object],129,[object Object]
Paper Prototype example,[object Object],GUI = Experiences are anchored,[object Object],130,[object Object]
Paper Prototype example,[object Object],NUI = Experiences Unfold,[object Object],131,[object Object]
Paper Prototype example,[object Object],NUIs Unfold Like a Game,[object Object],132,[object Object]
NUIs Can Feel Anchor-less,[object Object],133,[object Object]
Differences in the mobile environment,[object Object],134,[object Object]
The Nested Doll Pattern,[object Object],1,[object Object],Sympathy to context principles,[object Object],steal this slide!,[object Object],Mobile Experiences Unfold,[object Object],Patterns for how mobile experiences unfold and progressively reveal their nature,[object Object],The Hub and Spoke Pattern,[object Object],2,[object Object],The Bento Box Pattern,[object Object],3,[object Object],The Filtered View Pattern,[object Object],4,[object Object],135,[object Object]
Paper Prototype example,[object Object],Nested Doll Pattern,[object Object],136,[object Object]
Paper Prototype example,[object Object],Hub and Spoke Pattern,[object Object],137,[object Object]
Paper Prototype example,[object Object],Bento Box Pattern,[object Object],138,[object Object]
Paper Prototype example,[object Object],Filtered View Pattern,[object Object],139,[object Object]
How do you make interfaces that speak their power,[object Object],A,[object Object],Trick to unfolding = ,[object Object],Information boulders to pebbles,[object Object],140,[object Object]
How do you make interfaces that speak their power,[object Object],A,[object Object],141,[object Object]
A,[object Object],142,[object Object]
Pivoting people through information,[object Object],Your Design Challenge!,[object Object],From GUI to NUI,[object Object],Activity,[object Object],143,[object Object]
Pivoting people through information,[object Object],Your Design Challenge!,[object Object],From GUI to NUI,[object Object],Activity,[object Object],Identify an interaction sequence you’d like to recreate using NUI principles.,[object Object],Sketch out the interaction using the templates provided.,[object Object],Identify how you’d like your mobile experience to unfold.,[object Object],1,[object Object],2,[object Object],3,[object Object],144,[object Object]
Pivoting people through information,[object Object],145,[object Object]
Pivoting people through information,[object Object],146,[object Object]
REMEMBER!,[object Object],It’s easy to go crazy and try to do it all.Instead, focus on applying what we’ve covered…,[object Object],Activity,[object Object],Understanding the differences between graphical and natural user interfaces.,[object Object],Experimenting with how your mobile experience can unfold and and progressively reveal its nature.,[object Object],Play around with the unfolding patterns that have been presented… or invent some of your own. ,[object Object],147,[object Object]
Differences in the mobile environment,[object Object],148,[object Object]
Paper In-Screen Prototypes,[object Object],Following Process documented by Diego Pulidovia UX Magazine – Paper In-Screen PrototypesPhotos courtesy of Diego Pulido and UX Magazine,[object Object],149,[object Object]
Paper Prototype example,[object Object],1. Sketch screen layouts. ,[object Object], ,[object Object],  ,[object Object],150,[object Object],Photo courtesy of Diego Pulido and UX Magazine,[object Object]
Paper Prototype example,[object Object],1. Sketch screen layouts. ,[object Object], ,[object Object],2. Scan or photograph ,[object Object],    the sketches. ,[object Object], ,[object Object], 	,[object Object],151,[object Object],Photo courtesy of Diego Pulido and UX Magazine,[object Object]
Paper Prototype example,[object Object],1. Sketch screen layouts. ,[object Object], ,[object Object],2. Scan or photograph ,[object Object],    the sketches. ,[object Object],3. Making sizing,[object Object],    adjustments to the,[object Object],    files.,[object Object], ,[object Object], ,[object Object], ,[object Object], ,[object Object],152,[object Object],Photo courtesy of Diego Pulido and UX Magazine,[object Object]
Paper Prototype example,[object Object], 4. Save the resized images in a file format supported by the mobile device. Be mindful of the sequencing of your screens and label files accordingly.,[object Object], ,[object Object], ,[object Object], ,[object Object],153,[object Object],Photo courtesy of Diego Pulido and UX Magazine,[object Object]
 4. Save the resized images in a file format supported by the mobile device. Be mindful of the sequencing of your screens and label files accordingly.,[object Object],5. Import the files into the mobile device’s photo gallery. ,[object Object], ,[object Object],  ,[object Object], ,[object Object], ,[object Object],154,[object Object],Photo courtesy of Diego Pulido and UX Magazine,[object Object]
Paper Prototype example,[object Object],4. Save the resized images in a file format supported by the mobile device. Be mindful of the sequencing of your screens and label files accordingly.,[object Object],5. Import the files into the mobile device’s photo gallery. ,[object Object],6. Click and swipe away. ,[object Object], ,[object Object], ,[object Object], ,[object Object], ,[object Object], ,[object Object],155,[object Object],Photo courtesy of Diego Pulido and UX Magazine,[object Object]
Your Design Challenge!,[object Object],Create an in-screen prototype.,[object Object],Activity,[object Object],Hang your screen designs on the wall.,[object Object],Photograph each design.,[object Object],Transfer photos from the camera to computer and make any sizing adjustments.,[object Object],Sync images to your mobile device and swipe away…. ,[object Object],156,[object Object]
What we learned from the web,[object Object],steal this slide!,[object Object],Tactical Prototypes,[object Object],Sketching,[object Object],In-Screen Mobile Prototypes,[object Object],Mobile Browser Prototypes,[object Object],Keynote/Powerpoint Prototypes,[object Object],Flash Prototype,[object Object],Platform Specific Prototype,[object Object],157,[object Object]
Paper Prototype example,[object Object],Paper Prototyping,[object Object],158,[object Object]
159,[object Object]
Paper Prototype example,[object Object],Mobile Browser Prototypes,[object Object],160,[object Object]
Paper Prototype example,[object Object],Keynote/Powerpoint Prototypes,[object Object],161,[object Object]
Paper Prototype example,[object Object],162,[object Object]
Paper Prototype example,[object Object],LOGO,[object Object],Tagline,[object Object],Edit,[object Object],163,[object Object]
Paper Prototype example,[object Object],LOGO,[object Object],Tagline,[object Object],Sydney Opera House,[object Object],There is no doubt that the Sydney Opera House is his masterpiece. It is one of the great iconic buildings of the 20th century, an image of great beauty that has become known throughout the world – a symbol for not only a city, but a whole country and continent.,[object Object],Edit,[object Object],164,[object Object]
Paper Prototype example,[object Object],LOGO,[object Object],Tagline,[object Object],Sydney Opera House,[object Object],There is no doubt that the Sydney Opera House is his masterpiece. It is one of the great iconic buildings of the 20th century, an image of great beauty that has become known throughout the world – a symbol for not only a city, but a whole country and continent.,[object Object],Edit,[object Object],165,[object Object]
Paper Prototype example,[object Object],LOGO,[object Object],Tagline,[object Object],Sydney Opera House,[object Object],There is no doubt that the Sydney Opera House is his masterpiece. It is one of the great iconic buildings of the 20th century, an image of great beauty that has become known throughout the world – a symbol for not only a city, but a whole country and continent.,[object Object],Edit,[object Object],166,[object Object]
Paper Prototype example,[object Object],LOGO,[object Object],Tagline,[object Object],LOGO,[object Object],Tagline,[object Object],Sydney Opera House,[object Object],There is no doubt that the Sydney Opera House is his masterpiece. It is one of the great iconic buildings of the 20th century, an image of great beauty that has become known throughout the world – a symbol for not only a city, but a whole country and continent.,[object Object],Edit,[object Object],Edit,[object Object],167,[object Object],167,[object Object],Paper Prototype example,[object Object]
Paper Prototype example,[object Object],LOGO,[object Object],Tagline,[object Object],Edit,[object Object],168,[object Object]
What we learned from the web,[object Object],Reasons for Prototyping in Keynote/Powerpoint,[object Object],steal this slide!,[object Object],It’s super efficient and fast!,[object Object],Level of fidelity is high – gives you an end result that looks and feels like a real app.,[object Object],Supports *some* gestures and transitions.,[object Object],It’s as close as you can get to the real thing without digging into code. ,[object Object],169,[object Object]
What we learned from the web,[object Object],Reasons for Prototyping in Keynote/Powerpoint,[object Object],steal this slide!,[object Object],It’s super efficient and fast!,[object Object],Level of fidelity is high – gives you an end result that looks and feels like a real app.,[object Object],Supports *some* gestures and transitions.,[object Object],It’s as close as you can get to the real thing without digging into code. ,[object Object],170,[object Object]
Paper Prototype example,[object Object],Motion:,[object Object],New Design Material,[object Object],171,[object Object]
What we learned from the web,[object Object],Animation & TransitionsA new design elements that can:,[object Object],steal this slide!,[object Object],Reinforce cognition.,[object Object],Help users form a mental model of how information will “unfold”.,[object Object],Provide cues for interaction.,[object Object],Help make your experience feel more intuitive for users. ,[object Object],172,[object Object]
Paper Prototype example,[object Object],Twelve Basic Principles ,[object Object],of Animation,[object Object],173,[object Object]
Paper Prototype example,[object Object],Principle One,[object Object],Squash and Stretch,[object Object],174,[object Object]
Paper Prototype example,[object Object],Principle One,[object Object],Squash and Stretch,[object Object],175,[object Object]
Paper Prototype example,[object Object],Principle Two,[object Object],Anticipation,[object Object],176,[object Object]
Paper Prototype example,[object Object],Principle Two,[object Object],Anticipation,[object Object],177,[object Object]
Paper Prototype example,[object Object],Principle Three,[object Object],Staging,[object Object],178,[object Object]
Paper Prototype example,[object Object],Principle Three,[object Object],Staging,[object Object],179,[object Object]
Paper Prototype example,[object Object],Principle Four,[object Object],Straight Ahead ,[object Object],and Pose to Pose,[object Object],180,[object Object]
Paper Prototype example,[object Object],Principle Four,[object Object],Straight Ahead ,[object Object],and Pose to Pose,[object Object],181,[object Object]
Paper Prototype example,[object Object],Principle Five,[object Object],Follow Through,[object Object],and Overlapping Action,[object Object],182,[object Object]
Paper Prototype example,[object Object],Principle Five,[object Object],Follow Through,[object Object],and Overlapping Action,[object Object],183,[object Object]
Paper Prototype example,[object Object],Principle Six,[object Object],Slow in and Out,[object Object],184,[object Object]
Paper Prototype example,[object Object],Principle Six,[object Object],Slow in and Out,[object Object],185,[object Object]
Paper Prototype example,[object Object],Principle Seven,[object Object],Arcs,[object Object],186,[object Object]
Paper Prototype example,[object Object],Principle Seven,[object Object],Arcs,[object Object],187,[object Object]
Paper Prototype example,[object Object],Principle Eight,[object Object],Secondary Action,[object Object],188,[object Object]
Paper Prototype example,[object Object],Principle Eight,[object Object],Secondary Action,[object Object],189,[object Object]
Paper Prototype example,[object Object],Principle Nine,[object Object],Timing,[object Object],190,[object Object]
Paper Prototype example,[object Object],Principle Nine,[object Object],Timing,[object Object],191,[object Object]
Paper Prototype example,[object Object],Principle Ten,[object Object],Exaggeration,[object Object],192,[object Object]
Paper Prototype example,[object Object],Principle Ten,[object Object],Exaggeration,[object Object],193,[object Object]
Paper Prototype example,[object Object],Principle Eleven and Twelve,[object Object],Solid Drawing and Appeal,[object Object],194,[object Object]

Mais conteúdo relacionado

Mais procurados

The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)
The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)
The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)Dave Hogue
 
User Centered Design & User Experience
User Centered Design & User ExperienceUser Centered Design & User Experience
User Centered Design & User ExperienceWouter Walgraeve
 
6 Rules of User Interface Design
6 Rules of User Interface Design6 Rules of User Interface Design
6 Rules of User Interface DesignDeepak Sahni
 
The Complexity of Simplicity
The Complexity of SimplicityThe Complexity of Simplicity
The Complexity of SimplicityDan Saffer
 
Agile Architecture and Modeling - Where are we Today
Agile Architecture and Modeling - Where are we TodayAgile Architecture and Modeling - Where are we Today
Agile Architecture and Modeling - Where are we TodayGary Pedretti
 
UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...
UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...
UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...UXPA International
 
An introduction to ergonomics for mobile UX (Ux in the City)
An introduction to ergonomics for mobile UX (Ux in the City)An introduction to ergonomics for mobile UX (Ux in the City)
An introduction to ergonomics for mobile UX (Ux in the City)Neil Turner
 
Beyond Staggered Sprints: Integrating User Experience and Agile
Beyond Staggered Sprints: Integrating User Experience and AgileBeyond Staggered Sprints: Integrating User Experience and Agile
Beyond Staggered Sprints: Integrating User Experience and AgileJeff Gothelf
 
UI For Alien Cowboys
UI For Alien CowboysUI For Alien Cowboys
UI For Alien CowboysMatt Jones
 
Why UX is Important
Why UX is Important Why UX is Important
Why UX is Important Chris Becker
 
UX (User Experience) Process, May 2017
UX (User Experience) Process, May 2017UX (User Experience) Process, May 2017
UX (User Experience) Process, May 2017Gary Coker
 
Remixing Mobile User Experience
Remixing Mobile User ExperienceRemixing Mobile User Experience
Remixing Mobile User ExperienceJason Mesut
 
Technology as a Cultural Practice - UX Australia
Technology as a Cultural Practice - UX AustraliaTechnology as a Cultural Practice - UX Australia
Technology as a Cultural Practice - UX AustraliaRachel Hinman
 
They Call it Surfing for a Reason
They Call it Surfing for a ReasonThey Call it Surfing for a Reason
They Call it Surfing for a ReasonRachel Hinman
 
UX/Design Thinking Prototyping Workshop
UX/Design Thinking Prototyping Workshop UX/Design Thinking Prototyping Workshop
UX/Design Thinking Prototyping Workshop Chris Becker
 
Effective prototyping
Effective prototypingEffective prototyping
Effective prototypingEverett McKay
 
Effective prototyping (for Vermont Code Camp)
Effective prototyping (for Vermont Code Camp)Effective prototyping (for Vermont Code Camp)
Effective prototyping (for Vermont Code Camp)Everett McKay
 

Mais procurados (20)

The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)
The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)
The Complexity Curve: How to Design for Simplicity (SXSW, March 2012)
 
User Centered Design & User Experience
User Centered Design & User ExperienceUser Centered Design & User Experience
User Centered Design & User Experience
 
6 Rules of User Interface Design
6 Rules of User Interface Design6 Rules of User Interface Design
6 Rules of User Interface Design
 
The Complexity of Simplicity
The Complexity of SimplicityThe Complexity of Simplicity
The Complexity of Simplicity
 
Agile Architecture and Modeling - Where are we Today
Agile Architecture and Modeling - Where are we TodayAgile Architecture and Modeling - Where are we Today
Agile Architecture and Modeling - Where are we Today
 
UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...
UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...
UXPA2019 Optimal AR UX for Complex Purchases — How immersive technology boost...
 
An introduction to ergonomics for mobile UX (Ux in the City)
An introduction to ergonomics for mobile UX (Ux in the City)An introduction to ergonomics for mobile UX (Ux in the City)
An introduction to ergonomics for mobile UX (Ux in the City)
 
Beyond Staggered Sprints: Integrating User Experience and Agile
Beyond Staggered Sprints: Integrating User Experience and AgileBeyond Staggered Sprints: Integrating User Experience and Agile
Beyond Staggered Sprints: Integrating User Experience and Agile
 
UI For Alien Cowboys
UI For Alien CowboysUI For Alien Cowboys
UI For Alien Cowboys
 
The Art of Creativity
The Art of CreativityThe Art of Creativity
The Art of Creativity
 
Why UX is Important
Why UX is Important Why UX is Important
Why UX is Important
 
Rulespace
RulespaceRulespace
Rulespace
 
UX (User Experience) Process, May 2017
UX (User Experience) Process, May 2017UX (User Experience) Process, May 2017
UX (User Experience) Process, May 2017
 
Remixing Mobile User Experience
Remixing Mobile User ExperienceRemixing Mobile User Experience
Remixing Mobile User Experience
 
Technology as a Cultural Practice - UX Australia
Technology as a Cultural Practice - UX AustraliaTechnology as a Cultural Practice - UX Australia
Technology as a Cultural Practice - UX Australia
 
They Call it Surfing for a Reason
They Call it Surfing for a ReasonThey Call it Surfing for a Reason
They Call it Surfing for a Reason
 
LeanUX - Presentation slides
LeanUX - Presentation slidesLeanUX - Presentation slides
LeanUX - Presentation slides
 
UX/Design Thinking Prototyping Workshop
UX/Design Thinking Prototyping Workshop UX/Design Thinking Prototyping Workshop
UX/Design Thinking Prototyping Workshop
 
Effective prototyping
Effective prototypingEffective prototyping
Effective prototyping
 
Effective prototyping (for Vermont Code Camp)
Effective prototyping (for Vermont Code Camp)Effective prototyping (for Vermont Code Camp)
Effective prototyping (for Vermont Code Camp)
 

Destaque

Prototyping is an attitude
Prototyping is an attitudePrototyping is an attitude
Prototyping is an attitudeWith Company
 
Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013
Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013
Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013Ícaro Medeiros
 
Introduction to RDFa
Introduction to RDFaIntroduction to RDFa
Introduction to RDFaIvan Herman
 
Mobile First - Palestra no MobileConf 2013
Mobile First - Palestra no MobileConf 2013Mobile First - Palestra no MobileConf 2013
Mobile First - Palestra no MobileConf 2013Horácio Soares
 
How to Redefine Success by Writing Your Own Rules : DareConf 2013
How to Redefine Success by Writing Your Own Rules : DareConf 2013How to Redefine Success by Writing Your Own Rules : DareConf 2013
How to Redefine Success by Writing Your Own Rules : DareConf 2013Sophie Dennis
 
Rapid Product Design in the Wild, Agile 2013
Rapid Product Design in the Wild, Agile 2013Rapid Product Design in the Wild, Agile 2013
Rapid Product Design in the Wild, Agile 2013Michele Ide-Smith
 
How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...
How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...
How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...Sophie Dennis
 
#digpen V - Designing Content: or how web designers can stop worrying and lea...
#digpen V - Designing Content: or how web designers can stop worrying and lea...#digpen V - Designing Content: or how web designers can stop worrying and lea...
#digpen V - Designing Content: or how web designers can stop worrying and lea...Sophie Dennis
 
Strategic UX - Rapid experience strategy techniques to help businesses succee...
Strategic UX - Rapid experience strategy techniques to help businesses succee...Strategic UX - Rapid experience strategy techniques to help businesses succee...
Strategic UX - Rapid experience strategy techniques to help businesses succee...Eewei Chen
 
Pioneers, Settlers and Town Planners for Product Development
Pioneers, Settlers and Town Planners for Product DevelopmentPioneers, Settlers and Town Planners for Product Development
Pioneers, Settlers and Town Planners for Product DevelopmentAndy Callow
 
Working in harmony - Port80 2013
Working in harmony - Port80 2013Working in harmony - Port80 2013
Working in harmony - Port80 2013Sophie Dennis
 
Which matters more: content, design or technology? A rant
Which matters more: content, design or technology? A rantWhich matters more: content, design or technology? A rant
Which matters more: content, design or technology? A rantSophie Dennis
 
Principles of User Interface Design
Principles of User Interface DesignPrinciples of User Interface Design
Principles of User Interface DesignKANKIPATI KISHORE
 
Designing stuff that matters fast ux bristol 2012 eewei chen darius kumana
Designing stuff that matters fast ux bristol 2012 eewei chen darius kumanaDesigning stuff that matters fast ux bristol 2012 eewei chen darius kumana
Designing stuff that matters fast ux bristol 2012 eewei chen darius kumanaEewei Chen
 

Destaque (20)

Prototyping is an attitude
Prototyping is an attitudePrototyping is an attitude
Prototyping is an attitude
 
Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013
Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013
Linked data at globo.com - Web of Linked Entities (WoLE 2013) - WWW 2013
 
Storytelling ux tokyo-en
Storytelling ux tokyo-enStorytelling ux tokyo-en
Storytelling ux tokyo-en
 
Introduction to RDFa
Introduction to RDFaIntroduction to RDFa
Introduction to RDFa
 
Mobile First - Palestra no MobileConf 2013
Mobile First - Palestra no MobileConf 2013Mobile First - Palestra no MobileConf 2013
Mobile First - Palestra no MobileConf 2013
 
Power of Story
Power of Story Power of Story
Power of Story
 
How to Redefine Success by Writing Your Own Rules : DareConf 2013
How to Redefine Success by Writing Your Own Rules : DareConf 2013How to Redefine Success by Writing Your Own Rules : DareConf 2013
How to Redefine Success by Writing Your Own Rules : DareConf 2013
 
Rapid Product Design in the Wild, Agile 2013
Rapid Product Design in the Wild, Agile 2013Rapid Product Design in the Wild, Agile 2013
Rapid Product Design in the Wild, Agile 2013
 
How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...
How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...
How Web Designers Can Stop Worrying and Learn to Love Content Strategy - CS F...
 
Measurable & meaningful
Measurable & meaningfulMeasurable & meaningful
Measurable & meaningful
 
#digpen V - Designing Content: or how web designers can stop worrying and lea...
#digpen V - Designing Content: or how web designers can stop worrying and lea...#digpen V - Designing Content: or how web designers can stop worrying and lea...
#digpen V - Designing Content: or how web designers can stop worrying and lea...
 
Strategic UX - Rapid experience strategy techniques to help businesses succee...
Strategic UX - Rapid experience strategy techniques to help businesses succee...Strategic UX - Rapid experience strategy techniques to help businesses succee...
Strategic UX - Rapid experience strategy techniques to help businesses succee...
 
ATM UI prototyping
ATM UI prototypingATM UI prototyping
ATM UI prototyping
 
Pioneers, Settlers and Town Planners for Product Development
Pioneers, Settlers and Town Planners for Product DevelopmentPioneers, Settlers and Town Planners for Product Development
Pioneers, Settlers and Town Planners for Product Development
 
Designing the right product
Designing the right productDesigning the right product
Designing the right product
 
Working in harmony - Port80 2013
Working in harmony - Port80 2013Working in harmony - Port80 2013
Working in harmony - Port80 2013
 
Which matters more: content, design or technology? A rant
Which matters more: content, design or technology? A rantWhich matters more: content, design or technology? A rant
Which matters more: content, design or technology? A rant
 
Principles of User Interface Design
Principles of User Interface DesignPrinciples of User Interface Design
Principles of User Interface Design
 
Designing stuff that matters fast ux bristol 2012 eewei chen darius kumana
Designing stuff that matters fast ux bristol 2012 eewei chen darius kumanaDesigning stuff that matters fast ux bristol 2012 eewei chen darius kumana
Designing stuff that matters fast ux bristol 2012 eewei chen darius kumana
 
Designing with algorithms
Designing with algorithmsDesigning with algorithms
Designing with algorithms
 

Semelhante a Mobile Prototyping Essentials

Mobile Prototyping Essentials
Mobile Prototyping EssentialsMobile Prototyping Essentials
Mobile Prototyping EssentialsRachel Hinman
 
The ultimate guide to prototyping
The ultimate guide to prototypingThe ultimate guide to prototyping
The ultimate guide to prototypingMarcelo Graciolli
 
Prototyping Experiences for Connected Products
Prototyping Experiences for Connected ProductsPrototyping Experiences for Connected Products
Prototyping Experiences for Connected ProductsMartin Charlier
 
Mobile UX Essentials
Mobile UX EssentialsMobile UX Essentials
Mobile UX EssentialsRachel Hinman
 
Human Computer Interaction: Academia and Industry
Human Computer Interaction: Academia and IndustryHuman Computer Interaction: Academia and Industry
Human Computer Interaction: Academia and Industrystudiotelon
 
Rapid Product Design in the Wild
Rapid Product Design in the WildRapid Product Design in the Wild
Rapid Product Design in the WildMichele Ide-Smith
 
Design in Startups
Design in StartupsDesign in Startups
Design in StartupsALPHA Camp
 
eXtreme User eXperience (XUX) - How one team melded UX with XP
eXtreme User eXperience (XUX) - How one team melded UX with XPeXtreme User eXperience (XUX) - How one team melded UX with XP
eXtreme User eXperience (XUX) - How one team melded UX with XPMichael Rawling
 
Video as a prototyping tool for connected products
Video as a prototyping tool for connected productsVideo as a prototyping tool for connected products
Video as a prototyping tool for connected productsMartin Charlier
 
WORKSHOP: Making the World Easier with Interaction Design
WORKSHOP: Making the World Easier with Interaction DesignWORKSHOP: Making the World Easier with Interaction Design
WORKSHOP: Making the World Easier with Interaction DesignCheryl Platz
 
User Experience & Extreme Programming: An Experience Report
User Experience & Extreme Programming: An Experience Report User Experience & Extreme Programming: An Experience Report
User Experience & Extreme Programming: An Experience Report Michael Rawling
 
Design Thinking - Types of prototypes
Design Thinking - Types of prototypes Design Thinking - Types of prototypes
Design Thinking - Types of prototypes SwethaVijay10
 
Prototyping - 2015 PhillyCHI UX Workshop Series
Prototyping - 2015 PhillyCHI UX Workshop SeriesPrototyping - 2015 PhillyCHI UX Workshop Series
Prototyping - 2015 PhillyCHI UX Workshop SeriesMatthew Thomas
 
Intro to User Centered Design Workshop
Intro to User Centered Design WorkshopIntro to User Centered Design Workshop
Intro to User Centered Design WorkshopPatrick McNeil
 
UX Prototyping (UXiD) - Handout by Anton Chandra and Bahni Mahariasha
UX Prototyping (UXiD) - Handout by Anton Chandra and Bahni MahariashaUX Prototyping (UXiD) - Handout by Anton Chandra and Bahni Mahariasha
UX Prototyping (UXiD) - Handout by Anton Chandra and Bahni MahariashaAnton Chandra
 
Prototyping and Piloting
Prototyping and PilotingPrototyping and Piloting
Prototyping and PilotingFung Hoi Si
 
Focus fast bigd15_roger_belveal_2015-09-19
Focus fast bigd15_roger_belveal_2015-09-19Focus fast bigd15_roger_belveal_2015-09-19
Focus fast bigd15_roger_belveal_2015-09-19Roger Belveal
 
UI Design Patterns for the Web, Part 1
UI Design Patterns for the Web, Part 1UI Design Patterns for the Web, Part 1
UI Design Patterns for the Web, Part 1Lewis Lin 🦊
 

Semelhante a Mobile Prototyping Essentials (20)

Mobile Prototyping Essentials
Mobile Prototyping EssentialsMobile Prototyping Essentials
Mobile Prototyping Essentials
 
The ultimate guide to prototyping
The ultimate guide to prototypingThe ultimate guide to prototyping
The ultimate guide to prototyping
 
Apdf Spontaneous Invention
Apdf Spontaneous InventionApdf Spontaneous Invention
Apdf Spontaneous Invention
 
Prototyping Experiences for Connected Products
Prototyping Experiences for Connected ProductsPrototyping Experiences for Connected Products
Prototyping Experiences for Connected Products
 
Mobile UX Essentials
Mobile UX EssentialsMobile UX Essentials
Mobile UX Essentials
 
Human Computer Interaction: Academia and Industry
Human Computer Interaction: Academia and IndustryHuman Computer Interaction: Academia and Industry
Human Computer Interaction: Academia and Industry
 
Rapid Product Design in the Wild
Rapid Product Design in the WildRapid Product Design in the Wild
Rapid Product Design in the Wild
 
Design in Startups
Design in StartupsDesign in Startups
Design in Startups
 
eXtreme User eXperience (XUX) - How one team melded UX with XP
eXtreme User eXperience (XUX) - How one team melded UX with XPeXtreme User eXperience (XUX) - How one team melded UX with XP
eXtreme User eXperience (XUX) - How one team melded UX with XP
 
Video as a prototyping tool for connected products
Video as a prototyping tool for connected productsVideo as a prototyping tool for connected products
Video as a prototyping tool for connected products
 
Essay On Software Development
Essay On Software DevelopmentEssay On Software Development
Essay On Software Development
 
WORKSHOP: Making the World Easier with Interaction Design
WORKSHOP: Making the World Easier with Interaction DesignWORKSHOP: Making the World Easier with Interaction Design
WORKSHOP: Making the World Easier with Interaction Design
 
User Experience & Extreme Programming: An Experience Report
User Experience & Extreme Programming: An Experience Report User Experience & Extreme Programming: An Experience Report
User Experience & Extreme Programming: An Experience Report
 
Design Thinking - Types of prototypes
Design Thinking - Types of prototypes Design Thinking - Types of prototypes
Design Thinking - Types of prototypes
 
Prototyping - 2015 PhillyCHI UX Workshop Series
Prototyping - 2015 PhillyCHI UX Workshop SeriesPrototyping - 2015 PhillyCHI UX Workshop Series
Prototyping - 2015 PhillyCHI UX Workshop Series
 
Intro to User Centered Design Workshop
Intro to User Centered Design WorkshopIntro to User Centered Design Workshop
Intro to User Centered Design Workshop
 
UX Prototyping (UXiD) - Handout by Anton Chandra and Bahni Mahariasha
UX Prototyping (UXiD) - Handout by Anton Chandra and Bahni MahariashaUX Prototyping (UXiD) - Handout by Anton Chandra and Bahni Mahariasha
UX Prototyping (UXiD) - Handout by Anton Chandra and Bahni Mahariasha
 
Prototyping and Piloting
Prototyping and PilotingPrototyping and Piloting
Prototyping and Piloting
 
Focus fast bigd15_roger_belveal_2015-09-19
Focus fast bigd15_roger_belveal_2015-09-19Focus fast bigd15_roger_belveal_2015-09-19
Focus fast bigd15_roger_belveal_2015-09-19
 
UI Design Patterns for the Web, Part 1
UI Design Patterns for the Web, Part 1UI Design Patterns for the Web, Part 1
UI Design Patterns for the Web, Part 1
 

Último

Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Central-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesCentral-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesmilalabial
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Yantram Animation Studio Corporation
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...Pranav Subramanian
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfINTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfphriedaoyigada
 
Materi dasar prototype dan figma .pdf
Materi dasar prototype dan figma    .pdfMateri dasar prototype dan figma    .pdf
Materi dasar prototype dan figma .pdfardanaadam1
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 

Último (20)

Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Central-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposesCentral-Visayas-1.pdf reporting purposes
Central-Visayas-1.pdf reporting purposes
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
Exploring Futuristic Factory Designs: A 3D Interior Rendering Studio's Perspe...
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
TIMBRE: HOW MIGHT WE REMEDY MUSIC DESERTS AND FACILITATE GROWTH OF A MUSICAL ...
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdfINTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
INTRODUCTION TO UI/UX DESIGN BEGINNERS.pdf
 
Materi dasar prototype dan figma .pdf
Materi dasar prototype dan figma    .pdfMateri dasar prototype dan figma    .pdf
Materi dasar prototype dan figma .pdf
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 

Mobile Prototyping Essentials

  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65. High Cost of Failure
  • 66.
  • 67.
  • 68.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73.
  • 74.
  • 75.
  • 76.
  • 77.
  • 78.
  • 81.
  • 82.
  • 85. Technology still in development
  • 89.
  • 90.
  • 91.
  • 92.
  • 93.
  • 94.
  • 95.
  • 96.
  • 97.
  • 98.
  • 99.
  • 100.
  • 101.
  • 102.
  • 103.
  • 104.
  • 105.
  • 106.
  • 107.
  • 108.
  • 109.
  • 110.
  • 111.
  • 112.
  • 113.
  • 114.
  • 115.
  • 116.
  • 117.
  • 118.
  • 119.
  • 120.
  • 121.
  • 122.
  • 123.
  • 124.
  • 125.
  • 126.
  • 127.
  • 128.
  • 129.
  • 130.
  • 131.
  • 132.
  • 133.
  • 134.
  • 135.
  • 136.
  • 137.
  • 138.
  • 139.
  • 140.
  • 141.
  • 142.
  • 143.
  • 144.
  • 145.
  • 146.
  • 147.
  • 148.
  • 149.
  • 150.
  • 151.
  • 152.
  • 153.
  • 154.
  • 155.
  • 156.
  • 157.
  • 158.
  • 159.
  • 160.
  • 161.
  • 162.
  • 163.
  • 164.
  • 165.
  • 166.
  • 167.
  • 168.
  • 169.
  • 170.
  • 171.
  • 172.
  • 173.
  • 174.
  • 175.
  • 176.
  • 177.
  • 178.
  • 179.
  • 180.
  • 181.
  • 182.
  • 183.
  • 184.
  • 185.
  • 186.
  • 187.
  • 188.
  • 189.
  • 190.
  • 191.
  • 192.
  • 193.
  • 194.
  • 195.
  • 196.
  • 197.
  • 198.
  • 199.
  • 200.
  • 201.
  • 202.
  • 203.
  • 204.
  • 205.
  • 206.
  • 207.
  • 208.
  • 209.
  • 210.
  • 211.
  • 212.
  • 213.
  • 214.
  • 215.
  • 216.
  • 217.
  • 218.