一個人的產品:寫給非設計師的設計書

一個人的產品:寫給非設計師的設計書

《一個人的產品:寫給非設計師的設計書》 一書原作者Erik Klimczak(艾瑞克·克里姆扎克),中文版由張卷益譯,電子工業出版社2016年11月出版

內容提要

在用戶體驗被提升到決定產品生死高度的時代,非設計人員最好也懂點設計知識。《一個人的產品:寫給非設計師的設計書》講述從產品創意直至產品原型整個過程中所涉及的設計方面的理論和方法,本著實用、有效、通用的原則,為缺乏設計背景的人" 補課”,教他們如何攻克軟體設計中的各種難關。一旦掌握了這些設計知識,你的工作內容就能極大地拓展,因為它們對於任何工作和職位都是有幫助的,無論是設計師、開發者、產品經理,甚至CEO。有了這些設計知識,你甚至能憑一己之力完成產品的開發。

對於初入行的設計師、產品經理、與產品設計相關的人員,對產品設計感興趣的開發者等,《一個人的產品:寫給非設計師的設計書》都適合閱讀。

目錄

第一部分 規劃1

第1章研究3

什麼是用戶研究4

用戶研究不等於可用性5

設計術語:人種志5

從用戶的角度開始6

案例研究:快速結賬10

讓發現更有意義15

總結18

第2章靈感19

像藝術家一樣偷師學藝20

如果以上方法都行不通……33

總結36

第二部分 設計思維37

第3章繪製草圖39

設計思維——開發者式的設計40

繪製草圖——一切設計由此開始40

草圖的優點41

何時繪圖42

繪製草圖的工具42

套用流的基礎48

創建一個套用流50

故事板的作用58

何時使用故事板60

創建故事板60

不知道從何處入手?從模板開始吧61

總結63

第4章信息架構65

究竟什麼是信息架構67

可用性的成本68

信息架構設計的交付物69

角色、用戶場景和故事板69

內容模型70

套用流70

線框圖71

手勢庫72

信息架構的一切都與內容相關73

讓一切更有意義73

信息架構設計的五個步驟75

步驟1 :定義主題、目標和需求76

步驟2 :選擇一種版式77

步驟3 :為相似項目分組89

步驟4 :保持一致90

步驟5 :精簡91

總結93

第5章線框圖95

了解線框圖96

線框圖101 97

應該在什麼時候創建線框圖98

解析線框圖98

你是在說線框圖嗎100

注意事項103

好用的線框圖工具107

線框圖技巧113

線框圖技巧#1 :創建基本的線框圖114

線框圖技巧#2 :採用灰度圖和一種顏色115

線框圖技巧#3 :採用逐幀表達法118

線框圖技巧#4 :使用氣泡118

線框圖技巧#5 :放大細節119

總結120

第6章原型設計121

什麼時候需要原型122

交流新想法123

驗證概念123

進行基本可用性測試123

決定創意是否值得投資123

什麼是有效的原型124

用聰明的方法進行偽造127

“小賭”一把127

好用的原型設計工具128

微軟的SketchFlow 128

Adobe Edge 130

Adobe After Effects 131

Keynote 與PowerPoint 132

HTML /JavaScript/ CSS3 133

Axure RP 134

Arduino、Openframeworks 與Processing 135

原型設計方法136

方法#1 :紙面原型136

方法#2 :互動式線框圖137

方法#3 :視頻設計原型142

總結147

第三部分 視覺設計149

第7章顏色151

顏色的基本理論152

顏色的相關術語152

顏色模型154

冷暖色159

顏色心理學160

對比度164

套用顏色:一些經驗法則166

只使用兩到三種顏色166

以純色開始,然後轉為漸變色167

使用暗色的色調167

綠色意味著可行168

如何創作一個好調色板168

灰度圖169

五種調色板,你不能用錯171

顏色的技巧174

顏色技巧#1 :用照片生成一個調色板174

顏色技巧#2 :利用代碼生成顏色177

顏色技巧#3 :使用Photoshop 179

我私藏的顏色技巧:使用算法來找到平均顏色182

總結184

第8章數位化排版設計185

重中之重186

字型排版基礎知識187

理解樣式術語187

字型和字型有什麼不同192

字型的分類193

襯線字型193

無襯線字型195

8種方法改善你的字型198

1. 選擇了一種字型比例後就堅持用下去198

2. 使用一致的間距199

3. 一致的行寬200

4. 稍做變換就能分出視覺層次201

5. 選擇合適的正文字型202

6. 使用一個字型族群205

7. 組合使用兩到三種字型205

8. 使用好看的“&”符號210

總結211

第9章視覺傳達213

沒那么簡單214

1. 就像在為自己而設計215

2. 保持一致215

五種方式闡明你的設計216

1. 使用一個適合的格線216

2. 建立層次224

3. 刪除無用的東西228

4. 檢查並行性234

5. 建立清晰的功能可見性236

總結241

第10章動作243

動畫看起來很酷,但是它們真的能讓套用更好嗎244

過渡、動畫和時機原則245

動畫和過渡之間有什麼區別245

不要太快,不要太慢,也不要太多246

什麼時候需要使用動作247

什麼時候應該避免動作247

漸隱、滑動和縮放——動畫的超級工具248

漸隱249

滑動249

縮放250

動作的原則251

慢進和慢出251

擠壓和伸展252

預期253

跟隨和重疊254

弧線255

緩動函式256

高級運動技術259

跟隨260

認知錯覺260

總結261

第四部分 互動設計263

第11章互動設計的原則265

互動設計的介紹266

沉入心流267

促進心流的方法268

易學性vs. 易用性275

可用性設計275

易學性設計277

人體工程學278

肌肉疲勞279

視野和周邊視覺281

環境和光照條件282

最優的觸摸目標283

遮擋285

總結287

第12章設計模式289

為什麼使用設計模式290

其他設計模式資源291

模式294

自動對焦294

拖放295

自動保存296

空白狀態297

進度指示器298

選用合適的目標尺寸299

按鈕就是按鈕300

如非必要,避免使用模態聲明301

直接操作302

為相似項目分組303

連續滾動304

根據重要性調整元素的尺寸305

全景儀錶盤306

防錯控制項307

退出方式308

居左/ 右對齊309

超級搜尋310

簡單任務用簡單UI,複雜任務用複雜UI 311

同步位置312

利用字型反差313

總結314

相關詞條

熱門詞條

聯絡我們