The document discusses low fidelity prototyping. It begins by outlining the benefits of prototyping, including getting early feedback to fix problems before coding. It then discusses the advantages of low fidelity prototyping, namely that it is cheap, quick, and allows for more testing cycles. The remainder of the document provides guidance on how to conduct paper prototyping, including identifying the scope, producing prototypes, and walking through them with potential users. Materials needed and constructing the paper GUI are also outlined.
This document discusses iterative prototyping as a methodology for creative research and design. It involves cycles of observation and brainstorming, iterative prototyping, evaluation and analysis, and publication. Prototypes start simply as scenarios, sketches, or paper prototypes and evolve into higher fidelity prototypes. Feedback is incorporated at each stage to diverge and converge on ideas. The core principles are divergence through prototyping variations and convergence through iterative refinement informed by evaluation. Examples of prototyping techniques illustrated include scenarios, storyboards, sketches, wireframes, paper prototyping, and functional "Wizard of Oz" prototypes.
Lean UX: Sketch, Prototype & Validate. Fast.Jon Hadden
The document discusses lean user experience design and rapid prototyping. It outlines an agenda covering current status, who user experience designers are, lean UX, storytelling, sketching, hi-fidelity wireframing, and why the author likes using Keynote for prototyping. It then discusses moving from traditional UX processes focused on deliverables to a leaner process centered around prototyping and testing designs to understand user experiences. Sketching and interactive prototyping are presented as ways to tell stories and get feedback earlier in the design process.
This document summarizes research conducted on courier services in India. Contextual inquiry was performed, including interviews with 7 users of courier services. Key findings were that the Dabbawala model works due to a close-knit community, strong customer loyalty, and reliance on rail lines. The design brief proposes creating a national courier service by promoting entrepreneurship using an online social network to connect local couriers, replicating the Dabbawala model on a larger scale.
0515 UiGathering Talk - Interaction Design by StanleyStanley Chang
The document discusses interaction design (IxD), which is the practice of designing interactive digital products, environments, systems, and services. IxD involves designing interactive products to support people in their everyday lives. The document provides definitions of IxD from several sources and compares IxD to related fields like HCI, UX, and UI. It then outlines the typical process of IxD, including identifying requirements, designing prototypes, building an interactive version, and evaluating the design.
Your knowledge has value. The case for centralizing print related processes Cocoon Group Branding
In this presentation, we explore the importance of knowledge management and how a centralized approach can benefit companies with large networks of print suppliers and agencies.
The document discusses how design mapping can help user experience designers working in agile environments. It begins by noting some challenges of agile UX design, such as not having enough time to fully design and build all desired features. It then introduces design mapping as a way to plan and prioritize designs. Design mapping involves brainstorming ideas, organizing them on a map based on user workflows, and designing in layers from basic requirements to more advanced features. This ensures the most important user needs are met first while allowing for enhancements later. The document provides examples of how design mapping was used at ProQuest to plan new administrator functionality.
The document discusses different prototyping techniques including paper prototypes, wireframes, and state transition diagrams. It notes that paper prototypes are quick drafts that show essential details for initial user testing. Examples are also provided of paper prototypes and wireframes, and testing sessions are described where a facilitator, observer and participant provide feedback on early designs.
This document discusses iterative prototyping as a methodology for creative research and design. It involves cycles of observation and brainstorming, iterative prototyping, evaluation and analysis, and publication. Prototypes start simply as scenarios, sketches, or paper prototypes and evolve into higher fidelity prototypes. Feedback is incorporated at each stage to diverge and converge on ideas. The core principles are divergence through prototyping variations and convergence through iterative refinement informed by evaluation. Examples of prototyping techniques illustrated include scenarios, storyboards, sketches, wireframes, paper prototyping, and functional "Wizard of Oz" prototypes.
Lean UX: Sketch, Prototype & Validate. Fast.Jon Hadden
The document discusses lean user experience design and rapid prototyping. It outlines an agenda covering current status, who user experience designers are, lean UX, storytelling, sketching, hi-fidelity wireframing, and why the author likes using Keynote for prototyping. It then discusses moving from traditional UX processes focused on deliverables to a leaner process centered around prototyping and testing designs to understand user experiences. Sketching and interactive prototyping are presented as ways to tell stories and get feedback earlier in the design process.
This document summarizes research conducted on courier services in India. Contextual inquiry was performed, including interviews with 7 users of courier services. Key findings were that the Dabbawala model works due to a close-knit community, strong customer loyalty, and reliance on rail lines. The design brief proposes creating a national courier service by promoting entrepreneurship using an online social network to connect local couriers, replicating the Dabbawala model on a larger scale.
0515 UiGathering Talk - Interaction Design by StanleyStanley Chang
The document discusses interaction design (IxD), which is the practice of designing interactive digital products, environments, systems, and services. IxD involves designing interactive products to support people in their everyday lives. The document provides definitions of IxD from several sources and compares IxD to related fields like HCI, UX, and UI. It then outlines the typical process of IxD, including identifying requirements, designing prototypes, building an interactive version, and evaluating the design.
Your knowledge has value. The case for centralizing print related processes Cocoon Group Branding
In this presentation, we explore the importance of knowledge management and how a centralized approach can benefit companies with large networks of print suppliers and agencies.
The document discusses how design mapping can help user experience designers working in agile environments. It begins by noting some challenges of agile UX design, such as not having enough time to fully design and build all desired features. It then introduces design mapping as a way to plan and prioritize designs. Design mapping involves brainstorming ideas, organizing them on a map based on user workflows, and designing in layers from basic requirements to more advanced features. This ensures the most important user needs are met first while allowing for enhancements later. The document provides examples of how design mapping was used at ProQuest to plan new administrator functionality.
The document discusses different prototyping techniques including paper prototypes, wireframes, and state transition diagrams. It notes that paper prototypes are quick drafts that show essential details for initial user testing. Examples are also provided of paper prototypes and wireframes, and testing sessions are described where a facilitator, observer and participant provide feedback on early designs.
This document discusses design prototyping and provides examples of different prototyping methods. It emphasizes that prototyping allows users to experience designs directly through simulations, which helps explore and evaluate designs better while obtaining feedback. Prototypes of varying levels of fidelity can be used at different stages, from early ideation to testing final designs. Experience prototyping in particular simulates integrated touchpoints across time and space. Traditional examples discussed include architecture, products, and interactions, while methods presented involve roleplaying, paper prototyping, and journey mapping.
This document discusses paper prototyping for UX design. It defines paper prototyping as a working version of a product that anyone can try and provide feedback on. The purposes are to quickly validate concepts, improve design decisions, communicate ideas, gather user feedback, and explore unknown aspects of the design. Benefits include lower costs than fully developed prototypes, and allowing the exploration of interactivity and user journeys. The document outlines experiential and tactical types of paper prototyping and describes a workshop where participants developed paper prototypes for an app to discover places to visit in Johannesburg.
The document discusses prototyping, which involves creating preliminary models or representations of a design to test ideas and gather feedback before fully developing a product. It notes that prototypes can be low or high fidelity and do not need to be fully functional. The fidelity of prototypes increases through iterative testing and refining. Prototyping helps identify requirements, test user interfaces and experiences, and collect continuous feedback to refine the design. Both low and high-fidelity prototyping tools are discussed, along with tips for effective prototyping.
This document introduces the Sulley fuzzing framework. It begins with background information on past fuzzing tools and their limitations. It then discusses Sulley's architecture, including its component breakdown and advanced features. Next, it covers usage and demos of Sulley through audits of Hewlett-Packard and Trend Micro software. Finally, it briefly mentions future development plans for Sulley.
This document summarizes the aIRbrush project. The project aimed to develop an artistic tracing product using an infrared LED pen and Raspberry Pi. Key aspects included the Raspberry Pi architecture, infrared pen design, and Python software. Challenges included Bluetooth connectivity and software development timing. Future goals are to increase sensor sampling rates, modify the GUI, allow background images, and add graphical pen effects. The team used project management tools like JIRA and thanks advisors who provided support.
This document discusses prototyping for e-service design. It defines what a prototype is and its role in exploring user requirements and usability testing. Different prototyping techniques are described such as screen-based, interactive products, services, and paper, storyboard, facade, sketch, and scenario-based prototypes. Information design and interaction design principles are also covered.
A hospital used design thinking to develop a home healthcare support program. Through ethnographic research like accompanying medical staff on home visits, they gathered insights and identified needs. They analyzed the research through 5 different perspectives and created personas and scenarios to design for. They prototyped ideas through paper prototypes and testing gadgets to refine solutions. Prototypes were demoed to doctors and nurses for feedback to improve the program, called "COCON", aimed at empowering healthcare workers and solving medical issues through design.
Prezi and PowerPoint both allow users to create presentations, but have key differences. Prezi uses a single dashboard interface that is easier to use and has a shallow learning curve. It allows for zooming between ideas and nonlinear presentations. However, inserting media can be problematic and it lacks spellchecking. PowerPoint has a steeper learning curve due to its multiple tabs and ribbons but allows for linear presentations and easy insertion of media. Both have advantages, as Prezi produces clean presentations while PowerPoint provides more options for media, saving, and printing.
Blending Usability Testing with Interface Design, Prototyping and Rapid Iteration presentated at WebApps2010, Bangalore.
WebApps 2010 is a technical conference designed to bring together experts in all aspects of designing, developing and deploying Web applications. Web-based applications are revolutionizing both the features that can be delivered and the technologies for developing and deploying applications. They also involve a diverse collection of issues and technologies.
UX and Business Analysts - Stop the MadnessAndrew Hinton
The document discusses problems with how software is typically designed and calls for a more user-centered approach. It argues that most software focuses too much on features rather than the user experience. In contrast, the app iA Writer is highlighted as an example of software designed to be enjoyable to use for its target users. The document calls for involving users more directly in the design process through techniques like personas and scenarios to help ensure software meets user needs and motivations.
This document discusses different types of prototypes and their uses. It begins by defining prototypes as ways to identify problems, try out ideas, identify issues, and bring teams together. It then describes different types of prototypes from static to interactive, and their appropriate uses. Key advantages discussed include validating concepts, exploring options quickly, and assessing application flow before production. The document emphasizes that good prototypes put the user first, have appropriate investment, communicate the right level of detail, and are changeable, accessible and help align teams. Overall it promotes prototyping as an important part of the design process.
This document describes the development of a home medical care support service using design thinking. It discusses conducting ethnographic research by observing doctors and nurses on home visits. Researchers analyzed the experiences through 5 models and created personas and scenarios. Ideas were prototyped through paper prototyping and tinkering with gadgets. Prototypes were demoed and feedback was collected from medical professionals to refine the concept of a new home healthcare support service.
A prototype simulates the user experience of a product or service and helps test usability, interactivity, and feasibility. It does not need to be perfect, just fit for its purpose of validating assumptions within given budget and time constraints. There are different types of prototypes for different stages including paper prototypes, experience prototypes, software and hardware tools, storyboards, and physical prototypes. Prototypes range from early, low-fidelity prototypes to refined alpha and beta prototypes used for further development and testing before full production.
Oplægget blev holdt ved InfinIT-arrangementet "temadag om interaktionsdesign", der blev afholdt den 20. januar 2011. Læs mere om arrangementet her: http://www.infinit.dk/dk/hvad_kan_vi_goere_for_dig/viden/reportager/goer_brugernes_behov_til_gode_produkter_02.htm
Daniel Garijo is working on creating abstractions in scientific workflows through workflow traces, templates, provenance and plan representations. He has developed algorithms to automatically find workflow abstractions and link them to provenance traces. His past work includes developing OPMW for provenance publishing and a motif catalog of recurring workflow patterns. His next steps are finishing the implementation of macro abstraction detection and publishing evaluation results.
This document discusses design prototyping and provides examples of different prototyping methods. It emphasizes that prototyping allows users to experience designs directly through simulations, which helps explore and evaluate designs better while obtaining feedback. Prototypes of varying levels of fidelity can be used at different stages, from early ideation to testing final designs. Experience prototyping in particular simulates integrated touchpoints across time and space. Traditional examples discussed include architecture, products, and interactions, while methods presented involve roleplaying, paper prototyping, and journey mapping.
This document discusses paper prototyping for UX design. It defines paper prototyping as a working version of a product that anyone can try and provide feedback on. The purposes are to quickly validate concepts, improve design decisions, communicate ideas, gather user feedback, and explore unknown aspects of the design. Benefits include lower costs than fully developed prototypes, and allowing the exploration of interactivity and user journeys. The document outlines experiential and tactical types of paper prototyping and describes a workshop where participants developed paper prototypes for an app to discover places to visit in Johannesburg.
The document discusses prototyping, which involves creating preliminary models or representations of a design to test ideas and gather feedback before fully developing a product. It notes that prototypes can be low or high fidelity and do not need to be fully functional. The fidelity of prototypes increases through iterative testing and refining. Prototyping helps identify requirements, test user interfaces and experiences, and collect continuous feedback to refine the design. Both low and high-fidelity prototyping tools are discussed, along with tips for effective prototyping.
This document introduces the Sulley fuzzing framework. It begins with background information on past fuzzing tools and their limitations. It then discusses Sulley's architecture, including its component breakdown and advanced features. Next, it covers usage and demos of Sulley through audits of Hewlett-Packard and Trend Micro software. Finally, it briefly mentions future development plans for Sulley.
This document summarizes the aIRbrush project. The project aimed to develop an artistic tracing product using an infrared LED pen and Raspberry Pi. Key aspects included the Raspberry Pi architecture, infrared pen design, and Python software. Challenges included Bluetooth connectivity and software development timing. Future goals are to increase sensor sampling rates, modify the GUI, allow background images, and add graphical pen effects. The team used project management tools like JIRA and thanks advisors who provided support.
This document discusses prototyping for e-service design. It defines what a prototype is and its role in exploring user requirements and usability testing. Different prototyping techniques are described such as screen-based, interactive products, services, and paper, storyboard, facade, sketch, and scenario-based prototypes. Information design and interaction design principles are also covered.
A hospital used design thinking to develop a home healthcare support program. Through ethnographic research like accompanying medical staff on home visits, they gathered insights and identified needs. They analyzed the research through 5 different perspectives and created personas and scenarios to design for. They prototyped ideas through paper prototypes and testing gadgets to refine solutions. Prototypes were demoed to doctors and nurses for feedback to improve the program, called "COCON", aimed at empowering healthcare workers and solving medical issues through design.
Prezi and PowerPoint both allow users to create presentations, but have key differences. Prezi uses a single dashboard interface that is easier to use and has a shallow learning curve. It allows for zooming between ideas and nonlinear presentations. However, inserting media can be problematic and it lacks spellchecking. PowerPoint has a steeper learning curve due to its multiple tabs and ribbons but allows for linear presentations and easy insertion of media. Both have advantages, as Prezi produces clean presentations while PowerPoint provides more options for media, saving, and printing.
Blending Usability Testing with Interface Design, Prototyping and Rapid Iteration presentated at WebApps2010, Bangalore.
WebApps 2010 is a technical conference designed to bring together experts in all aspects of designing, developing and deploying Web applications. Web-based applications are revolutionizing both the features that can be delivered and the technologies for developing and deploying applications. They also involve a diverse collection of issues and technologies.
UX and Business Analysts - Stop the MadnessAndrew Hinton
The document discusses problems with how software is typically designed and calls for a more user-centered approach. It argues that most software focuses too much on features rather than the user experience. In contrast, the app iA Writer is highlighted as an example of software designed to be enjoyable to use for its target users. The document calls for involving users more directly in the design process through techniques like personas and scenarios to help ensure software meets user needs and motivations.
This document discusses different types of prototypes and their uses. It begins by defining prototypes as ways to identify problems, try out ideas, identify issues, and bring teams together. It then describes different types of prototypes from static to interactive, and their appropriate uses. Key advantages discussed include validating concepts, exploring options quickly, and assessing application flow before production. The document emphasizes that good prototypes put the user first, have appropriate investment, communicate the right level of detail, and are changeable, accessible and help align teams. Overall it promotes prototyping as an important part of the design process.
This document describes the development of a home medical care support service using design thinking. It discusses conducting ethnographic research by observing doctors and nurses on home visits. Researchers analyzed the experiences through 5 models and created personas and scenarios. Ideas were prototyped through paper prototyping and tinkering with gadgets. Prototypes were demoed and feedback was collected from medical professionals to refine the concept of a new home healthcare support service.
A prototype simulates the user experience of a product or service and helps test usability, interactivity, and feasibility. It does not need to be perfect, just fit for its purpose of validating assumptions within given budget and time constraints. There are different types of prototypes for different stages including paper prototypes, experience prototypes, software and hardware tools, storyboards, and physical prototypes. Prototypes range from early, low-fidelity prototypes to refined alpha and beta prototypes used for further development and testing before full production.
Oplægget blev holdt ved InfinIT-arrangementet "temadag om interaktionsdesign", der blev afholdt den 20. januar 2011. Læs mere om arrangementet her: http://www.infinit.dk/dk/hvad_kan_vi_goere_for_dig/viden/reportager/goer_brugernes_behov_til_gode_produkter_02.htm
Daniel Garijo is working on creating abstractions in scientific workflows through workflow traces, templates, provenance and plan representations. He has developed algorithms to automatically find workflow abstractions and link them to provenance traces. His past work includes developing OPMW for provenance publishing and a motif catalog of recurring workflow patterns. His next steps are finishing the implementation of macro abstraction detection and publishing evaluation results.
1. low fidelity prototyping pearl pu EPFL
Why Do We Prototype?
Low Fidelity UI Prototyping
Get feedback from users faster
Part of the Human Computer Interaction Course Notes
saves money
Dr. Pearl PU Experiment with alternative designs
Human Computer Interaction Group
Institute for Core Computing Science Fix problems before code is written
Faculty of Communication and Information Sciences
EPFL Keep the design centered on the user
Attribution: some of the slides have been adapted from
Marti Hearst with permission
Slide adapted from James Landay
low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Fidelity in Prototyping Advantage of lowfi
Cheap = less time and easier to change
Fidelity refers to the level of detail Quick feedback
High fidelity ?
More cycles of testing, more prototype
prototypes look like the final product Widely practiced in industry, even though it
Low fidelity ? (Paper prototyping)
sounds silly in the beginning
artists renditions with many details missing
- Read documents on our website regarding
lowfi prototyping
Slide adapted from James Landay
low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
How to do a paper prototyping Paper prototyping in architecture
Main idea: Paper models of a house before it’s
Sketch out prototypes of the interface on built, so that habitants can “walk
paper through” it;
Build interaction flow chart Similarly, potential users can “walk
Potential users “walk through” task through” task scenarios and critique
scenarios using the paper interface
on the UI
A designer “plays computer”
Change the design on-the-fly if helpful
1
2. low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Lofi 6 steps Materials
Review task analysis results Poster papers
Identify lofi scope Paper, pencils, and markers
Produce lofi Glue sticks and scissors
Produce interaction flow chart Post-it notes
Walk through lofi; redesign Transparencies
Produce high fidelity prototype
low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Which part of a software to prototype In reality
You prototype most frequently
Horizontal prototype performed tasks from most important
users
Prototype until the rest of the tasks
become similar to what has been
Vertical prototyped
prototype The decision to stop prototyping is to
ask yourself whether your major
personas will be able to walk through
it.
2
3. low fidelity prototyping pearl pu EPFL
Constructing the Paper Model of GUI
Set a deadline
don’t think too long - build it!
Draw a window frame on large paper
Put different screen regions on cards
anything that moves, changes, appears/disappears
Ready response for any user action
e.g., have those pull-down menus already made
Use photocopier to make many versions
Slide adapted from James Landay
low fidelity prototyping pearl pu EPFL
Interaction Flow Chart
It is a diagram with directed arrows
denoting ordering and steps in user
interaction
Each node of the chart is a GUI
Building interaction flow charts for
main user tasks is part of paper
prototyping
3
4. Interaction
low fidelity prototyping pearl pu EPFL
Flow
Example Example
Example from Last Year: McInterface
Linda Harjono, Saifon Obromsook, John
Wai
http://www.sims.berkeley.edu/courses/
is213/s01/projects/P2/
Main idea:
Walk up kiosk for McDonalds
Main goals
Easy
Fast
Interaction Flow Example Interaction Flow Example
Interaction Flow Example
4
6. Interaction
Flow
Example
low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Interaction Flow Chart Example How to do a walk through
Some details missing from the The goal of a walk through is to
diagram discover usability problems
First branch not labeled correctly Two methods
Let’s complete the example Heuristic evaluation (see another teaching
notes)
Testing lowfi prototype by choosing
someone from a priority user group and
ask him to perform tasks described in
task scenarios.
low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Preparing for an informal test Conducting a Test
Select your participants Four testers (preferable)
understand background of intended users facilitator - gives instructions & encourages
Prepare scenarios that are thoughts, opinions
important according to task analysis computer - knows application logic & controls
it
write up a sequence of actions for each of
always simulates the response, w/o explanation
these tasks according to task scenarios
observer(s) - take notes & recommendations
- Typical session is approximately 1 hour
Slide adapted from James Landay preparation, the Slide adapted from James Landay
test, debriefing
6
7. low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Conducting a Test (cont.) Conducting a Test (cont.)
Test Debrief
facilitator hands out written task fill out post-evaluation questionnaire
scenarios to the user ask questions about parts you saw
must be clear & detailed problems on
facilitator keeps getting “output” from gather impressions
participant give thanks
“What are you thinking right now?”, “Think
aloud”
observe -> no “a-ha”, laugh, gape, etc.
Slide adapted from James Landay Slide adapted from James Landay
low fidelity prototyping pearl pu EPFL low fidelity prototyping pearl pu EPFL
Evaluating Results Potential difficulties
Sort & prioritize observations Interfaces with large focus on content
what was important? Dynamic or static; both are ill-suited
lots of problems in the same area? Use word processor for large sets of text
For search/database applications
Create a written report on findings
Have pre-planned searches (not very realistic)
gives agenda for meeting on design Write up search results on the fly
changes Maybe have a printer nearby that can
produced typed results
Make changes & iterate Bottom line: can only prototype the main
interaction this way; search needs to be
hooked up to really test the search mechanism
Slide adapted from James Landay
low fidelity prototyping pearl pu EPFL
Summary of advantages of Low-fi
Takes only a few hours
no expensive equipment needed
Can test multiple alternatives
Can change the design as you test End
If users are trying to use the interface in
a way you didn’t design it – go with what
they think! Adapt!
Allows designers to work together
Slide adapted from James Landay
7