user experience prototyping
DESCRIPTION
This is a presentation that overviews User Experience and User Interface. UI & UX design tools help app developers work efficiently. Learn more!TRANSCRIPT
PrototypingUser ExperienceRobert Poppell
PrototypingA quick and cost-effective preview of your
application’s layout and interactivity.
Prototyping• Accessible
• Cost-Effective
• Rapid
• Basic Demo of Interactivity
Part of UX Design• Information Architecture
• Wireframing
• Prototyping
• Design
• Implementation
Part of UX Design• Information Architecture
• Wireframing
• Design
• Prototyping
• Implementation
Part of UX Design• Information Architecture
• Wireframing
• Prototyping
• Design
• Prototyping
• Implementation
Importance of Prototypes
Importance of Prototypes• Better guide for coding
• Accurate preview of Final Product
• Avoid having to make time-intensive changes later
• Changes and input from clients can come earlier
• Easy to maintain
Popular Prototyping Tools• Mockflow
• Fluid UI
• Marvel App
• Invision App
• Proto.io
Pricing• Mockflow - $14 a month - Unlimited Projects
• Fluid UI - $12 a month - 1 Active Project
• Marvel App - FREE
• Invision App - $25 a month - Unlimited Projects
• Proto.io - $24 a month - 5 active projects
Mockflow• Gentle learning curve
• Large library of basic UI Elements
• Ability to add annotations
• Crude linking through hotspots
Fluid UI• Slightly steeper learning curve
• Libraries of UI Elements
• Storyboarding-type workflow
• Basic Screen-to-screen linking and transitions
• Preview on various devices
Mockflow / Fluid UI• Good for rough wireframes
• Quick to create screens and make changes
• Limited animations and interactivity
• Focus on annotations
Marvel App• Links directly to DropBox account for easy updates
• No UI Elements or wireframing tools
• Robust animations and transitions
• Sleek preview mode on various devices
Invision App• Manually upload images
• Syncs to DropBox, Invision Folder, Box (coming soon)
• No UI Elements or wireframing tools
• Robust animations and transitions selection
• Sleek preview mode on various devices
• Viewer collaboration through commenting
Marvel / Invision• Good for making hi-fedelity prototypes
• Not well suited for true wireframing
• Sleek presentation and animations
Proto.io• Cloud based
• Large library of device templates and UI Elements
• Robust animations and transitions selection
• Sleek preview mode on various devices
• Ability to add images
Proto.io• Best for defining complex mechanics of app
• Great for wireframing or hi-fedelity comps
• Greater control over animations and intricate interactions
bluetubeinc.comVisit us Online!