Lean Prototyping - A Practical Guide

67 %
33 %
Information about Lean Prototyping - A Practical Guide
Technology

Published on February 27, 2014

Author: framebench

Source: slideshare.net

Description

given on 10 Nov, 2013 @ New Delhi, India.

Lean Prototyping - A practical guide

Rohit Agarwal I prototyped

You can check it @ www.framebench.com

Wireframe

Wireframe Prototype

Wireframe Mockup Prototype

Wireframe Mockup Prototype App

Wireframe Mockup Prototype App

WIREFRAME WIREFRA

FOCUS ON SPACING UI ELEMENTS DRAWN PLACEHOLDERS WIREFRAME WIREFRAME WIREFRAME WIREFRAME WIREFRAME WIREFRAME WIREFRAME WIR

Wireframe for a Conference website

Wireframe for an iPhone app

Wireframe : Framebench Website

PROTOTYPE PROTOT

PROTOTYPE PROTOT A plan for how it WORKS, NOT how it looks

Think about MENUS and ANIMATION PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYP

Think about use CASES and user FLOW PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYP

Think about MOST FREQUENT actions : reduce clicks PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYP

Visualize all possibilities – save redesigns and headaches later Framebench App Prototypes PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYPE PROTOTYP

MOCKUP MOCKUP M

MOCKUP MOCKUP M 2 types

MOCKUP MOCKUP M 2 types Low fidelity High fidelity

HIGH FIDELITY MOCK > LOW FIDELITY MOCK < MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP

MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP

POP QUIZ This mockup is… LOW FIDELITY? HIGH FIDELITY? MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP

POP QUIZ This mockup is… LOW FIDELITY!! MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP

MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP

And yes… This mockup is… HIGH FIDELITY! MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP MOCKUP

LEAN

Conceptualize it

Categorize everything you need on your application. Post-its are great for this! Create multiple drawings and placements for various elements.

There’s nothing better than the pen, paper and post its for this. Try out Behance’s Action sheets http://www.creativesoutfitter.com/products/100/action-method

Wireframe it

Now that you have a basic idea in your mind, you’re ready to put it on a digital pad. AND.. There are a variety of tools available today!

I personally love Balsamiq..

And Moqups.

Wireframe.cc is super lightweight!

Prototype it

You have various wireframes ready, its time to quickly create proof of concepts. Lean Prototyping = Test Quickly = Fail Faster

Interactive Wireframes This is all about determining flow

Twitter Bootstrap Prototype in the browser UI Packs Today’s UI packs allow for you to get started right in the browser! Chrome Developer tools!

Mock it

Mockups generally are medium to high fidelity prototypes made in software like There’s nothing lean about a mock and in fact should be done once you’ve tested everything else.

Collaborate?

Will your team and designer always be together? How can you collect feedback and test these wireframes & mockups?

Meet GIFs Images Prototypes Have live discussions on your [ Wireframes Mockups Videos PDFs ] with anyone, anywhere

Scribble over mockups. Track versions. Get them approved faster. Use TableTop Sync

Your cases?

I’m fairly active on twitter: @jumbld & extra good karma for you if you try out www.FrameBench.com and give us feedback

Share on Facebook Share on Twitter

Add a comment

Related presentations

Related pages

Lean Prototyping - A practical guide

Lean Prototyping - A practical guide. Rohit Agarwal ... There’s nothing lean about a mock and in fact should be done once you’ve tested everything else.
Read more

Lean Prototyping – A Practical Guide – Blume Ventures

How do you prototype without wasting tons of resources? Welcome to lean prototyping. From the guy that prototyped framebench.
Read more

Prototyping | LinkedIn

... Prototyping & Lean Product Strategy. ... Lean Prototyping - A Practical Guide. 200,643 Views. ... Practical prototyping. 0 Views.
Read more

Lean Prototyping - A Practical Guide | Bonnes | Human ...

Ressource partagée sur la section Bonnes pratiques par Antony Zanetti ayant pour titre : Lean Prototyping - A Practical Guide
Read more

the_guide_to_prototyping.pdf - scribd.com

the_guide_to_prototyping.pdf - Free download as PDF File (.pdf), Text File (.txt) or read online for free. Scribd is the world's largest social reading and ...
Read more

Prototype to Product: A Practical Guide for Getting to ...

Prototype to Product: A Practical Guide for Getting to Market [Alan Cohen] on Amazon.com. *FREE* shipping on qualifying offers. Product development is ...
Read more