All posts about
Prototyping

Content-First Prototyping

Digital material, language for humans and machines. Human language equals content.

“Content is the core commodity of the digital economy. It is the gold we fashion into luxury experience, the diamond we encase in loyalty programs and upsells. Yet, as designers, we often plug it in after the fact. We prototype our interaction and visual design to exhaustion, but accept that the ‘real words’ can just be dropped in later. There is a better way.”

Andy Fitzgerald a.k.a. /andyfitzgerald | @andybywire ~ Smashing Magazine

A new challenger appears: UX prototyping, user feedback, and the rise of anime

Making, the most human activity there is.

“In this article, I’ll describe the UX and digital marketing prototyping methodology and then what I understand of a particular TV show genre counterpart. I’ll explore fundamental differences in these processes and outline what television can learn from UX. From there, I’ll introduce a unique storytelling ecosystem that already naturally integrates some UX techniques and how that leads, in my humble opinion, to the best TV in the world.”

Montgomery Webster a.k.a. /mxmlln | @uxMonty ~ Boxes and Arrows

How & why prototypes are mandatory for good design

From lofi to hifi prototyping, the experience maquettes of the designer.

“Nothing brings you closer to the functionality of the final product than prototyping. While wireframes sketch out the blueprint and mockups show the feel and texture of the design, it is the prototype that brings to life the ‘experience’ behind ‘user experience’. That beautiful call-to-action may look great on the screen, but you won’t know if it works on end users until the clickable prototype. Not only do prototypes help provide proof of concept, they more importantly expose any usability flaws behind the wireframes and mockups.”

(Jerry Cao a.k.a. @jerrycao_uxpin ~ Design Shack)

How prototyping is replacing documentation

We seem to be still in the deliverable business.

“Creating a prototype as a final deliverable allows for greater interaction with the product and a deeper-level understanding of how the product is experienced. It can also easily be adopted for usability testing and iterated on quickly and efficiently to push out new versions. Prototyping is also an impactful way to present to your client. People know how to interact with products. Demonstrating interactions with a prototype helps to spark well-informed discussions with clients and can lead to better design more quickly.”

(Ian Schoen a.k.a. @icschoen ~ UX Magazine)

When to prototype, when to wireframe: How much fidelity can you afford?

All kinds of design documents provide you with a view of the future.

“The distinction between wireframe and prototype is almost arbitrary—both are mockups of the proposed application that differ in their fidelity to the final application. The lowest fidelity mockup has hand-drawn sketches which are quick, easy to do, and cheap. A set of black and white static layouts linked via hot zones provides a medium level of fidelity.”

(Garett Dworman ~ Usability Geek)

Prototyping for mobile designs

Always wondered why mobile design would be different than plain software design. Is being able to move around the differentiator?

“Building a prototype is a great way to test your design early on with users. Whether you choose to go for a high-fidelity representation, or go lo-fi with paper, you can learn a lot about the usability of your site. Often, teams are concerned with which technique or tool to use because of the litany that are available.”

(Kelly Goto a.k.a. @go2girl ~ User Interface Engineering)

Mobile prototyping: A new paradigm

Mobile not only disruptive for industries, but also for established design practices like UI design.

“Designers and UX professionals use design techniques like sketches, wireframes and mockups to visualise a website during the design process. Can these web design techniques also be used for mobile app design – or is it time for change?”

(Alexis Piperides a.k.a. @alexispiperides ~ net magazine)

Exploring the Problem Space Through Prototyping

‘Prototype’ and ‘Know your people’ as the two imperatives for all designers.

“In our research of what separates the great designers from good designers, we saw that the great designers spent a lot more time trying to understand the problem. They really dove in deep, focusing on all the aspects of how their design would be used and what the constraints and complications might be. Design is all about tradeoffs. Learning how each tradeoff affects the outcome is core to great design. One of the things we saw from the best designers is their use of prototypes to explore the problem. The prototype is the instrument they used to uncover previously hidden constraints and to see the shifts in the outcome of the design.”

