第 1章 初識用戶體驗設(shè)計 013 1.1何為用戶體驗 014 1.1.1 生活中的用戶體驗 014 1.1.2 互聯(lián)網(wǎng)產(chǎn)品中的用戶體驗 015 1.2 用戶體驗設(shè)計與平面設(shè)計的區(qū)別 018 1.2.1 內(nèi)容響應(yīng)式 019 1.2.2 長時間停留 020 1.2.3 閱讀效率 020 1.2.4 層級多樣化 021 1.3 用戶體驗只是主觀感受 021 1.4 用戶體驗設(shè)計師的職責(zé)與價值 023 第 2章 App 設(shè)計中的基礎(chǔ)規(guī)范 025 2.1 App 基礎(chǔ)布局規(guī)范 026 2.1.1 常見的手機屏幕尺寸 026 2.1.2 界面設(shè)計中的柵格系統(tǒng) 036 2.1.3 常見的布局和適用場景 039 2.2 App 基礎(chǔ)組件規(guī)范 043 2.2.1 狀態(tài)欄 044 2.2.2 導(dǎo)航欄 044 2.2.3 標簽欄 044 2.2.4 工具欄 045 2.3 App 字體規(guī)范 046 2.3.1 系統(tǒng)默認字體介紹 046 2.3.2 基本的字號規(guī)范 047 第3章 視覺體驗基礎(chǔ) 049 3.1 用戶界面設(shè)計中的色彩 050 3.1.1 對色彩的基本認識 050 3.1.2 色彩在界面設(shè)計中的作用 052 3.1.3 色彩的對比 054 3.1.4 色彩的性格 059 3.1.5 色彩的重量 062 3.1.6 不同色彩的應(yīng)用場景 063 3.2 用戶界面設(shè)計中的版式 065 3.2.1 統(tǒng)一與變化 066 3.2.2 對比與調(diào)和 068 3.2.3 對稱與平衡 069 3.2.4 節(jié)奏與韻律 070 3.2.5 親密性原則 071 3.2.6 相似性原則 073 3.2.7 卡片 / 分界線 / 無框 074 3.2.8 留白 076 3.3 用戶界面設(shè)計中的圖標 077 3.3.1 App 圖標 078 3.3.2 App 功能圖標 081 3.3.3 常用的圖標庫 087 3.4 用戶界面設(shè)計中的字體 087 3.4.1 襯線體與無襯線體 088 3.4.2 字體性格的形成 089 3.5 用戶界面設(shè)計中的細節(jié)規(guī)律 092 3.5.1 圓角與尖角的使用規(guī)律 092 3.5.2 箭頭的使用規(guī)律 094 3.5.3 投影的使用規(guī)律 098 3.5.4 分界線的使用規(guī)律 099 3.5.5 對齊方式的使用規(guī)律 100 第4章 視覺體驗進階 103 4.1 設(shè)計中的感性與理性 104 4.2 引導(dǎo)頁的設(shè)計 105 4.2.1 引導(dǎo)頁的制作形式 105 4.2.2 引導(dǎo)頁的設(shè)計規(guī)律 107 4.3 空狀態(tài)的設(shè)計 109 4.3.1 空狀態(tài)的分類 110 4.3.2 空狀態(tài)的設(shè)計技巧與注意事項 112 4.4 Banner 的設(shè)計 113 4.4.1 組成 Banner 的五要素 114 4.4.2 Banner 的組成形式 115 4.4.3 Banner 的風(fēng)格分類 116 4.4.4 Banner 的設(shè)計技巧及注意事項 119 4.5 啟動頁的設(shè)計 125 4.5.1 啟動頁的設(shè)計形式 126 4.5.2 啟動頁的設(shè)計技巧及注意事項 129 4.6 界面設(shè)計中的層次感表現(xiàn) 130 4.6.1 文字的層級區(qū)分 130 4.6.2 元素的復(fù)雜程度 133 4.6.3 間距的合理性 135 4.6.4 學(xué)會信息歸類 138 4.6.5 色彩的合理把控 140 4.7 界面設(shè)計中的選圖規(guī)律 142 4.7.1 圖片的比例選擇 143 4.7.2 選圖的統(tǒng)一性 145 4.7.3 選圖的清晰度 147 4.7.4 圖片與主題的貼合性 148 4.8 界面設(shè)計的風(fēng)格體現(xiàn) 149 4.8.1 如何確定產(chǎn)品風(fēng)格 149 4.8.2 影響產(chǎn)品風(fēng)格的元素 162 第5章 交互體驗基礎(chǔ) 167 5.1 產(chǎn)品思維 168 5.1.1 初識產(chǎn)品線 168 5.1.2 用戶調(diào)研的方法 169 5.1.3 用戶畫像 170 5.1.4 需求分析 170 5.1.5 競品分析 171 5.1.6 可用性測試 171 5.1.7 低保真原型圖 172 5.1.8 5W1H 產(chǎn)品分析法 172 5.2 交互動效規(guī)律 174 5.2.1 動效設(shè)計的意義 174 5.2.2 動效設(shè)計的原則 177 5.2.3 微交互設(shè)計 182 第6章 交互體驗進階 187 6.1 交互體驗的可用性 188 6.1.1 為用戶決策提供充足的信息 188 6.1.2 操作均給予明確的反饋 189 6.1.3 容錯原則 192 6.1.4 交互方式的一致性 196 6.1.5 讓用戶知道當前所處的位置 199 6.2 交互體驗的易用性 200 6.2.1 減少用戶的操作步驟 200 6.2.2 降低用戶的學(xué)習(xí)成本 205 6.2.3 減輕用戶的記憶負擔(dān) 207 6.2.4 一個結(jié)果可有多種交互 209 6.2.5 產(chǎn)品符合人體工程學(xué) 212 6.2.6 輸入表單時給予提示 214 6.3 交互體驗的好用性 215 6.3.1 讓用戶做選擇題而不是填空題 216 6.3.2 預(yù)知用戶的下一步操作 218 6.3.3 交互次數(shù)與界面信息量的關(guān)系 219 6.3.4 圖形比文字更易讀 221 6.3.5 基于用戶使用場景 223 第7章 情感化體驗 227 7.1 情感化體驗的安全感 228 7.1.1 符合用戶的心理預(yù)期 228 7.1.2 不可或缺的提示框 230 7.1.3 安全感需要主動傳達 231 7.2 情感化體驗的友好感 235 7.2.1 拒絕與“冰冷”的機器交流 235 7.2.2 營造熱點氣氛 236 7.2.3 無障礙設(shè)計 238 7.2.4 讓用戶的意見有處發(fā)表 238 7.3 情感化體驗的滿足感 240 7.3.1 營造用戶差異 240 7.3.2 讓“免費”有點難度 242 7.3.3 每一個用戶都是特殊的 243 7.3.4 超越用戶的期望值 245 第8章 自我提升 247 8.1 “瓶頸期”該如何突破 248 8.1.1 審美期 248 8.1.2 洞察期 251 8.1.3 技法期 255 8.1.4 思想期 257 8.2 設(shè)計師的氣質(zhì)養(yǎng)成 259 8.2.1 少即是多 259 8.2.2 點到為止 261 8.2.3 設(shè)計，我說了算 263