描述產品介面設計的工作

Input and Output

介面是虛擬與現實交換資訊的途徑，讓人與數位產生了溝通。

1. 運用視覺傳達的知識：
   針對不同媒介進行視覺設計，包含文字排版、配色規劃、按鈕ICON、動態設計、建立風格與維持整體形象的一致性。
2. 掌握媒介裝置的特性：
   可能是手機、平板、電腦、電視螢幕甚至穿戴裝置，限制與系統規範都不同。
3. 擁有資訊架構的概念：
   考慮產品的功能、流程與層級規劃。
4. 認識互動與人因科學：
   針對問題描繪用戶畫像，觀察使用者行為、觸發、操作，訪談與易用性測試，製作產品原型。
5. 關注使用者調查研究：
   瞭解目標使用者，收集數據以洞察真正的需求、挖掘潛在用戶。
6. 善於各崗位溝通理解：
   先理解 PD/PM 需求，再聽懂 IxD 邏輯，讓 RD 看懂圖稿，最後用成品說服上頭…。

PD,PM:產品設計or專案經理 / IxD:交互,互動設計 / RD:研發工程師 / VD:視覺設計

視覺規範

傳統廣告時代由 CIS 延伸到企業的 Brand Guidelines，APP 也會有數位時代的 Guidelines

Uber Brand Guide / IBM Design Language / Medium UI Style Guide

於天貓的經驗，因為產品架構太大，必須將線、按鈕、列表、ICON、顏色與字號搭配做歸納整理，不只是編寫視覺規範的手冊，就連在程式與 css 方面都必須將介面模組化。

一來維持風格的統一、體驗的一致，二來減少重複製作的苦工與資源浪費，提升效率。

製作設計規範的挑戰：

1. 互動設計師：考慮各情況規劃出合理具擴展性的交互邏輯(釐清使用原則與介面模組化)。

2. 視覺設計師：考慮易讀辨識、通用、美觀，填上一致並符合產品形象的視覺元素(上有'IxD'下有'RD'就是個夾心餅)。

3. 程式設計師：模組化實現與還原度，功能都做不完了，還來跟你細細雕刻介面。而且要跟上規範更新的速度...很痛苦對吧。

4. 推廣、更新、驗收：要用一套標準化規範去說服設計師本身已經是難事，還得嚴格遵守。
在一間提倡”擁抱變化”為核心價值的大公司工作就是跟時間賽跑，經常兩個禮拜後有新功能要上線了，進行頁面設計前還得先閱讀厚厚的規範，發現這裡不適用那裡有問題，必須馬上提出更新，並在上線前檢查程式的介面還原度。

好的設計規範能與時俱進，並且靠所有人維護與推廣來發揮它的最大價值。

在天貓工作時，曾遇過 Mobile 設計規範要改版比照淘寶的任務。
撇除背後可能的政治因素不說，回到設計本身思考。即使是因為使用者已經習慣淘寶的使用模式，為了減少用戶的學習成本而去做改變，但我們做的究竟是 Follow, 亦或只是粗糙的 Copy ?

設計師應該學習效率，而不是懶惰；我們思考，不僅只是領命行事。我在週報上寫了自省與質疑，得到一位程式開發的同學這樣回覆：

『手淘培養了用戶的購物的心智模型，這也許是對的。但我覺得這個模型應該是一個更高層面的，比如說購物流程或結算步驟之類，而不是具體到 UI 元素與交互細節，如果說用戶習慣了手淘一個頁面的使用，在使用另外一個 APP 時，他也許會期待有相同的功能、操作方式或使用流程，但不至於期待界面風格、按鈕的位置都相似吧？如果是這樣，那麼所有電商的頁面就都是一樣的了，還有什麼創新呢？齊白石說：學我者生，像我者死。天貓客戶端存在的價值應該在於它與手淘不同的地方，如果完全相同，它就沒有存在的必要。』

