《設計之下:搜狐新聞客戶端的用戶體驗設計》內容簡介：形而上者謂之道，形而下者謂之器。匠者，器也。處身平凡的匠人不斷追求向上的設計之道。《設計之下:搜狐新聞客戶端的用戶體驗設計》沒有華麗的辭藻和長篇大論的理論，作者是搜狐一線的設計團隊，寫作過程中他們盡力還原真實的工作場景，並總結出了一些實用的經驗和方法。《設計之下》共三部分，全面講解了用戶體驗設計的流程和方法。第一部分為“互動設計”，闡述了從項目啟動、解析需求到原型設計的過程，並且總結了互動設計的要點：大局觀、操作流程簡捷、形式新穎且統一、各種特殊情況等。第二部分為“視覺設計”，闡述了界面、顏色、圖示、質感、動畫、切圖等具體方法，以及如何與開發/測試工程師們合作、尋找平衡設計與技術的方法。第三部分為“他們眼中的優秀設計師”，通過產品經理、程式設計師、運營、市場經理的視角，闡述了如何成為一名優秀的設計師。《設計之下:搜狐新聞客戶端的用戶體驗設計》適合互動設計師、視覺設計師、用戶體驗從業人員參考閱讀，亦可作為設計類專業學生的參考用書。
基本介紹
- 書名：設計之下:搜狐新聞客戶端的用戶體驗設計
- 作者：搜狐新聞客戶端UED團隊
- 出版社：電子工業出版社
- 頁數：276頁
- 開本：16
- 品牌：電子工業出版社
- 外文名：Invisible Design
- 類型：計算機與網際網路
- 出版日期：2014年1月1日
- 語種：簡體中文
- ISBN：7121220997
基本介紹,內容簡介,作者簡介,專業推薦,媒體推薦,名人推薦,圖書目錄,序言,
基本介紹
內容簡介
第一本單個APP全流程設計成功案例的詳細分享書，以真實工作場景講互動設計、視覺設計流程與方法，及設計師要懂的產品、開發、運營、市場，解決設計師遇到的問題。 1、《設計之下》以產品為核心，系統全面地介紹了設計流程和方法。寫在書中的是搜狐新聞客戶端UED團隊一線經驗的總結，不僅有很多實實在在的案例，更有對用戶體驗設計的思考和感悟，以及設計人員與產品、開發、運營及市場人員溝通的方法和技巧。 2、《設計之下》由2012蘋果年度最佳套用《中國古典家具》設計師董翔鶴帶領搜狐新聞客戶端UED團隊精心打造，其工作內容圍繞移動平台，包括視覺體驗、互動設計、渠道運營、PC官網及自媒體後台支持。他們的生存面貌、發展方式體現了當下多數從業者的生存狀態，所以《設計之下》對設計師有很高的參考價值。 3、好的設計簡單地說就是又要好看又要好用，《設計之下》沒有花哨的語言，華麗的外衣，只是將實實在在的流程與方法裸裎給大家，點滴匯聚，與前輩、後來者分享。
作者簡介
搜狐新聞客戶端UED團隊隸屬於搜狐新媒體中心，成立於2012年，專門負責搜狐新聞客戶端產品的體驗設計。工作內容圍繞移動平台，包括視覺體驗、互動設計、渠道運營、PC官網及自媒體後台支持。團隊始終致力於提升搜狐新聞客戶端的用戶體驗，改善閱讀及獲取資訊的方式。六人團隊小而彌堅，個人與團隊共同成長。我們的生存面貌、發展方式體現了當下多數從業者的生存狀態，希望通過這本書能和您分享一些案例思考和感悟。
專業推薦
媒體推薦
搜狐新聞客戶端的UED團隊有自己的小宇宙，他們特別在乎自己的作品，特別熱愛自己的作品，他們把用戶滿意看得比金子還寶貴，我從來沒有干預過他們的視覺和互動，我不需要這么做。
——搜狐副總裁 方剛
設計師應時刻心存社會責任感，著眼於用戶和生活，致力於創造確實有用、好用的產品。本書作者結合從學習到工作的經歷，詳細講述了搜狐新聞客戶端的設計全過程。不僅有很多實實在在的設計案例，更有對用戶體驗設計的思考和感悟。
——清華美院院長 魯曉波
第一本詳細講述單個App成功案例設計全流程的分享書，全面介紹信息架構、原型、互動、視覺、動畫、Icon、品牌的具體設計方法以及與相關人員的合作細節。搜狐新聞UED團隊的分享精神和及時總結做法值得從業者學習，相信這會成為設計師案前一本極好的參考書。
——國際體驗設計協會（IxDC）秘書長 胡曉
一本實在的書，沒有太多花哨的言語，以產品為核心，系統而全面地介紹了設計流程和方法。一本很好的參考書，可以作為流程管理的範本。值得一提的是，其中一個章節專門介紹了產品、開發與運營部門對UED的看法，這對於企業內部溝通和產品塑造有著很重要的作用。
——Iconfans創始人 董景博
——搜狐副總裁 方剛
設計師應時刻心存社會責任感，著眼於用戶和生活，致力於創造確實有用、好用的產品。本書作者結合從學習到工作的經歷，詳細講述了搜狐新聞客戶端的設計全過程。不僅有很多實實在在的設計案例，更有對用戶體驗設計的思考和感悟。
——清華美院院長 魯曉波
第一本詳細講述單個App成功案例設計全流程的分享書，全面介紹信息架構、原型、互動、視覺、動畫、Icon、品牌的具體設計方法以及與相關人員的合作細節。搜狐新聞UED團隊的分享精神和及時總結做法值得從業者學習，相信這會成為設計師案前一本極好的參考書。
——國際體驗設計協會（IxDC）秘書長 胡曉
一本實在的書，沒有太多花哨的言語，以產品為核心，系統而全面地介紹了設計流程和方法。一本很好的參考書，可以作為流程管理的範本。值得一提的是，其中一個章節專門介紹了產品、開發與運營部門對UED的看法，這對於企業內部溝通和產品塑造有著很重要的作用。
——Iconfans創始人 董景博
名人推薦
設計師應時刻心存社會責任感，著眼於用戶和生活，致力於創造確實有用、好用的產品。本書作者結合從學習到工作的經歷，詳細講述了搜狐新聞客戶端的設計全過程。不僅有很多實實在在的設計案例，更有對用戶體驗設計的思考和感悟。
——清華大學美術學院院長 魯曉波
一本實在的書，沒有太多花哨的言語，是以產品為核心，系統全面介紹其設計流程和方法的書籍。你可以把它當做參考書，也可以作為流程管理的範本。裡面介紹了產品設計過程中運用了哪些方法、技巧，有很好的學習借鑑作用。另外值得一提的是，書中將產品、開發及運營對UED部門的看法也專門拿出很大的比例來寫，這對於團隊溝通和產品塑造有著很重要的作用。
——Iconfans創始人 董景博
——清華大學美術學院院長 魯曉波
一本實在的書，沒有太多花哨的言語，是以產品為核心，系統全面介紹其設計流程和方法的書籍。你可以把它當做參考書，也可以作為流程管理的範本。裡面介紹了產品設計過程中運用了哪些方法、技巧，有很好的學習借鑑作用。另外值得一提的是，書中將產品、開發及運營對UED部門的看法也專門拿出很大的比例來寫，這對於團隊溝通和產品塑造有著很重要的作用。
——Iconfans創始人 董景博
圖書目錄
互動設計
第1章項目啟動
1.1從想法到項目
1.2什麼是項目
1.3項目啟動會
第2章解析需求
2.1互動設計的“五要素”
2.2閱讀產品文檔
2.3互動模型
2.4功能系統
2.5信息架構
2.6工具和方法
2.7小結
第3章原型設計
3.1概念設計
3.2低保真原型
3.3高保真原型
4.5動畫的重要引導作用
4.6考慮到各種特殊情況
4.7尊重平台特性了解技術限制
視覺設計
第1章準備
1.1工欲善其事必先利其器
1.2 Ul設計師的伴侶—Photoshop
1.3開始前要做的功課
第2章界面設計
2.1風格
2.2布局
2.3被放大的標題
2.4不同平台的特殊區分
2.5同類之間的歸納
第3章你的界面是什麼顏色
3.1顏色和情感
3.2主色和輔助色
3.3亂花漸欲迷人眼
3.4那些微妙的漸變色
3.5強調色的適當運用
3.6界面上的特殊色
3.7小結
第4章優美的圖示
4.1哪些地方可以運用圖示
4.2風格鮮明的圖示
4.3表意
4.4我們要做什麼樣的圖示
4.5實例
第5章界面質感
5.1擬物
5.2扁平
5.3質感
5.4小結
第6章錦上添花的UI動畫
6.1輔助建立完整的層級關係
6.2讓操作變得更有趣
6.3指示性的動效
6.4畫龍點睛
6.5平台區別
6.6小結
第7章切圖
7.1平台的不同特性
7.2尋找自己高效的切圖方法
7.3標註檔案
7.4小結
第8章開發與測試工程師們的建議和看法
8.1共同推動夢想的實現
8.2確保實現品質
8.3最終的取捨
第9章給設計點靈魂
9.1優雅的等待
9.2隱藏的情懷
第10章關於品牌的二三事
10.1無形的價值
10.2腳踏實地
10.3實踐出真知
10.4小結
他們眼中的設計師
第1章產品經理有話說
第2章設計在上開發在下
第3章運營眼中的UED
第4章一個市場人的自白
第1章項目啟動
1.1從想法到項目
1.2什麼是項目
1.3項目啟動會
第2章解析需求
2.1互動設計的“五要素”
2.2閱讀產品文檔
2.3互動模型
2.4功能系統
2.5信息架構
2.6工具和方法
2.7小結
第3章原型設計
3.1概念設計
3.2低保真原型
3.3高保真原型
4.5動畫的重要引導作用
4.6考慮到各種特殊情況
4.7尊重平台特性了解技術限制
視覺設計
第1章準備
1.1工欲善其事必先利其器
1.2 Ul設計師的伴侶—Photoshop
1.3開始前要做的功課
第2章界面設計
2.1風格
2.2布局
2.3被放大的標題
2.4不同平台的特殊區分
2.5同類之間的歸納
第3章你的界面是什麼顏色
3.1顏色和情感
3.2主色和輔助色
3.3亂花漸欲迷人眼
3.4那些微妙的漸變色
3.5強調色的適當運用
3.6界面上的特殊色
3.7小結
第4章優美的圖示
4.1哪些地方可以運用圖示
4.2風格鮮明的圖示
4.3表意
4.4我們要做什麼樣的圖示
4.5實例
第5章界面質感
5.1擬物
5.2扁平
5.3質感
5.4小結
第6章錦上添花的UI動畫
6.1輔助建立完整的層級關係
6.2讓操作變得更有趣
6.3指示性的動效
6.4畫龍點睛
6.5平台區別
6.6小結
第7章切圖
7.1平台的不同特性
7.2尋找自己高效的切圖方法
7.3標註檔案
7.4小結
第8章開發與測試工程師們的建議和看法
8.1共同推動夢想的實現
8.2確保實現品質
8.3最終的取捨
第9章給設計點靈魂
9.1優雅的等待
9.2隱藏的情懷
第10章關於品牌的二三事
10.1無形的價值
10.2腳踏實地
10.3實踐出真知
10.4小結
他們眼中的設計師
第1章產品經理有話說
第2章設計在上開發在下
第3章運營眼中的UED
第4章一個市場人的自白
序言
編者序
形而上者謂之道，形而下者謂之器。匠者，器也。處身平凡的匠人不斷追求向上的設計之道。我們是搜狐普通的設計師，想和大家分享一些心得體會。謹以我們的流程和方法獻給有志投身用戶體驗設計的同學們。
入行多年，投身搜狐新聞團隊也已兩年有餘。與業界同儕相比，仍是新晉後輩。寫在書中的是一線設計團隊的集體經驗和設計師個人的些許感受。點滴匯集，與前輩、後來者分享。言語不盡，仍待來者指點。
《莊子 ·山木》篇講到：“弟子問於莊子曰：‘昨日山中之木以不材得終其天年，今主人之雁以不材死，先生將何處？’莊子笑曰：‘周將處乎材與不材之間。’”
作寓言讀，可以從多方面得到啟示。出於職業習慣，我從中悟出一點個人關於 UX設計的一些感受，可能就如莊周所言，處乎材與不材之間。
全書在編寫的過程中，我們的團隊始終僅有五人。書籍耗盡了團隊成員幾乎全部的業餘時間。過程中，我們經歷了人員變動，有過意見相左、有過彷徨悱惻。但最終對於設計的熱愛使我們堅持下來，使這本書得以面世。
感謝搜狐新聞客戶端負責人岳建雄。
感謝主編成員：顧盼，鄧敏，曹雨初，包巳硯，有他們才有這本書；感謝參與編輯的同學：李艷，馬寧，劉廷奇，陶宇；實習生：王麗婷，劉春強，王子倩，歐陽磊。感謝內容運營中心總監繆貝穎，市場部總監張璞，服務端產品經理孫小雷， iOS開發組長叢雲旦加入的文字讓成書更加豐滿。感謝知友“農民駱逸”，我們引用了您在知乎的文字對 “設計之下”進行了解讀。感謝搜狐新聞客戶端團隊所有的成員。
——設計師董翔鶴
前言
我們每天都在面對著生活和工作中的各種問題，千頭萬緒中如何做到事事有序。
用戶體驗設計是什麼？用戶體驗設計能做什麼？簡單地說，用戶體驗設計提供給人們一種適合的路徑，以便輕鬆、愉悅、高效地解決問題。
解決問題的方式
早些年，人多聚會吃飯的時候，一個很現實的問題出現了，有的菜太遠，夾不到，用餐者只能站起來去夾，讓筷子變得“更長”，這樣雖然解決了問題，但是方便了自己最終卻造成了整個飯局的混亂。於是為了更好地解決這個問題轉盤被安放到了桌子上。現在，我們再去餐館吃飯，就很少會再遇到這樣的問題了。
試想一下，如果我們把餐桌當成一個產品，那么使用餐桌吃飯的人就是這個產品的用戶，餐桌上的很多菜，就是產品的內容，設計餐桌的人就是用戶體驗設計師，讓吃飯的人能快捷、方便地夾到菜（獲得內容），桌子能轉動就是用戶體驗設計師設計的最好的解決問題的方式。
所以，在實際設計過程中，我們也要考慮到解決問題方式的多樣性，尤其是在設計產品界面流程操作的時候，多問幾個為什麼，多找幾個用戶來談談，才能知道到底採用哪種方式才是最流暢、最有效的。
引導用戶的路徑
用戶體驗絕不是一個頁面、一個 icon、一個動效，而是由這些基本元素構成的一個系統的流程，可以說是用戶的瀏覽路徑。
宜家的購物路線設計可以說是一種典型的用戶體驗設計。
從這種路線圖可以看出，只有一條主要路線，蜿蜒從入口到出口，貫穿“客廳”、“餐廳”等購物點，購物點之間有捷徑打通，在不影響主路徑的時候，有多種“捷徑”可走。傳統商場的購物點往往是散狀分布的，即便有很多路徑相連和功能劃分，仍然容易迷路。宜家通過導視標誌和牆壁的阻隔與劃分形成了上面這種蜿蜒而接近唯一的瀏覽路徑，這種設計方式巧妙地解決了顧客迷路的問題，並且保證顧客基本看到了其所提供的所有商品，從而最大限度地挖掘顧客的購買潛力。
在設計軟體時，也要考慮用戶的使用路徑。從用戶點擊圖示開始，他就進入了你的軟體“商場”。你需要做的就是用最簡單的方式引導，幫助他找到關注的內容和想使用的功能，快速地進行消費。
另外一個值得注意的細節是宜家的各個購物點不會只擺商品。你經常會看到各種“樣板間”，比如一款杯子可能出現在“餐廳”區，還會出現在“客廳”、“廚房”等地點，宜家將搭配好的套餐出售給顧客。
宜家的做法給予了我們靈感。讓商品之間產生聯繫，大部分消費者買了一隻水杯後，會感覺其搭配的餐墊也不錯，桌椅風格也相符，最後引導他買下整個餐廳的大部分裝飾。
這是一種典型的場景化設計。從產品的角度來解釋，樣板間在整個購物流程中起到了流量的再分發作用，並且將模組和功能之間相互打通，是整個購物流程中的關鍵節點。比如，搜狐新聞客戶端的訂閱中心、新浪微博的廣場，都是這種流量再分發在軟體上的體現。
為了化繁為簡
“如果所有人都忙於做所有的事，又有哪一個人能把每一件事做到完美。”
在 2012年 12月搜狐新聞進行了 3.3版本改版。我們對客戶端 UI和互動進行了簡化，閱讀產品內容是核心，一切視覺元素為閱讀服務，我們簡化了一切質感讓設計回歸到本原，內容即 UI。視覺上扁平不如讓內容層級和互動邏輯扁平，所以我們將原有 APP分散式的功能按鍵全部集中在了 ToolBar上，讓用戶更方便地進行單手操作（圖 0-1）。
隨著 iOS 7的發布，扁平化的視覺設計風格大行其道，與其讓 UI扁平，不如讓信息和內容扁平，設計的存在一定是為了更好地解決問題，用戶體驗設計提升了解決問題途中的精神感受。
對於用戶體驗設計可能每一個從業者心中的概念都不一樣，但大家最終的目的卻可能相同。本書以搜狐新聞客戶端為案例與前輩和同學們分享我們的工作流程和方法。言語不盡，仍待來者指點。
形而上者謂之道，形而下者謂之器。匠者，器也。處身平凡的匠人不斷追求向上的設計之道。我們是搜狐普通的設計師，想和大家分享一些心得體會。謹以我們的流程和方法獻給有志投身用戶體驗設計的同學們。
入行多年，投身搜狐新聞團隊也已兩年有餘。與業界同儕相比，仍是新晉後輩。寫在書中的是一線設計團隊的集體經驗和設計師個人的些許感受。點滴匯集，與前輩、後來者分享。言語不盡，仍待來者指點。
《莊子 ·山木》篇講到：“弟子問於莊子曰：‘昨日山中之木以不材得終其天年，今主人之雁以不材死，先生將何處？’莊子笑曰：‘周將處乎材與不材之間。’”
作寓言讀，可以從多方面得到啟示。出於職業習慣，我從中悟出一點個人關於 UX設計的一些感受，可能就如莊周所言，處乎材與不材之間。
全書在編寫的過程中，我們的團隊始終僅有五人。書籍耗盡了團隊成員幾乎全部的業餘時間。過程中，我們經歷了人員變動，有過意見相左、有過彷徨悱惻。但最終對於設計的熱愛使我們堅持下來，使這本書得以面世。
感謝搜狐新聞客戶端負責人岳建雄。
感謝主編成員：顧盼，鄧敏，曹雨初，包巳硯，有他們才有這本書；感謝參與編輯的同學：李艷，馬寧，劉廷奇，陶宇；實習生：王麗婷，劉春強，王子倩，歐陽磊。感謝內容運營中心總監繆貝穎，市場部總監張璞，服務端產品經理孫小雷， iOS開發組長叢雲旦加入的文字讓成書更加豐滿。感謝知友“農民駱逸”，我們引用了您在知乎的文字對 “設計之下”進行了解讀。感謝搜狐新聞客戶端團隊所有的成員。
——設計師董翔鶴
前言
我們每天都在面對著生活和工作中的各種問題，千頭萬緒中如何做到事事有序。
用戶體驗設計是什麼？用戶體驗設計能做什麼？簡單地說，用戶體驗設計提供給人們一種適合的路徑，以便輕鬆、愉悅、高效地解決問題。
解決問題的方式
早些年，人多聚會吃飯的時候，一個很現實的問題出現了，有的菜太遠，夾不到，用餐者只能站起來去夾，讓筷子變得“更長”，這樣雖然解決了問題，但是方便了自己最終卻造成了整個飯局的混亂。於是為了更好地解決這個問題轉盤被安放到了桌子上。現在，我們再去餐館吃飯，就很少會再遇到這樣的問題了。
試想一下，如果我們把餐桌當成一個產品，那么使用餐桌吃飯的人就是這個產品的用戶，餐桌上的很多菜，就是產品的內容，設計餐桌的人就是用戶體驗設計師，讓吃飯的人能快捷、方便地夾到菜（獲得內容），桌子能轉動就是用戶體驗設計師設計的最好的解決問題的方式。
所以，在實際設計過程中，我們也要考慮到解決問題方式的多樣性，尤其是在設計產品界面流程操作的時候，多問幾個為什麼，多找幾個用戶來談談，才能知道到底採用哪種方式才是最流暢、最有效的。
引導用戶的路徑
用戶體驗絕不是一個頁面、一個 icon、一個動效，而是由這些基本元素構成的一個系統的流程，可以說是用戶的瀏覽路徑。
宜家的購物路線設計可以說是一種典型的用戶體驗設計。
從這種路線圖可以看出，只有一條主要路線，蜿蜒從入口到出口，貫穿“客廳”、“餐廳”等購物點，購物點之間有捷徑打通，在不影響主路徑的時候，有多種“捷徑”可走。傳統商場的購物點往往是散狀分布的，即便有很多路徑相連和功能劃分，仍然容易迷路。宜家通過導視標誌和牆壁的阻隔與劃分形成了上面這種蜿蜒而接近唯一的瀏覽路徑，這種設計方式巧妙地解決了顧客迷路的問題，並且保證顧客基本看到了其所提供的所有商品，從而最大限度地挖掘顧客的購買潛力。
在設計軟體時，也要考慮用戶的使用路徑。從用戶點擊圖示開始，他就進入了你的軟體“商場”。你需要做的就是用最簡單的方式引導，幫助他找到關注的內容和想使用的功能，快速地進行消費。
另外一個值得注意的細節是宜家的各個購物點不會只擺商品。你經常會看到各種“樣板間”，比如一款杯子可能出現在“餐廳”區，還會出現在“客廳”、“廚房”等地點，宜家將搭配好的套餐出售給顧客。
宜家的做法給予了我們靈感。讓商品之間產生聯繫，大部分消費者買了一隻水杯後，會感覺其搭配的餐墊也不錯，桌椅風格也相符，最後引導他買下整個餐廳的大部分裝飾。
這是一種典型的場景化設計。從產品的角度來解釋，樣板間在整個購物流程中起到了流量的再分發作用，並且將模組和功能之間相互打通，是整個購物流程中的關鍵節點。比如，搜狐新聞客戶端的訂閱中心、新浪微博的廣場，都是這種流量再分發在軟體上的體現。
為了化繁為簡
“如果所有人都忙於做所有的事，又有哪一個人能把每一件事做到完美。”
在 2012年 12月搜狐新聞進行了 3.3版本改版。我們對客戶端 UI和互動進行了簡化，閱讀產品內容是核心，一切視覺元素為閱讀服務，我們簡化了一切質感讓設計回歸到本原，內容即 UI。視覺上扁平不如讓內容層級和互動邏輯扁平，所以我們將原有 APP分散式的功能按鍵全部集中在了 ToolBar上，讓用戶更方便地進行單手操作（圖 0-1）。
隨著 iOS 7的發布，扁平化的視覺設計風格大行其道，與其讓 UI扁平，不如讓信息和內容扁平，設計的存在一定是為了更好地解決問題，用戶體驗設計提升了解決問題途中的精神感受。
對於用戶體驗設計可能每一個從業者心中的概念都不一樣，但大家最終的目的卻可能相同。本書以搜狐新聞客戶端為案例與前輩和同學們分享我們的工作流程和方法。言語不盡，仍待來者指點。
