設計,不要急著打開電腦、手機、相機,從紙跟筆開始才是明智之舉!~曾憲鈺
華碩電腦在 3/26 有舉辦新手機 – Padfone Infinity - 的新機發表會,我做了一支關於 SuperNote 的影片,請看:
上鏡頭就要美美的
這是我第一支「正式」的影片,而且是兩天半內從無到有完成的影片。用數位相機拍 720P 的影片,再用 iMovie 剪輯,但一切的設計,就在那天中午老闆說:
我們來做一支影片吧!
後開工。在時間緊迫,沒人教又沒人帶的狀況下,只好咬著牙硬撐,打定主意慢慢摸索,慢慢嘗試。隔天就把數位相機帶來,架起相機,打光,喬角度,用「我的手」拍了第一個版本。然後花了一下午剪接。
結果,晚上在「大老闆覺得這隻『歷盡滄桑』的手不適合搬上螢幕」為由,裁定重拍。只好隔天找了「手指美美的」「細細長長的」手模,重新再教她們操作,重新再拍一次。
還好,SuperNote 設計得真是容易上手,不用思考就知道怎麼用,她們很快上手,我也因為有了第一次經驗,重拍的速度就快多了。
繼前一篇提到互動設計的第一步之後,這一篇我將用《Designing for Interaction: Creating Innovative Applications and Devices》這本書的內容當作範本,繼續探討互動設計的 4 種方法,並加入一些 App 設計的範例。
4 種解決問題的方法
有人說工程師是「看見問題、解決問題」,而設計師是「看見機會、創造機會」,無論是哪一種說法,其實本質都是一樣:
從 Problem 到 Solution; 從 Opportunity 到 Solution
其中,尋求 solution 的方法有 4 種,分別是:
以使用者為中心的設計 (User-Centered Design, UCD)
以活動為中心的設計 (Activity-Centered Design, ACD)
系統設計 (System Design)
天才設計 (Genius Design)
就從《Designing for Interaction: Creating Innovative Applications and Devices》這本書開始吧!
什麼是互動?什麼是互動設計?
從今天早上到現在,你我已經使用許多「被互動設計」過的產品或服務了。如果單以軟體服務來看,你接手機、打電話、開 email 信箱、打開檔案總管叫出檔案、編輯一份報表… 都與互動設計有關。
雖然我們每天都會遇到或好或壞的互動設計的例子,但是要為互動設計下一個明確的定義卻不容易。作者 Saffer, Dan 認為,
An interaction… is a transaction between two entities, typically an exchange of information, but it can also be an exchange of goods or services.
互動是兩個實體之間的交流,通常是訊息的交換,但也可以包括實物或服務的交換。
而且
The interaction itself takes place between people, machines, and systems, in a variety of combinations.
這些互動發生在人、機器與系統之間,而且有多種不同的組合。
而互動設計就是在處理這些交換的過程。
最近和幾個夥伴們開發了一支在 Android 的 Smartphone 和 Tablet 上的 App,我擔任的角色偏向於 Interaction Design (說「偏向於」是因為同時還扮演了 PM、和部分 Visual Design 的角色),想把開發過程整理出個脈絡,並且把 App 開發的流程和幾個 Interaction Design 的基本概念和你分享。
一本入門書:Designing for Interaction
首先說到 Interaction Design (互動設計),我會推薦一本入門書:《Designing for Interaction: Creating Innovative Applications and Devices》,你可以先下載第一章來讀一讀,你將會對什麼是 Interaction 和什麼是 Interaction Design 有個初步的概念。然後你會在 第 21 頁、圖 1.15 看到這一張圖,我覺得很棒,特別要提出來聊一下。
User Experience Design (用戶體驗設計) 幾乎涵蓋了所有領域,而 Interaction Design (互動設計) 則佔了其中很大的一部分。也可以說,Interaction Design …
如果你還沒讀過《設計的法則》這本書裡面的幾個設計法則,請先去讀一讀下面我分享的三則,再來看這一篇會比較容易進入狀況:
1.〈需要的等級 (Hierarchy of Needs)〉
2.〈席克法則 (Hick’s Law)〉
3.〈費茨法則 (Fitts’ Law)〉
這一次我要分享:〈約束 (Constraint)〉。
在設計裡面的「約束」指的是:
Limit the actions that can be performed on a system.
限制在系統中所能表現出的行動。
其實,約束 的設計不斷地出現在我們的生活中。例如,小朋友都知道的順口溜:「紅燈停、綠燈行」,限制了開車行進的次序;平交道叮叮叮叮的聲音搭配柵欄,限制了火車與汽機車行進的順序;不常搭高鐵的人一定遇到過高鐵車票插反而卡在閘門過不去的窘境;在 10 樓進了向下行的電梯,想按 16 樓就是不行… 例子非常多。
瞭解設計的法則是基礎
我曾經介紹過《設計的法則》這本書,其中已經談過〈需要的等級 (Hierarchy of Needs)〉和〈席克法則 (Hick’s Law)〉。
在〈需要的等級 (Hierarchy of Needs)〉提到,除了基本的 功能性需要 (Functionality)、可靠性需要 (Reliability)、使用性需要 (Usability) 之外,使用者還需要更多的 熟練度需要 (Proficiency)。
在〈席克法則 (Hick’s Law)〉則說道,當選項增加時,人們下決定的時間就會增加。
繼上一次談到 需要的等級 (Hierarchy of Needs) 之後,常常在討論當中會到這個層級架構。接著我要再提一個有用的設計的法則:席克法則 (Hick’s Law)。我說過,不管你是不是科班出身,還是別人覺得你不夠 Real,都沒有關係,因為這些顯而易見的設計法則,就在我們每一天的生活裡面,一點都不難懂。
選項多寡與決定時間成正比
席克法則講的是:當選項增加時,人們下決定的時間就會增加。利用這個法則,可以測出在多重選擇下,人們需要多少時間才能才能做出決定。
最近幾年各式各樣產品或服務的「開箱文」很火紅,在 Google 中搜尋「開箱文」,再加上你要找的關鍵字 (例如:華碩、變形),保證多到你讀都讀不完。但,我在想:
「開箱文」有專用的英文名稱嗎?市場大眾老是推崇 Apple 的「開箱經驗」,那到底「開箱經驗」是什麼呢?
有的!就叫做 OOBE (Out-of-Box Experience)。根據 wikipedia 的定義,
Out-of-box experience is the interactions and first impressions a user has with a product when opening its packaging and taking it into use.
開箱經驗,就是使用者在打開產品包裝並開始使用的互動與第一印象。
OOBE (發音為:嗚比) 若以我們常接觸到的產品為例,可以分為硬體和軟體的 OOBE。以硬體來說,好的 OOBE 讓使用者有明確清楚的指示而能夠快速上手;以軟體來說,OOBE 包含了下載、安裝、歡迎頁、設定精靈,到第一次開始使用的引導,例如 Windows 的安裝就是一個最常被提起的 OOBE 例子。
以下我列舉三個關於 OOBE 的要素。
三個 OOBE 要點
一個好的 OOBE 第一要素就是:容易開箱。你說:「廢話!這不是本來就應該這樣嗎?」那我告訴你:許多基本的原理,往往設計師就是搞不清楚狀況。