究竟我們在快速迭代與業務的需求壓力之下，還有空間去思索設計語言能否體現品牌精神，甚至創造良好的體驗嗎？

裝置特性

接觸過手機螢幕、車載裝置、電視娛樂後了解不同媒介的差異，車用平板的使用情境肯定跟家用不同；手機螢幕跟電視螢幕的尺寸相比差多了；控制與輸入的方式多樣化(手、語音、遙控器、體感控制)，我們足夠瞭解該裝置的特性與限制嗎？
手機得注意主流型號的大小，同一畫面在不同尺寸螢幕縮放比呈現，更重要的是設計規範，通常 APP UI 應遵循 iOS 與 Android 規範做兩種不同的版本……如果有足夠的時間跟預算。

主流系統設計規範：
Google Material Design / iOS / Universal Windows Platform

平台APP畫面比較：iOS vs Android

iOS 返回鈕放在導航欄；Android 自帶實體返回鈕；WP在左下。
iOS Tab bar 在下方；Android 在上方，若 Tab 過多則改為側邊導航欄(Navigation drawer)；WP 建議手機版放在下方，卻沒考慮到容易跟實體按鈕打架。
iOS 有 Force Touch, Android 跟 WP 有 Long Press…etc

資訊架構

瞭解使用者從哪裡來、將往哪裡去；釐清產品脈絡、定義功能、分類與組織訊息、規劃層級。

Information Architecture is User + Content + Context

具體產出：

• 功能圖 (Functional Map)
• 流程表 (Flowchart)
• 線框佈局/交互稿 (Wireframe/Layout)
• 視覺稿 (Mockup) 沒錯..我負責出視覺稿 :P
• 原型 (Prototype) 通常用於廠商 DEMO 或初期使用者測試，僅團隊內部溝通很少會用到高精度原型

1. 通常在前期 PD/PM 開出需求/時程交給 IxD 評估.
2. IxD 規劃流程會與 PD, VD, RD 討論定案，再進行 Layout 交互稿的設計，在這裡除了達成 PD 需求外(有時候不一定是為了解決使用者問題)，RD 也需評估程式實現的可能性與時程掌控，VD 則在交互與程式之間取得平衡，發揮創意 :P
3. 完成 Layout 之後會同時丟給 VD, RD, 這樣在進行視覺設計的同時，程式也能著手開發功能。
4. 最後再由視覺交給程式確定的 UI 視覺稿去還原介面。

互動設計

真實的人與機器進行交換訊息的過程，最終得到機器給予的回饋。

或許在談互動之前得先定義這個詞指的是什麼：
是依附在科技下的人機互動(Human-Computer Interaction)？
還是由心理、人類、社會學建構的社會互動(Social interaction)？
又或是隨網路科技普及兩者界線模糊而催生的服務設計(Service design)？

服務設計 偏向顧問管理公司的專業，相對於解決單一產品的問題，更強調整合性與整體服務流程的策略設計，脫離不了顧客體驗、服務理論。

互動設計師擅於探索問題、觀察現象，透過定量調查分析目標人群(Target User)，描繪使用者畫像(Persona)模擬用戶，建立使用場景(scene)模擬情境，最後建構產品雛形讓邏輯貼近使用者的心智模型(Mental Model)，再透過一系列的易用性測試(Usability Testing)、訪談去修正產品。

CIID 哥本哈根互動設計學院，可參考專門學校涵括哪些課程。

使用者調查研究

精準獵殺，讓我們來解剖使用者的大腦吧。

前期調研的觀察與量化，目的是為創造符合使用者需求的產品，隨著每一次訪談受測來修正產品路線、降低風險，並從中建立可衡量的標準。
原本想寫在互動設計之下，但因應大數據時代能應用的層面越來越廣，各公司也漸漸有獨立的用研團隊。

Twitch CEO: Emmett Shear 談產品初期如何做用戶調研？

