Step 9. Prototype
Master UX in 15 steps.📍 Start
“If a picture is worth a thousand words, then a prototype is worth 10,000. Prototypes go beyond the power of show and tell — they let you experience the design” 📔 Prototyping: A Practitioner’s Guide
In this step, you create testable layouts to see if your idea works. Prototypes help to focus on structure and functionality of the site instead of visual elements.
The goal of prototyping is to test your ideas early in a process, get users feedback, improve the interface and save time and effort on developing useless features.
UX prototyping tutorial: Design process overview (4 mins)
LinkedIn Learning Solutions
This tutorial breaks the design process down into five steps — brainstorming, project planning, prototyping, testing, and refining.
Sketches vs. Wireframes vs. Prototypes
Wireframing for UX: What it is and how to get better at it (4 mins)
UX Mastery
Wireframes: what they are, the different types of wireframes you can create, and some practical advice about how to improve your wireframes.
Sketches & Wireframes
How to wireframe a website (5 mins)
CharliMarieTV
From sketches to wireframes — your goal is to generate as many ideas as possible and get feedback.
UX Sketching: Whiteboard 101 (3 mins)
Mary Shaw
Here’s a short video that will give you a handy collection of common interface elements that you can practice sketching anytime.
Paper Prototypes
UX prototyping tutorial: Paper prototyping techniques (10 mins)
LinkedIn Learning Solutions
This tutorial walks through a sample paper prototyping session, providing tips for setting up and representing interface elements with paper and explaining how to make quick changes and identify and categorize feedback.
Testing
Example Usability Test with a Paper Prototype (7 mins)
BlueDuckLabs
Performing a usability test early in your website planning process can have huge returns — a paper prototype allows you to do this with a minimal time investment.
Digital Prototypes
Rapid Prototyping (10 mins)
Google for Entrepreneurs
Digital prototyping allows you to rapidly explore an idea by building interactive experiences that run on real devices — no coding required.
📖 Paper Prototyping: The Fast and Easy Way to Design and Refine User Interfaces by Carolyn Snyder
📖 Prototyping: A Practitioner’s Guide by Todd Zaki Warfel
📖 Sketching User Experiences: The Workbook
📖 The Sketchnote Handbook: The Illustrated Guide to Visual Note Taking by Mike Rohde
🎬 UX Youniversity Step 9. Prototype