Wireframe, Mockup, Prototype

Documentation for Design and Planning wireframe, mockup, prototype hlb@handlino.com

How Projects Really Work (version 1.5) Create your own cartoon at www.projectcartoon.com How the customer How the project leader How the analyst How the programmer What the beta testers How the business explained it understood it designed it wrote it received consultant described it How the project was What operations How the customer was How it was supported What marketing What the customer documented installed billed advertised really needed

deliverable (n.) A document created during the course of a web design project to facilitate communications, capture decisions, and stimulate innovation.

communication

make people HAPPY☻ client, developer, designer, ...

wireframe : function & layout

mockup : form, design, visual

prototype

wireframe

wireframe mockup

wireframe mockup prototype

wireframe http://www.ﬂickr.com/photos/88864835@N00/48713348/

http://www.ﬂickr.com/photos/35468151759@N01/184032078/

Axure RP (demo)

Mockup http://www.ﬂickr.com/photos/7423705@N02/452860780/

Photoshop

balsamiq mockup http://www.balsamiq.com/products/mockups

Paper Prototyping

Hanmail Paper Prototype http://www.youtube.com/watch?v=GrV2SZuRPv0

HTML Prototyping

polypage http://code.new-bamboo.co.uk/polypage/

when to use what?

in Taiwan

mockup

why we skip Photoshop http://www.37signals.com/svn/posts/1061-why-we-skip-photoshop

wireframe prototype

http://hlb.yichi.org	85
http://www.slideshare.net	47
http://iamhlb.com	5
http://static.slideshare.net	3
http://coderwall.com	2
http://www.chefcecio.it	1
http://www.lmodules.com	1
http://www.health.medicbd.com	1

Wireframe, Mockup, Prototype

by Liang-Bin Hsueh on Nov 15, 2008

Accessibility

Categories

Tags

Upload Details

Usage Rights

8 Embeds 145

Statistics

Wireframe, Mockup, Prototype — Presentation Transcript