Download - User Interface in the Jungle
![Page 1: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/1.jpg)
Handlino http://handlino.com
User Interface Designin the Junglehlb, the designer of Handlino Inc.
![Page 2: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/2.jpg)
Jungle ➔ 未開發 / 危險
![Page 3: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/3.jpg)
Jungle ➔ 探險 ☺
![Page 4: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/4.jpg)
Handlino http://handlino.com
• web site
• web app
• web application
• web service
![Page 5: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/5.jpg)
Hardware
![Page 6: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/6.jpg)
Software
![Page 7: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/7.jpg)
Webware
![Page 8: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/8.jpg)
making web UI *is* easy
![Page 9: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/9.jpg)
Anyone can cook!
![Page 10: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/10.jpg)
Save as Web Page
![Page 11: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/11.jpg)
WYSIWYG
![Page 12: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/12.jpg)
現實
![Page 16: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/16.jpg)
Handlino http://handlino.com
• write HTML
• draw images
• borrow(copy) some javascript codes
![Page 17: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/17.jpg)
Handlino http://handlino.com
• write HTML
• draw images
• borrow(copy) some javascript codes
• and write some CSS (OMG!)
![Page 18: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/18.jpg)
uncertainty
![Page 19: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/19.jpg)
devices
![Page 20: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/20.jpg)
IPHONE WEB (V)
320 x 416
320 p
x
416 px
IPHONE FULL (V)
320 x 480
320 p
x
480 px
IPHONE WEB (H)
480 x 268
480 p
x
268 px
IPHONE FULL (H)
480 x 320480 p
x
320 px
MOBILE PHONE
320 x 240
320 p
x
240 px
MOBILE
PHONE
240 x 320
240 p
x
320 px
MOBILE
PHONE
240 x 240
240 p
x240 px
MOBILE
PHONE
240 x 176
240 p
x
176 px
MONITOR RESOLUTION
1024 x 768
1024 p
x
768 px
MONITOR RESOLUTION
800 x 600
800 p
x
600 px
Resolutions
![Page 21: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/21.jpg)
We have browsers
![Page 22: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/22.jpg)
Browsers have abilities
![Page 23: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/23.jpg)
Browsers have disabilities
![Page 24: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/24.jpg)
Browsers have bugs
![Page 25: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/25.jpg)
Bugs even have their own names!
![Page 26: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/26.jpg)
![Page 27: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/27.jpg)
Handlino http://handlino.com
所見非所要WYSINWYW
What You See Is Not What You Want
![Page 28: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/28.jpg)
Handlino http://handlino.com
所見天曉得WYSIWGK
What You See Is What God Knows
![Page 29: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/29.jpg)
well,not that easy
☹
![Page 30: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/30.jpg)
Only the fearless can be great!
![Page 31: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/31.jpg)
Guideline?
![Page 32: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/32.jpg)
![Page 33: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/33.jpg)
Pros:More than one way to do it.CPU/memory usage and response time are the only limits
![Page 34: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/34.jpg)
Cons:More than one way to do it.
![Page 35: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/35.jpg)
和多繽紛樂
more: 2, 3
![Page 36: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/36.jpg)
motion blurhttp://www.flashden.net/item/horizontal-scroller-motion-blur/23377
![Page 37: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/37.jpg)
Pitfallthink twice before doing
![Page 38: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/38.jpg)
1right mouse key
![Page 39: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/39.jpg)
11OS-like UI
Canny Valley
![Page 40: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/40.jpg)
111Make it perfect
keep changing and evolving
![Page 41: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/41.jpg)
Design Pattern
![Page 42: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/42.jpg)
![Page 43: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/43.jpg)
![Page 44: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/44.jpg)
![Page 45: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/45.jpg)
![Page 46: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/46.jpg)
![Page 47: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/47.jpg)
accessibility
![Page 48: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/48.jpg)
![Page 49: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/49.jpg)
![Page 50: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/50.jpg)
![Page 51: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/51.jpg)
![Page 52: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/52.jpg)
best UI
![Page 53: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/53.jpg)
Web UI is not the best UI
![Page 55: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/55.jpg)
ご清聴ありがとうございましたhttp://handlino.com/
謝謝
![Page 56: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/56.jpg)
創用 CC姓名標示-非商業性-相同方式分享 2.5 台灣
這份投影片的文字部分(含備忘稿)以創用 CC 姓名標示-非商業性-相同方式分享 2.5 台灣授權條款授權,請參考完整授權條款。「姓名標示」部分請標註「薛良斌 http://hlb.yichi.org」。
![Page 57: User Interface in the Jungle](https://reader034.vdocuments.net/reader034/viewer/2022051613/54c8215c4a795926648b4593/html5/thumbnails/57.jpg)
Handlino http://handlino.com
• http://www.flickr.com/photos/77922700@N00/121752716/
• http://www.flickr.com/photos/9052666@N05/1795564765/
Thanks