• Like
  • Save
Prototype like a pro
Upcoming SlideShare
Loading in...5

Prototype like a pro






Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

    Prototype like a pro Prototype like a pro Presentation Transcript

    • How toPrototypeLike a Pro Original iPod Prototype
    • A pictureis worth a thousand words A prototype is worth a thousand pictures
    • Whats aprototype?
    • Early versionof an idea
    • Test able Early version of an idea
    • This is nota prototype
    • This is nota prototype
    • This is
    • Why Prototype?
    • To answerquestionsand generate new ones
    • Validate yourassumptions
    • comparealternatives
    • Failearly d an y ea pl ch
    • To Visualizeyour ideas
    • To Visualizeyour ideasand share themwith others
    • To Visualize your ideas and share them with othersTeam users investors clients
    • So you till youFake it make it
    • What makes a goodPrototype?
    • QuickYou can create multiple versions fastand iterate even faster!
    • Cheap You wouldnt mindthrowing it away andstarting all over again
    • Favorites Check-in ChatPictures Minimal Contains only core features
    • Testable You can put it in front ofpeople and have them try it out(instead of just telling them about it)
    • Measurable You can get thenumbers behind whatsworking and whats not.
    • And hopefully fun to create and use
    • How to create a greatPrototype?
    • 1Plan
    • Define stories,and identify tasks
    • Create a userflow diagram
    • Sketch roughinterface screens Photo courtesy of StevenVanwel on Flickr
    • 2Build Photo courtesy of Mr. T in DC on Flickr
    • Main screen Login screenDesign main screens
    • Create UI states Update StatusProfile pop-up highlight update
    • Add user interaction
    • 3Test
    • Test several prototypesTo get objective feedback
    • Decide whatto measureTo get accurate feedback
    • Choose theright usersTo get relevant feedback
    • Ask them tothink aloudTo get constant feedback
    • Interview them at the end To get even more feedback
    • 4Refine
    • Discuss resultswith your team
    • Integrate findings
    • Test againwith users
    • 5Share
    • Have yourteam playwith theprototype,instead ofwriting longspecificationdocuments
    • E nter Key note
    • Design toolwithoutfeature creep
    • clickable Fast SlowLow fidelity High fidelity Proto types
    • Basic shapes The ones you need, without thedistraction of the ones you dont need
    • AlignmentandSnapping
    • Copy StyleVisual K Lstyles K LQuickly share styles across shapes
    • Masterslides- Less copy/paste- Update multiple pageswith a single change
    • HyperlinksAdd user interaction without writing code
    • SlideTransitions
    • ExportHyperlinks are preserved!
    • Test onDeviceWithout doing any extra work
    • Works withAdobe suite Copy Paste
    • And it costsless than $25 The whole iWork suite costs less than most mock-up and prototyping tools
    • Key not opiaLargest user interface library for Keynote Power point! and
    • To design interfaces andtest prototypes in hoursinstead of days
    • Paper sketches Wireframes HTML /JS / Flash Mockups CompsFast Slowlow fidelity Finally! high fidelity
    • Hundreds of UI buildingblocks for...
    • iPad
    • iPhone
    • Web/Desktop
    • Android
    • BlackBerry
    • Windows Phone 7
    • and Facebook
    • Thousands of companies use it!
    • And everyone loves it!
    • I love Keynotopia prototyping templates.Used them to rapidly develop a fitness appas part of Phoenix Startup Weekend, andended up winning the peoples choice andbest presentation! -Matt Clower, iOS developer I work for a major corporation and my prototype consisted of over 150 slides. Keynotopia turned 60 days worth of work to 20. The executives loved the presentation and are contemplating implementing the app. -Shawn Smith, UX Designer Because it saves time and money!
    • $9 save you 9 hours Get it at Keynotopia