2011/09/16 Taiwan UX Summit: App設計實戰:在開始寫程式之前2. 李易修 Justin Lee
·•赫迅互動科技 使用者經驗架構師
·•UiGathering創會成員與工作小組理事
·•www.lis186.com
·•lis186@gmail.com
·•twitter, plurk: @lis186
10. 設計是全盤瞭解後產出解決方案
視覺
介面
架構
功能
目標
改繪自"The Elements of User Experience: User-Centered Design for the Web” by Jesse James Garrett
15. 劇本法設計 草圖
人
活動
需求 設計
境 物
20. 代言人: 幫組員自我介紹
把前面的素材貼在A3紙上
他/她的名字是____
用的手機是_____
愛用的App有_____
因為____
2分鐘+30秒
30. 劇本法設計
利用說故事的方式,
預測系統的使用情境,
在早期發現問題和設計機會。
31. 知識與習慣
使用者
活動
環境 物品
背景環境與狀況 功能與面貌
32. 知識與習慣
使用者
活動
環境 ?
背景環境與狀況 功能與面貌
35. 劇本法設計流程
需求分析 設計 原型製作
問題劇本 概念劇本 規格
現狀觀察 慣例、
設計準則
功能清單
改繪自"Usability Engineering: Scenario-Based Development of Human Computer Interaction" by Mary Beth Rosson, John M. Carroll
37. 4.探索
2.建構
3.進入 5.離開
1.想像
圖"Gamestorming”, page 3 by Dave Gray, Sunni Brown, and James Macanufo
39. 故事的元素
4.探索
2.建構
3.進入 5.離開
1.想像
圖"Gamestorming”, page 3 by Dave Gray, Sunni Brown, and James Macanufo
40. 合理的場景
4.探索
2.建構
3.進入 5.離開
1.想像
圖"Gamestorming”, page 3 by Dave Gray, Sunni Brown, and James Macanufo
41. 編故事
4.探索
2.建構
3.進入 5.離開
1.想像
圖"Gamestorming”, page 3 by Dave Gray, Sunni Brown, and James Macanufo
42. 發現需求
4.探索
2.建構
3.進入 5.離開
1.想像
圖"Gamestorming”, page 3 by Dave Gray, Sunni Brown, and James Macanufo
43. 產生靈感
4.探索
2.建構
3.進入 5.離開
1.想像
圖"Gamestorming”, page 3 by Dave Gray, Sunni Brown, and James Macanufo
51. 從環境看限制
公車還有多久會來?
通勤族
太熱,
不想等太久
等車
公車亭 站牌
52. 過去怎麼解決?
公車還有多久會來?
通勤族
太熱, 看班次表
不想等太久
等車 有沒有人等車?
公車亭 站牌 靠經驗
53. 解決辦法可以是?
公車還有多久會來?
通勤族
太熱, 查詢等候時間
不想等太久
等車 到站提醒
公車亭 App
54. 不同情境有不同的需求
公車還有多久會來? 會不會遲到?
坐幾號車可以到?
通勤族 通勤族
等車 坐車
公車站牌 ? 公車上 ?
56. 要往哪裡去?
青春不老泉
海怪
印度
改繪自"Gamestorming”, page 5 by Dave Gray, Sunni Brown, and James Macanufo
57. Brainstorm:列出功能清單
在A3紙上列出功能
改繪自"Gamestorming”, page 245 by Dave Gray, Sunni Brown, and James Macanufo 3分鐘
59. NUF測試:決定重要性
新穎性、有用度、可行性
取自"Gamestorming”, page 245 by Dave Gray, Sunni Brown, and James Macanufo 3分鐘
66. 草圖不是原型
草圖用於設計 原型用於修正
“Sketching User Experience”, Bill Buxton
71. 畫草圖:App主要功能
各自畫在A3紙上,至少3個畫面
http://johnhenrybarac.com/notes-on-designing-the-guardian-iphone-app/
3分鐘
72. 討論:第一次草圖
組內討論各草圖的優點、缺點
http://johnhenrybarac.com/notes-on-designing-the-guardian-iphone-app/
6分鐘
73. 畫草圖:改善
各自畫在A3紙上,至少3個畫面
http://johnhenrybarac.com/notes-on-designing-the-guardian-iphone-app/
3分鐘
74. 討論:第二次草圖
組內討論各草圖的優點、缺點
http://johnhenrybarac.com/notes-on-designing-the-guardian-iphone-app/
6分鐘
78. 考慮握持方式
http://gesturecons.com/
106. 謝謝指教!
李易修 Justin Lee
·•赫迅互動科技 使用者經驗架構師
·•UiGathering創會成員與工作小組理事
·•www.lis186.com
·•lis186@gmail.com
·•twitter, plurk: @lis186