wireframe, mockup, prototype
Post on 21-Oct-2014
14.838 views
DESCRIPTION
TRANSCRIPT
Documentation for Design and Planningwireframe, mockup, prototype
How Projects Really Work (version 1.5) Create your own cartoon at www.projectcartoon.com
How the customerexplained it
How the project leaderunderstood it
How the analystdesigned it
How the programmerwrote it
What the beta testersreceived
How the businessconsultant described it
How the project wasdocumented
What operationsinstalled
How the customer wasbilled
How it was supported What marketingadvertised
What the customerreally needed
deliverable (n.)
A document created during the course of a web design project to facilitate communications, capture decisions, and stimulate innovation.
why?
溝通communication
make people
HAPPY☻client, developer, designer, ...
斯斯有三種
wireframe示意圖: function & layout
mockup模型: form, design, visual
prototype雛型
wireframe
wireframe mockup
wireframe mockup prototype
wireframehttp://www.flickr.com/photos/88864835@N00/48713348/
http://www.flickr.com/photos/35468151759@N01/184032078/
http://www.flickr.com/photos/63641363@N00/2648414123/
http://www.flickr.com/photos/76877398@N00/130960238/
http://www.flickr.com/photos/32729422@N00/2192411612/
Axure RP(demo)
Mockuphttp://www.flickr.com/photos/7423705@N02/452860780/
Photoshop
balsamiq mockuphttp://www.balsamiq.com/products/mockups
Paper Prototyping
Hanmail Paper Prototypehttp://www.youtube.com/watch?v=GrV2SZuRPv0
HTML Prototyping
polypagehttp://code.new-bamboo.co.uk/polypage/
when to use what?
wireframe mockup prototype
in Taiwan
mockup
why we skip Photoshop
http://www.37signals.com/svn/posts/1061-why-we-skip-photoshop
wireframe mockupprototype
prototypewireframe
創用 CC姓名標示-非商業性-相同方式分享 2.5 台灣
這份投影片的文字部分(含備忘稿)以創用 CC 姓名標示-非商業性-相同方式分享 2.5 台灣授權條款授權,請參考完整授權條款。「姓名標示」部分請標註「薛良斌 http://hlb.yichi.org」。
謝謝ご清聴ありがとうございました