後期會有 BI分析師 與 數據挖掘，前者負責分析報表、判斷趨勢與問題，後者需有機器學習、統計學背景的人來建立數據平台，用模型方法來回答各種問題：ex 商家優劣, 商品好壞, 能賣多少…etc

數據能顯示流量、點擊率、轉化率、交易量、停留時間，過濾用戶行為、追蹤用戶回饋、交叉比對、趨勢預測、個性化演算推薦…etc
最後導出決策方案，做為改版更新的依據——而後進行驗證、A/B testing 等等。

雖然分析方法很多，但樣本偏差、選擇性誤導還是有可能讓人錯誤的理解數字。有時候過於重視數字，就會忘記體驗是感性的吧。(行銷部同學請回歸你們的人性。)

數據是量化、科學、證據，行銷的利器——同時也是讓人可以大聲說話的工具。

UED

若設計不以真實為基礎、不以人性為考量，那 UX 就沒有意義了。

UED 集團一般分為三種崗位：

• 視覺設計師 (Visual Designer)
• 互動/交互設計師 (Interaction Designer)
• 用戶研究/使用者經驗調研 (User Researcher)

如果要闡揚UED的核心價值應該會這樣說吧：

我們為打造使用者中心導向的產品而存在，我們的創造與研究構成了整體的”User Experience Design”，為提升易用性 Usability, 滿足甚至超越使用者預期 Expectations, 以創造愉悅的體驗為目標。

——喔，還有產生商業價值。

當你的產品規模不只是 Mobile APP, 背後有龐大而完整的服務體系，數億的金流、用戶、商業行為，它確實的滲入真實生活，那麼要考慮的事情就不只是螢幕內的東西了。

如果 UED 是最貼近使用者的部門，是否最有機會洞察而創造一些不一樣的價值？

User, Need, Scenario.
Function, Affordance, Expectations.
Intuition, Sensibility, Emotional.
Experience, Happiness, Real.

後記

去年的今天、這個時候，我得到了很多啟發；我們參加 Intel Make It Wearable 穿戴裝置的創意發想賽得到其中一輪優選，受邀去 San Francisco 作為決賽的觀眾。

決賽的十組分別關注於醫療、幼兒、運動、導航、製造、戶外攝影、模組化手錶等領域，這裡可以看到 Finalists Video.

 

第一名優勝 NIXIE 獲得 50 萬美金，以四軸空拍器為發想的穿戴裝置，一個人翻山越嶺也能用的迴旋鏢戶外攝影機，現場的原型機是可以自動飛回來沒錯，但要做到 DEMO 影片裡能套戴在手上的形式還是蠻困難的吧。

戶外用就要考慮續電力，現今小型空拍器無法飛行太久，而戴在手上又不能太重，所以電池的重量體積會是技術上一大困難的部分。

 

第二名是 Open Bionics, 他們的演說非常感動我，有故事、情感，關懷社會與醫療。運用 3D printer 打造感應式機械義肢，相對於傳統醫療用義肢的成本更低，且完全開源。
右圖是他們的 COO 在現場休息時拿出一個小模型跟大家交流 XD

 

第三名是 Proglove, 我覺得這非常厲害，針對生產組裝用的手套，透過各種感測來傳遞注意訊息給使用者以降低失誤。甚至告訴你現在手上的工具在流程裡是對的還是錯的等等，不愧是來自德國的團隊。

我其實很想回學校唸書，像是新媒體或互動設計；不管是創作純粹的互動裝置或是探索人與科技產品有哪些互動可能性，越走越感受對知識的不足，關於設計、理論、經濟、人文與社會。

一腳踏進這領域要感謝很多人，ASUS 的主管 Gin, Design Center 給我許多啟發的 Parks, 帶我進阿里的 仙哥, Eva. 還有前 leader 三可對我這個過於敏感的孩子說鈍感力也是很重要的 :P

有好多同事前輩影響了我的眼界跟想法，難以細數，總之 2016 也持續努力，請多指教。