(Jared Spool ~ UIE)

Collaborative Prototyping, Groupthink and Design by Committee

Prototypes give you something to talk about and to point to.

“Collaboration in UX is more important than in other fields. Why? UX is all about communication. The dangers of insular thinking in UX are that other people can’t relate to our ideas, even if they are good. When people say “an engineer designed this,” it’s not because engineers are stupid or haven’t thought the problem through. It’s because their values (consistency, supportability, development costs) are not the same as the values of the user (easy, intuitive, powerful).”

(Andrew Mottaz a.k.a. @amottaz ~ Johnny Holland Magazine)

A prototype is worth a thousand words

And give me one word and I’ll make a thousand prototypes. Words are just like requirements.

“Building a good set of wireframes that become a working prototype helps your web project get off to a flying start, it becomes the hub of the design and development project which everyone involved can refer back to. You need to find the right tool to build your prototype. It must be capable of demonstrating how everything will work, whilst not being a complex or fickle beast you have to battle with. Ultimately you need a tool to help shape your thoughts and create a tangible model which is robust enough to be tested with real users and take you through to the next stages of the design process.”

(Leigh Howells a.k.a. @leigh ~ Boagworld)
courtesy of sofia svanteson

How to Choose a UX Prototyping Tool

“A feel of the real is very important in User Experience Design and we often find clients asking for prototypes (proof-of-concept) during the design process. Prototypes better communicate the interactions and navigation of the proposed design than static wireframes and mockups. Prototypes can be created at various stages of the design process (Analysis, Design or actual Test), for an informed user and client feedback to reduce number of design iterations. There is a broad array of prototyping applications available to suit the purpose, skill set and the fidelity required of a deliverable. In this blog we present a brief survey of common prototyping tools.” (Design for Use)

Seven myths about paper prototyping

“Paper prototyping is probably the best tool we have to design great user experiences. It allows you to involve users early in the design process, shows you how people will use your system before you’ve written any code, and supports iterative design. So why are some design teams still resistant to using it? Here are 7 objections I’ve heard to paper prototyping and why each one is mistaken.” (David Travis ~ userfocus)

Wireframes are dead, long live rapid prototyping

“Wireframes, your time is up. You’ve served your purpose. You’ve brought order where there was once chaos and provided gainful employment for thousands of UX designers, but I’m afraid now it’s time for you to go to the big recycling bin in the sky. You’re just no longer cut out for the cut and thrust of UX design and have been replaced by that young upstart called rapid prototyping. In this article I argue why you too should ditch wireframes and embrace rapid prototyping.” (Neil Turner ~ UX for the masses)

Prototyping Theory: Understanding How Prototyping Practices Affect Design Results

“This research examines aspects of the creative process such iteration and comparison, two key strategies for discovering contextual design variables and their interrelationships. We found that, even under tight time constraints when the common intuition is to stop iterating and start refining, iterative prototyping helps designers learn. Our experiments also indicate that creating and receiving feedback on multiple prototypes in parallel— as opposed to serially — leads to more divergent ideation, more explicit comparison, less investment in a single concept, and better overall design performance. Most recently, we found that groups who produce and share multiple prototypes report a greater increase in rapport, exchange more verbal information, share more features, and overall, reach a better consensus.” (Stanford HCI Group)

Design Better And Faster With Rapid Prototyping

“Prototypes range from rough paper sketches to interactive simulations that look and function like the final product. The keys to successful rapid prototyping are revising quickly based on feedback and using the appropriate prototyping approach. Rapid prototyping helps teams experiment with multiple approaches and ideas, it facilitates discussion through visuals instead of words, it ensures that everyone shares a common understanding, and it reduces risk and avoids missed requirements, leading to a better design faster.” (Lyndon Cerejo ~ Smashing Magazine