交互設(shè)計(jì)師的主要任務(wù)
通過(guò)分析用戶心理模型，設(shè)計(jì)任務(wù)流程，把交互邏輯也就是功能和需求普办，以用戶能理解的方式傳達(dá)給yoghurt，最終實(shí)現(xiàn)公司需求和用戶需求的最佳平衡徘钥。
交互設(shè)計(jì)師的價(jià)值
首先衔蹲，設(shè)計(jì)成果會(huì)直接帶來(lái)用戶價(jià)值--用戶直接感受到優(yōu)秀設(shè)計(jì)產(chǎn)品帶來(lái)的美觀和便捷，以及商業(yè)價(jià)值--得到用戶喜愛(ài)的產(chǎn)品必然給公司帶來(lái)利潤(rùn)呈础。此外舆驶，交互設(shè)計(jì)師在項(xiàng)目推進(jìn)中也起到了重要的作用：通過(guò)專(zhuān)業(yè)能力節(jié)省PM反復(fù)修改原型的時(shí)間、可用性測(cè)試的時(shí)間而钞、UI改稿的時(shí)間沙廉、整個(gè)項(xiàng)目不斷迭代的時(shí)間；與PM共同推進(jìn)UI, 前端笨忌、開(kāi)發(fā)的產(chǎn)出質(zhì)量蓝仲；使設(shè)計(jì)統(tǒng)一化俱病、標(biāo)準(zhǔn)化官疲，提高設(shè)計(jì)效率；清晰的產(chǎn)品流程讓項(xiàng)目更合理亮隙、進(jìn)展順利途凫。交互設(shè)計(jì)師還會(huì)帶來(lái)品牌價(jià)值，統(tǒng)一的設(shè)計(jì)理念和風(fēng)格有助于增加品牌的辨識(shí)度溢吻。
和PM搶位的需求分析
術(shù)業(yè)有專(zhuān)攻维费，PM重大方向—商業(yè)目標(biāo)、功能業(yè)務(wù)促王；UE重邏輯犀盟、細(xì)節(jié)、情感蝇狼、創(chuàng)意阅畴、界面。所以需求分析需要兩方共同完成迅耘。
產(chǎn)品定位：產(chǎn)品定義+用戶需求贱枣。
產(chǎn)品定義=使用人群+主要功能+產(chǎn)品特色监署，用戶需求=用戶+使用場(chǎng)景+用戶目標(biāo)。
所以纽哥，產(chǎn)品的定位就是使用人群钠乏、主要功能、產(chǎn)品特色春塌、目標(biāo)用戶晓避、使用場(chǎng)景和用戶目標(biāo)的結(jié)合，其中摔笤，核心要素是主要功能够滑、產(chǎn)品特色、目標(biāo)用戶吕世，而以目標(biāo)用戶最為重要彰触。因?yàn)橐磺卸际菫槟繕?biāo)人群服務(wù)，需求可以根據(jù)不同時(shí)期的目標(biāo)用戶做出改變命辖，使產(chǎn)品做新况毅、做強(qiáng)。應(yīng)優(yōu)先考慮商業(yè)價(jià)值大尔艇、潛在用戶多的目標(biāo)群體尔许。
當(dāng)然，產(chǎn)品定位不是決定需求分析的唯一因素终娃，還需考慮合理性味廊、資源分配等問(wèn)題。
需求分析的采集方法有用戶調(diào)研棠耕、競(jìng)品分析余佛、上線后的用戶反饋和產(chǎn)品數(shù)據(jù)等。
需求文檔包含：版本記錄窍荧；背景描述辉巡；用戶類(lèi)型和特征；信息結(jié)構(gòu)蕊退；業(yè)務(wù)流程郊楣；每一條需求的詳細(xì)說(shuō)明，如功能瓤荔、處理流程等净蚤。
理想的需分：產(chǎn)品定位—需求采集—需求文檔；
現(xiàn)實(shí)中PM沒(méi)有按流程工作输硝，需分：需求文檔—設(shè)計(jì)目標(biāo)—設(shè)計(jì)需求今瀑。需要UE再次做用戶調(diào)研，確立設(shè)計(jì)目標(biāo)。
利用競(jìng)品做需分：競(jìng)品分析—設(shè)計(jì)目標(biāo)—設(shè)計(jì)需求放椰。嘗試所有操作作烟，截取全套競(jìng)品圖；根據(jù)截圖繪制流程圖砾医，倒退出需求拿撩，再進(jìn)行設(shè)計(jì)。
從需求到設(shè)計(jì)草圖：需要信息的組織與任務(wù)的設(shè)定（即信息架構(gòu)和流程圖）
對(duì)信息進(jìn)行分類(lèi)：導(dǎo)航設(shè)計(jì)如蚜，解決我是誰(shuí)压恒、我從哪兒來(lái)、我要做什么的問(wèn)題错邦。應(yīng)有廣度和深度的平衡探赫。廣度有利于用戶發(fā)現(xiàn)信息，一般不超過(guò)7項(xiàng)撬呢；深度要盡量少伦吠，每次點(diǎn)擊都會(huì)流失用戶。
好的導(dǎo)航系統(tǒng)為重要和常用功能設(shè)置快捷入口魂拦，例如淘寶中的購(gòu)物車(chē)毛仪、更多里的回到首頁(yè)等。
怎樣從需求文檔中組織出任務(wù)流程：
區(qū)分主要任務(wù)和次要任務(wù)芯勘，設(shè)計(jì)主線箱靴，根據(jù)是否對(duì)完成主線有幫助設(shè)計(jì)支線。支線要盡量少荷愕，這樣復(fù)雜度低衡怀，用戶更容易完成任務(wù)。
有了流程圖安疗，再畫(huà)頁(yè)面流程圖（方塊信息）抛杨，然后完成頁(yè)面交互圖，即線框圖（具體大小位置的模塊）茂契。
突出主要任務(wù)：首先分解任務(wù)蝶桶，每個(gè)子任務(wù)可能對(duì)于一個(gè)功能或頁(yè)面慨绳；根據(jù)使用人數(shù)掉冶、頻率、重要程度排列任務(wù)優(yōu)先級(jí)脐雪，將次序相近厌小、界面相似的任務(wù)組合成一個(gè)界面。這樣战秋，在同一界面中璧亚，根據(jù)優(yōu)先級(jí)按照從左上到右下的順序展現(xiàn)任務(wù)。
引導(dǎo)用戶完成任務(wù)：
通過(guò)色彩脂信、大小癣蟋、形狀透硝、視覺(jué)的相似引導(dǎo)；對(duì)齊使視線自動(dòng)向下疯搅；向?qū)Э丶羯＿@與“對(duì)齊”、“重復(fù)”幔欧、“親密性”的設(shè)計(jì)原則是類(lèi)似的罪治。
優(yōu)化操作流程：提供合適的首選項(xiàng)、幫助提示礁蔗、及時(shí)反饋觉义、默認(rèn)值。
突出重點(diǎn)信息：差異化模塊浴井；次要信息通過(guò)暗示或多層點(diǎn)擊隱藏起來(lái)晒骇。
總結(jié)：有了設(shè)計(jì)需求后需要確定產(chǎn)品的操作流程，一方面構(gòu)建導(dǎo)航系統(tǒng)磺浙，一方面設(shè)計(jì)每個(gè)界面的任務(wù)布局和跳轉(zhuǎn)厉碟，引導(dǎo)用戶完成任務(wù)。這樣就可以根據(jù)頁(yè)面流程圖創(chuàng)建線框圖了屠缭。
原型與線框圖
原型是產(chǎn)品功能和內(nèi)容的示意圖箍鼓，既包含靜態(tài)的頁(yè)面樣式—線框圖，又包含動(dòng)態(tài)的操作效果--交互說(shuō)明呵曹。
標(biāo)準(zhǔn)的原型應(yīng)包含：
變更日志款咖；版本說(shuō)明；信息結(jié)構(gòu)奄喂；任務(wù)流程+頁(yè)面流程（上一部分）铐殃；線框圖+交互說(shuō)明。
不推薦動(dòng)態(tài)效果的原型：花費(fèi)時(shí)間長(zhǎng)跨新；使用者需要注意操作富腊，可能有所遺漏。
交互說(shuō)明類(lèi)型有：動(dòng)態(tài)范圍域帐，如用戶名或密碼如何顯示赘被，長(zhǎng)度控制等；狀態(tài)肖揣，包括默認(rèn)狀態(tài)民假、常見(jiàn)狀態(tài)、特殊狀態(tài)龙优；操作和反饋羊异，如翻頁(yè)操作后頁(yè)面跳轉(zhuǎn)，誤操作后系統(tǒng)提示等。
線框圖設(shè)計(jì)要注意：
通過(guò)明暗表達(dá)層次野舶。深淺未必和重要性一致易迹，但要達(dá)到直觀的效果，必要時(shí)用單一彩色凸顯重要之處平道。
不用圖片和多種顏色赴蝇，圖片以空白代替。
遵守柵格規(guī)范巢掺。便于與視覺(jué)設(shè)計(jì)保持統(tǒng)一性句伶。
標(biāo)記第一屏的高度。第一屏可以設(shè)為600像素陆淀。
標(biāo)記內(nèi)容優(yōu)先級(jí)考余。按鈕>鏈接>文本等。
遵循視覺(jué)趨勢(shì)轧苫，如扁平化楚堤、簡(jiǎn)約風(fēng)格。
交互說(shuō)明技巧：
使用真實(shí)含懊、符合邏輯的數(shù)據(jù)和文字身冬；
考慮規(guī)則和特殊情況的描述，如勾選后狀態(tài)岔乔，顯示個(gè)數(shù)限制等酥筝，雖然這在開(kāi)發(fā)代碼里都應(yīng)詳細(xì)考慮到，但從設(shè)計(jì)的角度就應(yīng)先入為主雏门，盡可能多地把邏輯都覆蓋一遍嘿歌。
說(shuō)明可用表格或流程圖羅列，如多種狀態(tài)—懸停茁影、點(diǎn)擊時(shí)宙帝、點(diǎn)擊后的狀態(tài)顯示。還可用if-else-case語(yǔ)句解釋募闲。
對(duì)重復(fù)出現(xiàn)的模塊步脓，可以獨(dú)立出來(lái)，在每個(gè)出現(xiàn)的地方留空位和模塊名稱(chēng)即可浩螺。
設(shè)計(jì)規(guī)范
包含交互靴患、色彩、圖標(biāo)年扩、控件等的規(guī)范蚁廓。先制定交互規(guī)范—什么情況下的什么狀態(tài)访圃，在此基礎(chǔ)上制定視覺(jué)規(guī)范--什么狀態(tài)顯示成什么厨幻。設(shè)計(jì)規(guī)范一般在大產(chǎn)品、組件單一多復(fù)用、時(shí)間充裕的情況下完成况脆。
設(shè)計(jì)師的項(xiàng)目跟進(jìn)工作
設(shè)計(jì)評(píng)審：目的是為了檢驗(yàn)設(shè)計(jì)方案是否達(dá)到最初目標(biāo)饭宾，從各項(xiàng)目人員角度及時(shí)發(fā)現(xiàn)設(shè)計(jì)的風(fēng)險(xiǎn)，及時(shí)更正格了，并讓大家達(dá)成共識(shí)看铆。
評(píng)審前，考慮所有可能的方案盛末，即使最后只拿出一種設(shè)計(jì)方案弹惦。準(zhǔn)備設(shè)計(jì)數(shù)據(jù)，包括用戶調(diào)研結(jié)果悄但、研究數(shù)據(jù)棠隐、競(jìng)品分析、設(shè)計(jì)目標(biāo)等檐嚣。只邀請(qǐng)必要的人助泽，最好提前與主要負(fù)責(zé)人達(dá)成意見(jiàn)一致。
評(píng)審中嚎京，掌握會(huì)議的主導(dǎo)權(quán)嗡贺。明確產(chǎn)品定位或設(shè)計(jì)目標(biāo)——展示參考資料——展示設(shè)計(jì)意圖和方案——收集意見(jiàn)、引導(dǎo)討論鞍帝。特別注意诫睬，不要讓主題偏離，及時(shí)制止對(duì)細(xì)節(jié)的持續(xù)討論帕涌。
評(píng)審后岩臣，收集有效的反饋，整理最終設(shè)計(jì)方案告知成員宵膨。
UI設(shè)計(jì)跟進(jìn)：視覺(jué)稿需要做到與交互稿傳達(dá)的信息一致架谎，重點(diǎn)突出，層次分明辟躏；兩者差別是否會(huì)引起歧義谷扣；同時(shí)也要抓人眼球。
開(kāi)發(fā)階段跟進(jìn)：與前端工程師溝通捎琐，看是否理解到位会涎；規(guī)范設(shè)計(jì)稿，與前端采用相同標(biāo)準(zhǔn)瑞凑，便于整理末秃。
做設(shè)計(jì)走查：對(duì)產(chǎn)品demo進(jìn)行交互操作、反饋籽御、各種狀態(tài)练慕、默認(rèn)值惰匙、極限值的走查。也可配合測(cè)試寫(xiě)用例铃将，確保上線的產(chǎn)品與設(shè)計(jì)稿一致项鬼。
設(shè)計(jì)檢驗(yàn)方法
上線前采用可用性測(cè)試—定性分析（樣本少、可以了解用戶想法）劲阎、A/B測(cè)試—定量分析（結(jié)果客觀绘盟、不能得知原因）；上線后收集用戶反饋悯仙、產(chǎn)品數(shù)據(jù)龄毡。
可用性測(cè)試：通過(guò)觀察用戶使用，發(fā)現(xiàn)設(shè)計(jì)存在的問(wèn)題锡垄。這里建議招募5名與試者稚虎。
測(cè)試任務(wù)應(yīng)為：給出目標(biāo)而非操作描述；選擇最頻繁偎捎、最重要的任務(wù)蠢终；符合正常操作流程。
測(cè)試過(guò)程中注意：不要引導(dǎo)茴她，多做觀察和記錄寻拂，用戶遇到困難是多鼓勵(lì)少幫助；重視用戶細(xì)微情緒反應(yīng)丈牢；相信他們的行動(dòng)勝于語(yǔ)言祭钉；考慮場(chǎng)景多樣性，比如移動(dòng)端就適合在真實(shí)環(huán)境中（街頭等）測(cè)試己沛。
測(cè)試后分析：統(tǒng)計(jì)問(wèn)題頻率慌核、嚴(yán)重級(jí)別、違反的可用性規(guī)則——Nelson啟發(fā)式評(píng)估十大準(zhǔn)則：可視性申尼；自由度垮卓；符合慣例；一致性师幕；可識(shí)別性粟按；高效性；精簡(jiǎn)信息霹粥；防錯(cuò)性灭将；容錯(cuò)性；提供幫助后控。
A/B測(cè)試：設(shè)定衡量標(biāo)準(zhǔn)庙曙，PV, UV, 轉(zhuǎn)化率等。對(duì)同一用戶呈現(xiàn)相同界面浩淘；兩個(gè)版本同時(shí)測(cè)試捌朴；單一變量吴攒。
這里提到的交互流程：競(jìng)品分析 — 低保真交互 — 可用性測(cè)試 — 交互評(píng)審 — 高保真交互。
