Prototyping Blog

A Practitioner's Guide

Posts written by Todd Zaki Warfel

  • Now on Sale

    Posted on

    It’s official. After nine months of research and nearly two years in the making, my book, Prototyping: a practitioner’s guide has launched. I wrote Prototyping for anyone who’s involved in the process of designing (software) products. If you’re a designer, developer, or business person involved in designing and building products, chances are you’ll find something beneficial in Prototyping.

    The first part of the book provides a number of helpful case studies and tips for selling prototyping to your boss and clients as part of the design process–one of the biggest challenges we face in the user experience field today. The next couple of chapters provide eight guiding principles I’ve developed in the past couple of years for improving the success of prototyping in the design process.

    Then you’ll find six chapters packed with hands-on tutorials for prototyping with paper, Powerpoint, Visio, Axure RP, Fireworks, and even HTML. Each chapter starts with the pros and cons of the methods or tools, then walks you through basic and advanced techniques for using the tool. You’ll find the example files for these chapters on the book’s website. You can even grab my iPhone stencil for Fireworks–entirely vector.

    And finally, I wrap the book up with a chapter on how to effectively prepare for and conduct usability testing on your prototype. I even include a sample waiver you can use with participants and a test guide.

    This book wouldn’t have happened without the help and support of a number of people. First, I want to thank Lou Rosenfeld and the advisory board at Rosenfeld Media. I really learned a lot in the process.

    I hope every author out there is fortunate enough to have an editor who balances tradition with the willingness to try something new. My editor, Marta Justak, did just that. I can’t thank Marta enough for working with me on this book and ensuring that it stayed true to my vision.

    I’d like to thank the following people for contributing their wisdom to this book: Bill Scott of Netflix, Anders Ramsay an independent UX consultant, David Verba of Adaptive Path, Robert Reimann of frog design, Chris Pallé an independent UX consultant, Victor Hsu of Axure, Scott Mathews of Xplane, Tom Humbarger of iRise, Robert Hoekman, Jr. of Miskeeto, Joe Sokohl of Regular Joe Consulting, Nathan Curtis of EightShapes, Henk Wijnholds and Stefan Wobben of Concept7, Jonathan Baker-Bates of Expedia, and Fred Beecher of Evantage.

    I also had a number of brilliant people review the chapters I wrote on specific methods and tools to make sure they were accurate. I’d like to thank Jeff Patton, an independent UX consultant and Agile coach, for reviewing my paper prototyping chapter, Anders Ramsay for reviewing my chapters on Visio and HTML, Alan Musselman Lead UI Designer and Fireworks Evangelist at Adobe for reviewing my chapter on Fireworks, and Fred Beecher for reviewing my chapter on Axure RP Pro.
    And last, but most certainly not least, I’d like to thank my wife, Angela, for gently reminding me that this book won’t write itself.

    Now, what are you waiting for. Go pick up a copy of Prototyping: a practitioner’s guide, start prototyping and change your design process forever. And when you’re done reading it, don’t forget to write a review on Amazon.

    Prototyping Book Goes to Press

    Posted on

    It’s official. After nine months of research and nearly two years in the making, my book, Prototyping: a practitioner’s guide has launched. I wrote Prototyping for anyone who’s involved in the process of designing (software) products. If you’re a designer, developer, or business person involved in designing and building products, chances are you’ll find something beneficial in Prototyping.

    The first part of the book provides a number of helpful case studies and tips for selling prototyping to your boss and clients as part of the design process–one of the biggest challenges we face in the user experience field today. The next couple of chapters provide eight guiding principles I’ve developed in the past couple of years for improving the success of prototyping in the design process.

    Then you’ll find six chapters packed with hands-on tutorials for prototyping with paper, Powerpoint, Visio, Axure RP, Fireworks, and even HTML. Each chapter starts with the pros and cons of the methods or tools, then walks you through basic and advanced techniques for using the tool. You’ll find the example files for these chapters on the book’s website. You can even grab my iPhone stencil for Fireworks–entirely vector.

    And finally, I wrap the book up with a chapter on how to effectively prepare for and conduct usability testing on your prototype. I even include a sample waiver you can use with participants and a test guide.

    This book wouldn’t have happened without the help and support of a number of people. First, I want to thank Lou Rosenfeld and the advisory board at Rosenfeld Media. I really learned a lot in the process.

    I hope every author out there is fortunate enough to have an editor who balances tradition with the willingness to try something new. My editor, Marta Justak, did just that. I can’t thank Marta enough for working with me on this book and ensuring that it stayed true to my vision.

    I’d like to thank the following people for contributing their wisdom to this book: Bill Scott of Netflix, Anders Ramsay an independent UX consultant, David Verba of Adaptive Path, Robert Reimann of frog design, Chris Pallé an independent UX consultant, Victor Hsu of Axure, Scott Mathews of Xplane, Tom Humbarger of iRise, Robert Hoekman, Jr. of Miskeeto, Joe Sokohl of Regular Joe Consulting, Nathan Curtis of EightShapes, Henk Wijnholds and Stefan Wobben of Concept7, Jonathan Baker-Bates of Expedia, and Fred Beecher of Evantage.

    I also had a number of brilliant people review the chapters I wrote on specific methods and tools to make sure they were accurate. I’d like to thank Jeff Patton, an independent UX consultant and Agile coach, for reviewing my paper prototyping chapter, Anders Ramsay for reviewing my chapters on Visio and HTML, Alan Musselman Lead UI Designer and Fireworks Evangelist at Adobe for reviewing my chapter on Fireworks, and Fred Beecher for reviewing my chapter on Axure RP Pro.
    And last, but most certainly not least, I’d like to thank my wife, Angela, for gently reminding me that this book won’t write itself.

    Now, what are you waiting for. Go pick up a copy of Prototyping: a practitioner’s guide, start prototyping and change your design process forever. And when you’re done reading it, don’t forget to write a review on Amazon.

    Prototyping with Fireworks CS4

    Posted on

    Well, I’m working on the Fireworks chapter for my book, Practical Prototyping and dug up this great video by Alan Musselman, one of the application engineers on the Adobe Fireworks CS4 team. Alan gives a great introductory overview to some of the powerful new features and enhancements in Fireworks CS4.

    I’ve been using CS4 since it was in Beta, but wasn’t aware of some of the powerful enhancements Alan points out in this video, like the asynchronous file saving and ability to have multiple style sets. If you’re looking for a great all around prototyping tool that works for lo-fi, hi-fi and can even generate reusable source code, check out Fireworks CS4.

    I’ll be posting more tips, tricks, and FW CS4 videos in the coming weeks.

    PowerPoint and Visio

    Posted on

    Just a quick update that I’ve finished my chapter on Paper Prototyping a few weeks ago. Thanks to my wonderful technical editors, I’ve got a few revisions to make.

    Last weekend I finished up the chapter on PowerPoint and this weekend it will be Visio. After that, there’s only a few chapter left to cover: Axure, Flash, Fireworks, HTML, and a short chapter on testing your prototypes.

    Each of these chapters has been around 10 pages each. So, they’re pretty compact and focused on a hands-on approach. I really like the way the book is shaping up and am looking forward to wrapping up my writing by Dec 31.

    Thank God the office is closed 1/2 of December.

    Prototyping the Strida2 Folding Bike

    Posted on

    Here’s a great example of real world prototyping from the inventor of the Strida2 folding bike.

    Particularly interesting is how he discusses the prototyping process using sketching, mini models, and full scale prototypes at 1:10-3:15 and how he discusses the critical role of sketching while refining the designs at 6:30-7:15 in the video.

    A few key points from Mark’s perspective:

    • He doesn’t worry about which ideas are good and which are bad. Instead, he uses sketching to explore every possible idea.
    • Once he has dozens of sketches, he evaluates the sketches based the original goals of the product.
    • Sketches only go so far. The only way to really explore which ideas will work is to build models or prototypes.
    • Sketching plays a critical part in updating the design as well. He uses sketches to work through his ideas.

    First Prototyping Survey Results

    Posted on

    Back in June 2008, I ran a survey on prototyping. Close to 200 people participated, primarily from the US. The respondents were nearly 60/40 Male/Female and represented a mix of roles in the UX community.

    The goal — challenge some insights I’ve found through interviews, see who’s prototyping, what tools/methods they’re using, find some succss stories, find some failures.

    The result — as expected, a number of assumptions were validated, while others were challenged. I was surprised a bit by the number of people who’s activities were those of a Business Analyst (BAs), which was not an audience I expected to hear from. However, Axure and iRise, two prototyping tools, are relatively common for BAs.

    I’m not shy about the fact that I’m not a big fan of surveys, however, they do have their place. My main dislike for surveys is their lack of ability to properly address the "Why?" question.

    Good survey design is part art, part science. And in hindsight, I would have changed a few things. Something to learn for future surveys:

    • There are a lot of tools used in combination to produce prototypes. Asking participants to weight scale their tools to total 100% might have been helpful.
    • Title is rarely an accurate representation of what people do for a living — at least in the UX field. Close to 20% of people responded perform Business Analyst tasks, but just over 2% self identify as BAs.
    • A large percentage of participants participate in cross-role activities (e.g. design and usability testing). Maybe next time I’ll have role and title as two separate questions, or possibly just dump title all together. I’m really more interested in activities people are performing than what their title is.

    Summary Findings

    • Paper tops the list as the most method, followed by hand-coded HTML is the second most popular method.
    • Paper, Visio, PowerPoint, Dreamweaver, Axure, and OmniGraffle topped the list for most common tools.
    • There were an equal number of people using Dreamweaver and Axure.
    • Visio and PowerPoint are very common tools, especially in larger corporate environments.
    • OmniGraffle and Keynote are very common in mid-small sized companies.
    • Visual designers are more likely to use a tool like Dreamweaver to slap-and-map (link together screens with HTML), or PowerPoint/Keynote to present screens as a prototyping method.
    • Respondants were almost equally split across 1-3 years, 3-5 years, and more than 5 years experience with prototyping.
    • The most important factor for using a tool/method is time and effort to produce a working prototype, followed by a prototype usable for testing, and price.

    I’ll be running some additional surveys in the future, which will be more focused on specific methods and tools.

    Survey Results

    Most Common Methods and Tools for Prototyping  
    Paper 81%
    Hand-coded HTML 58%
    Auto generated from Axure, iRise, Visio, Fireworks, or similar 34%
    Screen shots/comps linked with HTML (slap-and-map) 34%
    Flash, Flex, Blend, or similar 27%
    Keynote or PowerPoint 24%
    Clickable PDF 21%
    Production environment (e.g. Ruby, Java, .Net, PHP, Xcode) 9%
    3D models, cardboard, foam core 1%
    Experience with Paper Prototyping  
    5 or more years 34%
    More than 1, less than 3 years 32%
    More than 3, less than 5 years 17%
    Less than 1 year 10%
    None 7%
    Experience with Digital Prototyping  
    5 or more years 48%
    More than 1, less than 3 years 24%
    More than 3, less than 5 years 21%
    Less than 1 year 5%
    None 2%

    Most Important Factors in a Prototyping Tool/Method

    1. Time and effort to produce a working prototype.
    2. Creating usable prototypes for testing.
    3. Price
    4. Learning curve.
    5. Ability to create own GUI widgets and patterns.
    6. Platform independence.
    7. Collaborative/remote design capabilities.
    8. Built-in solutions/patterns (e.g. AJAX transitions)
    9. Built-in GUI widgets.
    10. Creating usable source code.
    Tools Used in Prototyping  
    Paper 77%
    Visio 59%
    PowerPoint 43%
    Dreamweaver 47%
    Axure 30%
    OmniGraffle 30%
    Illustrator 23%
    Flash 21%
    Acrobat 19%
    Fireworks 18%
    InDesign 12%
    Photoshop 10%
    Other HTML editor 4%
    Keynote 3%
    iRise 0.7%
    Primarily Hi-fi vs. Lo-fi Prototypes  
    Hi-fi 47%
    Lo-fi 42%
    50/50 11%
    Demographics  
    Male 62%
    Female 38%
    Title/Role  
    Interaction Designer/IA 63.2%
    Product Manager 8.3%
    Presentation Layer Developer 6.3%
    Other 6.3%
    Researcher, Design Researcher, Usability Analyst 5.6%
    UX Manager 3.5%
    Application Developer 3.5%
    BA 2.1%
    Visual Designer 1.4%