一.設計流程：
1.設計研究 2.人物模型 3.定義需求 4.框架和細化
設計過程：
1. 產品開發三原則：可行性、功用性、稱許性
2.為什么有的產品不好用：工作重點錯誤、不了解用戶、工作流程缺失
3.好產品的基礎：目標、心理模型
4.目標導向設計過程：研究、建模、定義需求、定義框架、提煉、開發支持
二.人物模型：
1.模型：用戶的期望、用戶與其他用戶的關系、用戶與社會、物理的關系、用戶與產品的關系視覺化。
2.步驟：
根據角色對訪談對象分組、找出行為變量、將訪談主題與行為變量對應起來、找出重要的行為模式、綜合各種特征、闡明目標、檢查完整性和冗余、指定人物模型和類型、進一步描述特征和行為
三.定義用戶需求：
1.三類場景：情景場景（定義需求）、關鍵路徑場景（設計細化）、驗證場景（測試設計）
2.步驟：
創建問題／表述愿景、探索場景、確定人物模型期望、構建情景場景（人＋活動＋故事）、明確設計需求
四.設計框架和細化
1.創建設計框架：
?創建交互框架
1）定義產品平臺（網頁、app）、姿態（用戶投入精力：獨占姿態、暫時姿態）、輸入方法（用戶與產品交互方式：語音］觸摸屏。。。）
2）定義功能性、數據元素
3）確定功能組、層級
4）勾畫交互框架
5）構建關鍵路徑場景劇本
6）運用驗證場景完善設計
替代（關鍵路徑某個點的替代，分叉點）、必須使用（不經常、一定使用，需要設計地簡單易懂（如：產品升級））
創建視覺框架
2.細化外觀和行為
3.驗證與測試設計
五.設計流程
1.產品要體貼聰明（人本能：與周圍有意識的生物進行交流）
1）提供相關的信息：與用戶需求有關的信息（搜索燒烤店未果，推薦其他的燒烤店）
2）不要把危險的按鈕與普通的按鈕放在一起（清空按鈕）
3）產品不因為本身的問題加重用戶的負擔
4）及時通知用戶
5）不問過多的問題（會使用戶產生被脅迫感）
6）即使失敗也不失風度（表格提交失敗，需保留部門內容。找回密碼，軟件自動填寫帳號）
7）知道什么時候調整規則
8）承擔責任（及時終止打印過程）
9）幫助用戶避免低級錯誤（轉發文章給好友，彈框突出發送好用姓名，確定是否發送正確）
10）利用計算機空閑時間
11）預測用戶需求（根據用戶操作歷史（上一次操作））
總結：一個真正關心別人的心是如何與其他人打交道的
2.產品姿態：產品的視覺樣式和行為反映產品的使用方式
1）分類：獨占姿態、暫時姿態
獨占姿態：長時間占據用戶注意力
a）鎖定中級用戶
b）使用保守的視覺風格，緊湊布局
暫時姿態：短暫占據注意力
a）細致清晰顯眼地顯示控件
b）記住用戶的選擇
2）網站類姿態：信息類、事務類、應用類
信息類網站：需要平衡「有用信息的顯示密度」和「便于新手用戶搜索」，需要在獨占姿態與暫時姿態中找到平衡，需借助人物模型和行為模式找到平衡。
事務類網站：
應用類網站：
3）移動設備姿態
3.為中間用戶優化設計
//使用頻率低的功能安排地層級深一些
1）新手用戶：想象成聰明且忙碌的人
a）符合用戶心理模型、幫助提示及時消失、功能易發現
2）專家用戶：探索深奧功能
3）中間用戶（不需要提示）
總結：為中間用戶優化設計，幫助新手快速上手，為專家用戶提供探索空間。
4.保持用戶流的狀態（避免破壞用戶的專注度）
流：溫和的快感、感覺不到時間流逝、高效、愉悅感、與產品的交互變得透明、讓用戶直接面對自己的目標、感受不到產品工具的介入。
1）遵循用戶的心理模型：紅色警戒色
2）少就是多：使用最少的元素實現功能
3）讓用戶指示而不是討論
4）慎用對話框：會打斷用戶進程，讓用戶產生被質問的感覺
5）讓必要的工具近在咫尺（導航欄固定、重要按鈕放在單手操作范圍內）
6）提供非模態反饋（清晰地顯示操作的狀態和結果很重要）
模態反饋：需要用戶操作才能返回正常的流程（對話框、彈框）
非模態反饋：不打擾用戶的主線進程，不打擾正常的活動流。（選擇后的視覺顯示告訴用戶可以進行下一步操作了）（關閉時確認保存彈窗）
7）可能性不等同于概率（簡書自動更新編寫的文章而不是詢問是否保存）
8）可視化顯示數據：圖形更直觀
9）反映對象或者產品的狀態（按鈕）
10）避免不必要的報告，除非了解運轉情況讓用戶受益。（默默攔截廣告，不需要通知用戶）
11）為用戶提供模板或者示例
12）區別命令和設置（默認）
13）確定危險按鈕
14）為響應優化，但容許延遲：（0.1響應及時，1s有響應，10s走神可拉回，10s+注意力不在）
15）適度的動效
響應式、沉浸式的；幫助用戶創造心理模型，上下頁面建立邏輯關系；給用戶屏幕外都有內容的感覺，彌補移動端屏幕小，內容顯示少的缺點。讓用戶的注意力注意集中在合適的地方；展示對象與用戶操作之間的關系；
過渡動效會影響效率，讓用戶感到反感
5.消除負擔
類型：導航、模態、視覺負擔
1）導航：標簽頁面的跳轉，嚴重打斷用戶的注意力，中斷用戶的工作流。在當前頁面進行跳轉的越來越多。
信息導航：滾動、跳轉、縮放
無盡模式讓用戶更沉浸
2）模態負擔
3）視覺負擔，過度使用界面元素，過度的擬物化
4）如何消除負擔：
a）減少要去地方的數量
b）提供導航標志：使用持久對象作為導航標志，增強用戶的定位能力；產品使用共同的視覺樣式，保證視覺的連貫性，適當的不同可以避免用戶混亂，幫助用戶定位。
c）提供概覽：網頁由層級結構轉向關聯結構，層級變淺，面包屑廢用；滾動條：便于用戶定位
d）恰當地把控件映射到功能上：排序按照升降序還是最近最早
e）避免層級關系：
f）不要復制真是物理世界的模型（日歷的排版）
g）審視用戶與產品交互的過程：認知、記憶、視覺工作、肢體
6.設計習慣用法形式的界面
界面形式：以實現為中心、隱喻、習慣用法
習慣用法：文字、形狀（能供性：形狀與操作的統一（需要提示與反饋））
7.優化數據輸入、存儲、檢索：
1）輸入：減少必填項、提供防錯機制（相關下拉選項）、程序自動糾錯、為用戶提供非模態提示。
8.運用反饋、撤銷、預覽等防止錯誤
1）反饋：視覺反饋（富視覺非模態反饋、警告授權用模態反饋）、聽覺反饋（負面、正面（暗示錯誤、暗示成功、引導操作））、觸覺反饋
2）撤銷：心理模型（不相信自己犯錯、讓用戶敢于嘗試）
3）對比和預覽：（例：濾鏡），特別適合圖片處理軟件
9.為不同的需求而設計：易學性和幫助、可定制性、本地化和全球化、無障礙性。
1）易學性：
有效功能工作集：最少有效工作集+每個用戶的個人偏好=有效功能工作集
2）上下文幫助和輔助界面：
a）導覽和覆蓋層教程（引導頁、半透明遮罩的文字教程，最多不多于5-7屏）
b）模板：為用戶提供模板
c）占位符和空白提示（404，搜索提示）
d）安裝向導
e）工具提示（hover文本）和覆蓋性工具提示
f）在線幫助
3）可定制性：個性化、配置、特質模態行為
4）無障礙性：
//F型閱讀順序，
10.視覺設計原則
1）視覺界面設計原則：
a）傳達風格/傳播品牌
騰訊云：穩定（提供穩定的云服務）、快速（提供快速訪問）、安全（安全可靠地儲存每個用戶數據）
b）帶領用戶理清視覺層次
c）保持清晰的視覺結構和流
d）在特定屏幕上告訴用戶能做什么
e）響應命令
f）把注意力吸引到重要事件上
g）最小化視覺工作量：減少元素
h）保持簡單：減少元素
2）視覺信息設計原則：
a）加強視覺對比：折線圖的顏色
b）顯示因果關系：非模態
c）顯示多個變量
d）在一個界面整合文本、圖形和數據
e）確保內容的質量、相關性和完整性
f）在相鄰空間上顯示事物，而不是按照時間堆積
g）可量化的數據就要量化
3）一致性和標準化：易學性、易用性，降低了用戶培訓和基礎支持的費用，減少設計師的工作量。
11.移動端交互設計
對于需要旋轉畫面的app最好是用圖標控件
1）瀏覽控件：垂直列表、水平列表、網格
a）水平列表：屏幕邊緣顯示部分遮擋的內容卡片、頁面控制器
2）標簽欄：底部更多icon、水平輪顯（可以左右滑動的暗示）、下拉標簽欄
3）導航欄（navbar）
4）工作區域（濾鏡區）
5）抽屜：安卓里擔任主導航業務的控件，適合最重要的內容只有一類的APP；次要對象放在右側；工具（微博發布，path發布）；條目級（右滑）；
6）點擊顯示和其他直接操作：視頻軟件
7）搜索：預加載、最近/頻繁搜索建議、搜索發現、語音搜索、自動填充，減少用戶輸入工作、推薦關鍵詞
? // 輸入不是app擅長的，但搜索是不可避免的。
8）篩選、排序：允許用戶重置
9）歡迎和幫助頁面
10）多點觸摸手勢
12.網頁端交互設計
1）導航：一級導航（簡潔有力）
左側導航的弊端：因為人的閱讀習慣是F型，閱讀右邊主要內容的時候會時不時的掃到左邊導航，影響閱讀。（可做收斂）
2）搜索：自動填充與推薦；屬性檢索；分類推薦
3）滾動
4）頁眉和頁腳
5）分頁/無線滾動：快速到達底部或者頁面滾動中的某個位置就選擇分頁
6）移動網頁：自適應/單獨網頁版設計（微博）
13.設計細節：
1）控件：命令、選擇、輸入、顯示控件
a）命令控件：按鈕（操作動作）、圖標按鈕、超鏈接（內容導航）
b）選擇控件：復選框、開關按鈕、狀態切換按鈕。選擇空間不直接觸發動作，動作是通過命令控件來觸發的。
c）列表控件：文字過長不要使用水平滾動，而是選擇換行或者省略的方式。
d）輸入控件：無界輸入控件、有界輸入控件（限制用戶輸入值大小和性質的控件，可以避免用戶輸入無效的值。微調器（購買數量）、刻度盤和滑塊（進度條））
e）顯示控件：滾動條、文檔導航器（小縮略圖）、分割線（可移動的分割線應該借助光標暗示其受范性）、對話框（屬性、功能、進度、通知、公告）
