What Are The Differences?
PROTOTYPINGINVISION VS AXURE
— What is prototyping and why we need it?
— Prototyping tools criterias
— Prototype creation process
PROTOTYPING
AGENDA
— Features of services
— Work process
— PROS & CONS
INVISION VS AXURE
Prototype is a draft version of a product that allows you to
explore your ideas and show the intention before investing time
and money into development.
WHAT IS PROTOTYPE?
Low-fidelity
Often paper-based and do not allow userinteractions. From a series of hand-drawnmock-ups to printouts.
High-fidelity prototypes
Computer-based, allow realistic user interactions. Take you as close as possible toa true representation of the user interface.
Todd Zaki Warfel
Prototyping is practice for people
who design and make things. It’s not
simply another tool for your design
toolkit — it’s a design philosophy.
“
Fail early, fail fast and fail often
Shift the perspective: Show, don’t tell
Create something tangible
Show what the app’s user experience will be like
WHY WE NEED IT?
IT REALLY MATTERS
How much prototype will cost
What you receive as result
What needs it cover
What pros and cons it has
1
2
3
4
COOPER PROTOTYPING TOOLSREVIEW AND RANKING
COOPER PROTOTYPING TOOLSREVIEW AND RANKING
PROTOTYPE CREATIONPROCESS
Asset creation
Prototype creation
Prototype/Design asset storage
Sharing and feedback with prototypes
Biggest frustrations with prototyping process
1
2
3
4
5
INVISION KEY POINTS
Collaboration tool
Real-time to-do lists
Desktop/Web/Mobile
Version History and Syncing
UI Kit TETHR
1
2
3
4
5
Simplify the feedback
process by having clients
and stakeholders
comment directly on your
designs. So long, confusing
email chains and
unrecorded input!
SEAMLESS DESIGNCOMMUNICATION
With InVision Sync or
Dropbox, your prototypes
will automatically update
— every time you save
your source files. Plus,
InVision automatically
tracks version history, so
you can check out previous
designs anytime, complete
with comments, and even
revert with a single click.
VERSION CONTROLAND FILES SYNC
Just upload your designs
and add hotspots to
transform your static
screens into clickable,
interactive prototypes
complete with gestures,
transitions, and
animations.
ARRANGE SCREENSIN PROTOTYPE
With 138 templates and
over 250 components at
your fingertips, you'll be
whipping out any kind of
UI in no time.
IOS DESIGNUI KIT TETHR
IN VISION SCREENLAYERS STRUCTURE
Visual
IN VISION SCREENLAYERS STRUCTURE
Visual
Links
IN VISION SCREENLAYERS STRUCTURE
Visual
Links
Comments
IN VISION SCREENLAYERS STRUCTURE
Visual
Links
Comments
History
INVISIONWORKPROCESS
Project Creation
Screens Upload
Prototype Creation
Project Sharing
Collaboration
PROS
Easy to learn
Fast — Sign in and created first prototype in 10 minutes
Quick and intuitive (drag + drop)
Sharing and commenting system for collecting feedback
Asset management features
Simple web display of prototype
Options for adding animation to page transitions (mobile only)
Support for mobile/touch gestures
1
2
3
4
5
6
7
8
CONS
Only good for working with existing mocksNo features for creating or modifying elements in the tool
Interactivity limited to hotspots or timeoutsfor moving between screens
1
2
AXURE KEY POINTS
HTML based prototype with no coding skills required
Ability to prototype responsive websites
Prototype animations and transitions
Detect and work with gestures
Online sharing
Libraries with common UI elements
1
2
3
4
5
6
— Rep console. Desktop (mockups based).
Create Prototypes of Websites & Apps Without Coding
CLIKABLE PROTOTYPES
AGENDA
Start with the Core
Training to get a working
knowledge of Axure RP.
Continue with More
Adventures articles and
tutorials.
ONLINE TRAININGFOR AXURE PR
Create Word templates
with custom headers,
footers, title page, and
heading styles. Cenerate
your custom
documentation any time
and as many times as you
update the design.
DOCUMENTATION& COLLABORATION
AXUREWORKPROCESS
Environment overview
Prototyping Features
Project Sharing
Sitemap Pane
Widgets Pane
Masters pane
Page Properties Pane
Wireframe Pane
Widget Properties Pane
Dynamic Panel Manager Pane
Main Menu и Toolbar
PROS
Good training and support documentation
Fine-grain controls for adding interactivity toindividual elements
Good for prototyping complex interaction behaviors
Built-in library of widgets that can be customized withspecific actions and behaviors
Flexible —can be used to prototype productsfor any digital platform
1
2
3
4
5
CONS
Steep learning curveNot easy to use for a first-time user
No device-specific templates or features
Designed to build out screens in the tool whichreflects to use existing mock-ups as starting point
1
2
3
FREE
STARTER
PROFESSIONAL
TEAM
Axure RP
Axure RP PRO
$0/mo.
$15/mo.
$25/mo.
$100/mo.
$289
$589
FREE
STARTER
PROFESSIONAL
TEAM
Axure RP
Axure RP PRO
$0/mo.
$15/mo.
$25/mo.
$100/mo.
$289
$589
THANK YOU!