網頁設計師的告白：隱藏在網頁間的設計心

推薦序–好的設計來自生活

大道藏於生活，好的設計和靈感也一樣

　　設計人能有「設計之心」，工作和生活中才會發現更多的改進想法。千鳥一直這樣走過來。八年累積，三年原創；一年整理，半年總結。透過這本書，我相信大家和我一樣會被千鳥這種以設計為生活的態度、這份堅持而觸動。

這是一本可以讓思維輕鬆起來的書

　　千鳥基於三年原創記錄檔的基礎上整理過來，行文直接且案例鮮活。有很多唬人或生澀的UCD 理論，千鳥在每個工作階段對之都有一定的實戰解讀。裡面也有很多我個人更喜歡的類似「電梯按鈕」這樣一些生活案例的分享。

　　所以，這不是一本教案工具書。最適合午後咖啡廳放鬆靜讀，或臨睡前偶爾翻閱。關於千鳥書中提到設計者「知行合一」的實作觀點，我亦最近在內部的交流中時有說起。

好的設計先要解決自己的問題

　　藝術中有句很通俗的話，好的作品先要感動自己。商業設計要追求產出和效率，所以好設計是要解決問題的。首先要解決自己的問題。一個網管，為了應付來上網的人經常詢問網址，做了一個簡單的常用網站目錄——這就是後來的網址導覽站「hao123.com」；一個工程師，為了方便自己給朋友共用視訊，做了一個視訊交換網站——這就是後來的「youtube.com」⋯⋯這樣的事例或傳言背後，是告訴我們核心設計者一定要使用和了解自己的產品。所以，如果你自己根本不用或者根本不熱愛自己所做的產品，那麼你想做出好產品來，除了燒香拜佛別無它法！

好的設計規劃先聚焦解決「一個」問題

　　每一個行業到一定階段，都會形成相對系統的理論和方法。如果你一知半解，千萬別盲目迷信及濫用。例如曾經很熱的「使用者角色卡片設計」這個方法。有些產品策劃或設計師，在需求及功能設計階段，很投入的開展角色設計，開展行業分析，而後整理出數篇的功能列表和項目組進行數周的討論，看似專業和熱鬧，但最後的結果無外是專案不斷延期發佈或專案後期功能就資源和進度不斷的砍掉，還有更悲觀的結果是，專案組付出100 分的加班加點的努力，基本規劃的都實現出來了，但每一個應用功能使用者評價都只有50 分⋯⋯前期的規劃設計經過腦力激盪等一系列分析後，完成下來的「點」應該是一個一個做加法，而不是做減法。先找準一個需求切進去，徹底解決它。

還有別忘了，網際網路產品永遠都是Beta 版，改進產品的方法就是快速發佈和持續營運。

最後再說說做設計這份工作

　　做設計的有兩種人，第一種人做的是體力活，第二種人做的是生活。這裡想說的事暫與作品水準高低無關，關鍵每一個設計人要懂得享受和熱愛自己的工作。網事如風，知行合一，每一個設計人都應該有一顆「設計之心」。

推薦序–好的設計來自生活

大道藏於生活，好的設計和靈感也一樣

　　設計人能有「設計之心」，工作和生活中才會發現更多的改進想法。千鳥一直這樣走過來。八年累積，三年原創；一年整理，半年總結。透過這本書，我相信大家和我一樣會被千鳥這種以設計為生活的態度、這份堅持而觸動。

這是一本可以讓思維輕鬆起來的書

　　千鳥基於三年原創記錄檔的基礎上整理過來，行文直接且案例鮮活。有很多唬人或生澀的UCD 理論，千鳥在每個工作階段對之都有一定的實戰解讀。裡面也有很多我個人更喜歡的類似「電梯按鈕」這樣一些生活案例的分享。

...

第1 章 網際網路產品
1.1 從網頁設計開始
1.2 與使用者體驗的這兩年
1.3 設計興國
1.4 立足於傳統企業設計
1.5 設計的技術水準
1.6 自己設計自己用
1.7 網際網路設計操作參考v1
1.8 網際網路設計操作參考v2
1.9 軟體與網站產品的區別
1.10 軟體與網站設計的區別
1.11 做設計還是做產品
1.12 由建築設計想到的

