Given at BigDesign 2015. Discussing the benefits of rapid prototyping, the stress of selecting a prototyping tool, and an overview of available apps for desktop and mobile.
15. NO
“There’s no room in the timeline…”
“We don’t have the budget…”
“There aren’t any available resources…”
“We can’t change the specs…”
“The project is already yellow…”
28. The “Go” or “NO Go” Decision
When prototype confidence
reaches a certain level either…
• The idea is funded and
approved for development
OR…..
• The idea is abandoned
40. The Really Bad News?
• ALL of them still have at
least one major, potentially
“deal killing” shortcoming
• Very few of us have time to
discover what those
shortcomings are.
44. “How can I call
myself a UX Pro?
I only know Visio!
“I’ve never
even heard
of those apps!”
“Please stop talking
about prototyping
before someone asks
me which app I use!”
62. POP - Pros and Cons
• PRO: Photos can come from the camera, camera roll,
Adobe Creative Cloud, or Dropbox
• PRO: Easy “hot spot” based interactions
• PRO: Companion web app
• PRO: Sharing via email, SMS, Facebook, or Twitter
• Deal Killer? Only that its very limited — but the
convenience may be worth it in many instances.
64. Mural - Pros and Cons
• BIG PRO: Lets you create, update, and even TEST
sketches and paper prototypes with participants in
remote locations
• PRO: VERY easy to use and learn
• PRO: Creates a “Paper Prototype Paper Trail”
• Deal Killer? I haven’t found one yet
67. HotGloo (hotgloo.com)
• Good news — its no
longer Flash-based
• Solid library of UI
elements
• Support for
responsive design
• Designed to create
work in the tool -
painful to if you have
existing mockups
68. • No support for gestures (only
mouse interactions
• No options for animated
transitions (fade, wipe left, etc.)
• No templates for specific
devices
HotGloo
Pain Points
69. Balsamiq Mockups (https://balsamiq.com/products/mockups/)
• Intentionally keeps wireframes
rough and hand-drawn looking
using “Sketch Skin”
• Works on all major OS
• Lots of community support
• Now has Google Drive
integration
• Known for its clean interface
and ease of use.
70. “We think that in most cases,
wireframes + running code is
much better than prototyping.
…We consciously decided not to
let users specify interactivity other
than the ability to link wireframes
together into a storyboard.”
The
Balsamiq
Deal Killer
(for me)
from their website…
72. Flinto (flinto.com)
• POP on steroids
• Easy to drag links
from one hots spot
to another
• Can be sent to
anyone via SMS
• Looks like a native
app - icon on home
screen
74. Invision (invisionapp.com)
• The “Axure” of the
image-based tools
• Widely used, lots
of community
support
• Important: Syncs
with native .psds
• Great
collaboration tools
77. Justinmind (justinmind.com)
• Will feel very familiar
to Adobe users
• Lots of UI tools and
widgets
• Lets you add
conditionals, data
sets, even does
math
• App is a download,
so you can work
offline
78. You could create it, but editing
anything was a NIGHTMARE.
Need to change a complex
interaction? Throw it all away and
start over.
No styles? No Master Pages?
SRSLY???
Next….
The
JustinMind
Deal Killer
(for me)
79. Proto.io (proto.io)
• Very popular for
mobile app
prototyping
• Extensive tools
• Great community
support
• The only real
problem? No
desktop version.
82. …and for Responsive Web?
• My favorite tool doesn’t appear on a single prototyping app list
• Creates prototypes for desktop, tablet, and mobile
• Integrates seamlessly with Photoshop and Illustrator, but I usually create
everything I need directly in the app
• Has Master pages and grid support; plus paragraph, character, and object styles
• Reusable libraries of UI elements - built in, third-party, or my own
• Generates readable HTML/CSS, and I can name my own classes
• Can be instantly published and viewed by anyone, on any device with a browser
• Has extremely active corporate, third-party, and community support
• If you are familiar with Adobe products, you can learn it in about 15 minutes.
• You probably already have the full working version, and have just never opened it.
86. Don’t “marry”
your first visions
• Prototypes WILL
uncover many
unexpected things
• Logic flaws
• Critical overlooked
features
• Incorrect
assumptions