Rapid prototyping resources
Here are the promised resources from my talk at the 2012 Future of Web Design conference in NYC. This is by no means a comprehensive list, but should be a good start. And here are my slides if you’re interested.
Choosing a tool:
Rapid Prototyping Tools — Adaptive Path’s article on choosing a tool, with a spreadsheet overview of them
What are the best tools for rapidly prototyping a web app? — nice Quora thread
What are the prototyping tools for mobile apps? — another Quora thread, for mobile apps
Protomoto — huge grid of available tools
Paper prototyping:
Pretty Sketchy — the importance of sketchbooks
The Messy Art of UX Sketching — overview of techniques
Sketchboarding: Discover Better, Faster UX Solutions — very cool ideas
Sketching tools:
Adaptive Path’s Favorite Tools for Sketching — great details on the pens and markers that are most useful. I also like a highlighter.
Tools for Sketching User Experience — more tips on tools and sketchboarding
Pixel Pads — notepads in iPad or iPhone shape
Printable Paper — all kinds of graph paper you can print yourself
UI Stencils — rulers and metal stencils
Smashing Magazine’s Wireframing Templates — lots more templates
Digital prototyping:
Time to Dump Wireframes — great overview of articles on the end of wireframes
Designing Better and Faster with Rapid Prototyping — instructive article discussing process and types
Digital tools:
OmniGraffle — great for site maps, wireframes and prototypes
Balsamiq — simple sketchy wireframes, with symbol libraries
iOS source file — by Teehan + Lax, many others there too
Proto.io — web tool for making iOS prototypes
Keynote — presentation software that can also make high fidelity prototypes
Keynotopia — library of keynote templates
HotGloo — mentioned by Dave Stein at Behance
HTML prototyping:
CSS and Design Frameworks for Rapid Prototyping and Web Applications — good comparison of Bootstrap vs Foundation and others
Dive into responsive prototyping with Foundation — explanation on A List Apart by the founder of Foundation
Spike-driven design — interesting idea from Pivotal Labs
HTML tools:
HTML5 Boilerplate — The standby, built and tested by expert developers
Semantic.gs — My favorite grid system. Keeps grid classes out of your markup
LESS (or SASS + Compass) — Essential tool for modern CSS development. Extends CSS to include variables, nesting, and functions, which all compile into normal CSS.
Codekit — nice compiler for all sorts of preprocessors
Coda — my favorite HTML editor
Coda Clips — library of clips for the above
CSS Tricks — Chris Coyier’s awesome collection of code clips, tutorials, demos, forums…
Emmet — toolkit of CSS-like expressions that can be expanded into HTML/CSS
Wirefy — browser-based responsive wireframe tool
Foundation — front-end framework
Mobile-First Foundation — a mobile-first version of Foundation, on github
Bootstrap — Twitter’s framework for web apps
Punch — “modern web publishing framework” that includes data layers
CodeIgniter — PHP framework
CakePHP and Croogo — simple PHP framework and CMS
99 Lime / HTML Kickstart — a collection of ultra-lean HTML5, CSS, and jQuery building blocks (ht @kevanmacgee)
Lean UX:
Getting Out of the Deliverables Business — Smashing Magazine’s comprehensive overview of a lean UX process
Does Artistic Collaboration Ever Work? — The Atlantic
Inside Agile — Hugh Beyer
Agile Designer-Developer Collaboration with Scrum — Allen Manning
Emerging Best Practices in Agile UX — Agile Product Design
Should I focus on a good user experience or push something out quickly? — Quora thread with feedback from Jason Fried and more
User research tools:
What is remote usability research? — overview
User Testing — watch users on your site, selected by demographic or technical expertise
Verify App — test concepts for recall, personality, and more
Usabilla — run surveys on site visitors, or get videos of them using your site
Qualaroo — surveys that sync with Kissmetrics
The Whicher — simple A/B testing
Meetups:
Books:
Paper Prototyping by Carolyn Snyder
Prototyping: A Practitioner’s Guide by Todd Zaki Warfel
Everything by A Book Apart
The Shape of Design by Frank Chimero will make you love your job
People cited:
@chriscoyier • @jodify • @jasonsantamaria • @jonathanpberger • @uxceo • @fchimero • @adaptivepath • @frogdesign • @muledesign • @netmag • @uxmag • @alistapart • @abookapart
and a partridge in a pear tree.
comments powered by Disqus