第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 簡潔有語義的頁面位址
4-6 透過研究視線軌跡改良設計
4-7 結構和互動的關係
4-8 網址導覽的組織方法
4-9 網站背後的資訊架構
4-10 Tag 的關係和呈現
4-11 Tag 的建立和組織
4-12 內容、標籤和分類
4-13 使用標籤是遲早的事
4-14 使用者不需要資訊速食

第5 章 設計團隊和溝通
5-1 Yahoo! 的專案工作流程
5-2 把使用者體驗整合進流程
5-3 資訊架構的流程引入
5-4 把經驗理論變成現實
5-5 網際網路設計瀑布遞推
5-6 網際網路設計敏捷反覆運算
5-7 模擬高效團隊
5-8 縱深協作方式
5-9 做好自己的事
5-10 策劃和執行
5-11 產品經理的責任
5-12 傳達並推動
5-13 使用者體驗的誤解
5-14 對設計和技術的誤解
5-15 設計頁面結構原型
5-16 產品原型文件構想
5-17 用文件來推動產品
5-18 文件體系
5-19 兩類線框圖的比較
5-20 產品規範之道
5-21 發表物不是越多越好

第6 章 用戶端技術
6-1 重構概念解析
6-2 正確認識html 與body
6-3 三維角度設計頁面設定
6-4 中英文、數位混合效果
6-5 CSS 樣式書寫風格
6-6 再談CSS 樣式表書寫風格
6-7 加速圖片顯示
6-8 照片預先載入過渡
6-9 照片陰影效果
6-10 互動技術的理性選擇
6-11 Flash 在Web 用戶端的潛在問題

第7 章 搜尋引擎友善
7-1 關於SEO 的一些探討
7-2 SEO 和UCD 的關係
7-3 SEO 意識和SEO 技術
7-4 SEO 與UCD 相關問答
7-5 語義化提昇頁面品質
7-6 強化網站內容品質
7-7 中英網站的PR 差距

第8 章 案例和方案
8-1 Yahoo! 奇摩改版追蹤
8-2 探討Live Messenger 分組
8-3 百度和搜狗地圖
8-4 有感豆瓣的改版
8-5 Flickr 的圖片保護方案
8-6 書籤效果的最佳化
8-7 有時間先後的翻頁
8-8 密碼強度檢測機制
8-9 Yahoo! 韓國設計探討
8-10 改進評論傳送表單
8-11 簡化翻頁提升可用性
8-12 徵才網站怎麼做

第9 章 知識累積和職業生涯
9-1 如何了解觀念
9-2 寫作態度問題
9-3 我們都需要個人網站
9-4 網站和部落格的區別
9-5 部落格內容組織策略
9-6 原創和轉載
9-7 原創來自追求
9-8 網際網路產品設計閱讀推薦
9-9 網際網路產品設計師自我介紹
9-10 網際網路產品設計師職業生涯
9-11 三年記，個人部落格為有效溝通
9-12 三年記，個人網站為有效累積
9-13 公司都是有傳統的
9-14 體制內的工作經驗
9-15 Web 設計師的出路問題

第10 章 生活中的遭遇
10.1 聊天的使用者感受
10.2 初次溝通的四種情景分析
10.3 查詢密碼與交易密碼
10.4 招行的積分政策
10.5 iPod nano 二代的色彩策略
10.6 從輕薄了解使用者需求
10.7 Click Wheel 及其前身
10.8 選滑鼠真難
10.9 電梯樓層按鈕排序
10.10 樓層數橫排比豎排好
10.11 日式酒店電梯面板
10.12 禁止危險品上車
10.13 請靠右站立
10.14 腦部發育好
10.15 請給需要幫助的乘客讓個座
10.16 地鐵開關門的安全順序
10.17 防盜門和防盜密碼

第1 章 網際網路產品
1.1 從網頁設計開始
1.2 與使用者體驗的這兩年
1.3 設計興國
1.4 立足於傳統企業設計
1.5 設計的技術水準
1.6 自己設計自己用
1.7 網際網路設計操作參考v1
1.8 網際網路設計操作參考v2
1.9 軟體與網站產品的區別
1.10 軟體與網站設計的區別
1.11 做設計還是做產品
1.12 由建築設計想到的

第2 章 少即是多
2.1 網頁不需要漂亮
2.2 簡單就是力量
2.3 資訊之美
2.4 內容呈現的減法
2.5 經驗也講究拒絕

第3 章 以使用者為中心
3.1 心智模型的差異
3.2 使用者喜歡點什麼...