作者：青溪Joanna
微信公眾號：qingxizhaji（青溪札記）
作者投稿早讀課發(fā)表，轉載請聯(lián)系作者。
曾經(jīng)我也是一名非設計專業(yè)的學生，作為自動化專業(yè)的碩士希望自學做交互設計，有很長一段時間都抱有這樣的疑惑“如何系統(tǒng)的學習、提升交互設計能力”。所以多次翻出這個問題，反復咀嚼過@王閱微、@朱晨 的回答，從中找出我缺乏的、忽略的技能去繼續(xù)補足、努力。
現(xiàn)在從事交互設計工作已有三年時間，希望通過回答這個問題，來對以往獨自摸索、自學路上的一些經(jīng)驗、心得做個總結。如果能給當前期待從事交互設計的新朋友些許指引，那就更圓滿了。
一、理論知識積累
1）《用戶體驗要素：以用戶為中心的產(chǎn)品設計》
講述了經(jīng)典的五層框架：戰(zhàn)略層（產(chǎn)品目標和用戶需求）、范圍層（功能規(guī)格和內容需求）、結構層（交互設計和信息架構）、框架層（界面設計、導航設計和信息設計）、表現(xiàn)層（感知設計）。可以對互聯(lián)網(wǎng)產(chǎn)品經(jīng)理、交互設計師、視覺設計師之間的工作流程、職責有個初步的認識，在后續(xù)學習中也大致明白重心該放在哪個環(huán)節(jié)。
2）《點石成金：訪客至上的網(wǎng)頁設計秘笈》
介紹了don’t make me think 的幾個指導原則 以及可用性測試，一本小書比較容易理解。
3）《認知與設計：理解UI設計準則》
介紹了一些用戶界面設計準則。對于新人來說，常常不知道哪些設計是易用的、用戶容易接受的，所以了解一些設計原則可以有助于我們辯證的思考各種設計方案之間孰優(yōu)孰劣。
4）《About Face 3 交互設計精髓》
經(jīng)典書籍，厚厚一本很難讀完。對于新人來說，可以隨便翻翻，先看看目錄，找那些自己感興趣的、疑惑的章節(jié)讀一讀。
5）《設計師要懂心理學》
介紹人的一些習慣，如何觀察、閱讀、記憶、思考、集中注意力等等很多方面。了解與我們的設計方案交互操作的用戶，是設計師需要持續(xù)關注的。
2、實戰(zhàn)書籍
1）《寫給大家看的設計書（第三版）》
通過大量示例介紹了4大基本設計原則——親密性、對齊、重復、對比，這些原則在界面排版上非常實用。作為非設計專業(yè)的學生來說，學習一些基本的原則很有必要。
2）《設計之下：搜狐新聞客戶端的用戶體驗設計》
結合搜狐新聞客戶端的項目經(jīng)驗，總結了很多干貨，對于新手可以從中了解實際的設計流程。
3）《破繭成蝶：用戶體驗設計師的成長之路》
一本實用性非常高的書，強烈推薦。其中需求分析、設計規(guī)劃這兩章剛好解決了我的一些疑惑，反反復復讀了很多遍，非常有收獲。感謝@劉津、@李月 的辛苦撰寫、無私分享。
4）《移動應用UI設計模式》
關于設計模式的一本書，我讀過之后寫了幾篇讀書筆記，對書中的設計模式配上平時搜集的例子以加深理解，比如這篇移動應用UI設計模式——（1）導航
5）《觸動人心：設計優(yōu)秀的iPhone 應用》
如果對iPhone設計感興趣，可以讀讀這本書，雖然現(xiàn)在看來例子有些舊，但是也不妨礙我們去理解那些優(yōu)秀的設計例子。
3、設計規(guī)范指南
1）iOS 8 人機界面指南
[ISUX轉譯]iOS 8人機界面指南（一）：UI設計基礎
[ISUX轉譯]iOS 8人機界面指南（二）：設計策略
[ISUX轉譯]iOS 8人機界面指南（三）：iOS技術（上）
[ISUX轉譯]iOS 8人機界面指南（三）：iOS技術（下）
2）Material design
Material design非官方中文指導手冊1.0
3）Apple Watch
Apple Watch界面設計規(guī)范
4、設計原則
1）易用性十大原則
《可用性工程》一書中有章節(jié)專門介紹，非常容易理解、也在設計中用的很多的十大原則。
2）移動端設計原則，文章推薦
很多前輩結合自己的項目經(jīng)驗，總結了一些設計原則，用于自查設計方案。也可以通過搜集一些實例，來理解設計原則是如何被應用的。
手機客戶端交互設計原則及信息展現(xiàn)方式（作者：elya）
交互設計原則有哪些？ – 知乎（手機無線設計8原則）
需要時顯示——論App中的功能可見性（作者：小伊萬）
Chrome 瀏覽器的哪些設計符合「Don’t Make Me Think」原則？
二、實戰(zhàn)能力的積累
理論知識可以看做是修煉內功，實戰(zhàn)技能則是轉化為招式——即 設計方案。作為新人，最基礎的是有輸出交互設計方案的能力。之后更多的是積累都在于如何提出易用性高、用戶滿意喜歡的設計方案。
1、交互設計輸出物知多少
1）流程圖
談談頁面流程圖（作者：heidixie）
2）線框圖
同樣是來自heidi三篇文章：
聊聊線框圖：那些必要的理論和前提
為線框圖多留點時間
聊聊線框圖：UED和PD對于線框圖不同的定位
3）交互說明文檔
如何寫一份交互說明文檔（作者：heidixie）
如何編寫交互設計詳細說明文檔（作者：heidixie）
如何制作實用美觀的設計文檔（作者：yoyo）
2、體驗優(yōu)秀的設計
想了解優(yōu)秀的設計，最靠譜的是去體驗、分拆、深挖優(yōu)秀的作品，包括設計模式（界面排版）、交互流程、操作反饋、特殊場景的細節(jié)設計等等。
1）總結設計模式
設計師通常如何發(fā)現(xiàn)靈感？這個問題中elya推薦了很多設計模式類的網(wǎng)站，這是業(yè)界搜集的設計模式庫。除了看他人搜集的，還推薦自己也按照類似的分類方式多搜集設計模式。
2）分任務體驗優(yōu)秀的產(chǎn)品
選擇特定的任務，去體驗優(yōu)秀的產(chǎn)品是如何完成這些任務的（交互流程）。比如，注冊、登錄、發(fā)照片、發(fā)微博、發(fā)語音、評論/回復 等等。
3）總結設計亮點
這些設計亮點可能歸結不到上面任意兩個方面，但是恰恰是這些設計亮點最能體現(xiàn)一個設計師的水平。比如我之前寫過微信發(fā)語音功能的設計亮點 。為什么要記錄？對我來說是好記性不如爛筆頭，放在心里琢磨總沒有寫出來印象深刻。
最后推薦@曉生語錄 的一篇文章：交互設計師如何提高專業(yè)能力，這也是我在入行初期讀過很多遍的文章，感興趣的朋友可以看看。
三、提出交互設計解決方案的能力
1、從子任務開始鍛煉
對學生來說，作品很重要。但是對新手而言，完成一個整體的產(chǎn)品設計可能有些難度。推薦從子任務的設計開始鍛煉，比如前面提到的注冊、登錄、發(fā)照片等等。真正去設計的時候，會發(fā)現(xiàn)有很多細節(jié)設計是平時體驗他人產(chǎn)品過程中容易遺漏的。這個時候可以回頭再留意那些細節(jié)，比較不同的產(chǎn)品設計，多問問自己為什么他們要這么設計，有何優(yōu)缺點、有何取舍，而自己又該如何設計、為什么這樣設計。
通過子任務的設計練習，對如何做交互設計已經(jīng)有了一些提升之后，可以給自己布置一個完整的產(chǎn)品作業(yè)。比如實現(xiàn)某個idea解決用戶的某種需求，這個時候《用戶體驗五要素》的知識就可以派上用場了。嘗試從戰(zhàn)略層開始、一步步完成產(chǎn)品的需求分析、功能分析、原型設計，甚至視覺設計，最終輸出一份完整的作品。
2、設計完整的產(chǎn)品
這個階段涉及到需求分析、導航設計、任務分解、界面排版、交互操作流程等等，再次推薦《破繭成蝶：用戶體驗設計師的成長之路》這本書，實用性非常高。
主要任務的線框圖完成之后，別忘了還有很多操作反饋、特殊場景的細節(jié)設計，《設計之下：搜狐新聞客戶端的用戶體驗設計》一書對于反饋提示總結的非常棒。
設計定稿前，別忘了自查設計方案，看是否有遺漏異常情況的設計，推薦文章如何建立交互設計自查表（作者：網(wǎng)易UEDC YOYO）
四、交互設計工具
工具的作用是用來表達自己的設計方案，初期討論、溝通想法時用紙幣來的最快最方便。軟件的好處則是利于存檔、多人協(xié)作、傳遞。
1、Axure
雖然交互設計工具幾年來層出不窮，但是實用性最強的個人覺得還是Axure ，學習成本低、簡單好用、多平臺通用。對于新手，前期可從排版開始練習畫線框圖，不用沉迷于做復雜的交互效果，因為工作中可能沒有時間做非常細膩的交互動效。當然，如果是給大領導演示方案，一些點擊跳轉還是有必要做的。
2、Origami
制作交互動效的工具，感興趣的童鞋可以學一學，前期的學習成本有點高。
3、Sketch
相比Photoshop，Sketch用來設計界面更輕便。
五、用研、視覺、前端、后臺開發(fā)的了解
可以看看《贏在用戶》，市面上貌似買不到了，學校圖書館大概能借到。百度商業(yè)UED團隊的用戶研究工程師總結的[14種經(jīng)典的用研方法] (http://ued.baidu.com/?p=3880)，推薦看看。
2、審美與視覺設計能力
我相信的一點是，當你看過足夠多的、優(yōu)秀的界面設計之后，審美、配色排版等能力會隨之提升。雖然我自己是學自動化——與設計完全不著邊的專業(yè)，但是這幾年積累讓我對自己的審美還比較自信，至少得到了合作的視覺設計師的認可。
為了鍛煉自己的視覺設計能力，我會做一些練習。比如我的個人網(wǎng)站（）的界面設計就是自己完成。配色從Adobe Color CC挑選再微調，最終的效果至少符合我的喜好。
3、對前端開發(fā)、后臺開發(fā)技術有一定理解
開發(fā)人員幫助我們實現(xiàn)設計方案，如何與他們高效溝通非常重要。雖然不需要會寫代碼，但是了解一些開發(fā)術語，知道前后臺、數(shù)據(jù)庫之間的關系是最基礎的。
我的經(jīng)歷是，畢業(yè)初期一年多的時間交互設計和前端開發(fā)都要做，對HTML、CSS比較熟悉，JavaScript有些了解。再加上自動化專業(yè)也有一些C編程經(jīng)驗，所以與開發(fā)同事溝通起來倒沒啥障礙。不過每個產(chǎn)品的業(yè)務特點不同，仍然需要實時更新對新技術的理解。
六、軟實力的提升
以下幾點是我個人認為非常重要的幾個軟實力，早一點培養(yǎng)早一點受益。
1、時間管理
交互設計方面需要學習的知識非常多，如何評估優(yōu)先級、安排學習計劃非常關鍵。
2、知識管理
這幾年我是evernote的深度用戶，非常遺憾的是沒有更早使用它，所以推薦你選擇一款適合你的知識管理工具。關于知識管理，我的一點心得是別讓搜集的知識分散在各個角落（各個網(wǎng)盤、電腦硬盤、存儲工具），確保知識有統(tǒng)一存放入口，并有個統(tǒng)一的輸出存儲點。
如果沒有知識管理、沒有evernote，我可能也寫不出這篇文章。
3、善用搜索
你的很多疑問，前輩們可能已經(jīng)給出了很多經(jīng)典的回答，所以善用搜索。這里一并感謝在我入行初期，貢獻、分享知識的前輩們 @elya 、@heidixie 、@雅秋、@臭魚、@曉生語錄、@00、@王閱微、@朱晨 等等，非常感謝?。?！
4、多總結，形成自己的一套知識體系和工作方法
@張佳瑋 說“世上萬事，不過是一懶二拖三不讀書”，如果要補充一條就是“四不總結” 。很多時候我們對知識的理解都是零散的存在于腦海中。如果不去總結、不記錄下來，腦容量不夠時可能就遺忘了。
所以多總結、形成自己的一套知識體系和工作方法，對于任何一個職業(yè)都至關重要。
|
