`INTERFACE

DESIGN`

用戶角色及體驗(yàn)UI設(shè)計(jì)基礎(chǔ)課程Chapter

1用戶角色創(chuàng)建用戶角色（persona）針對(duì)使用的目標(biāo)群體真實(shí)特征的勾勒，是真實(shí)用戶的綜合原型建立用戶角色的目的：更好服務(wù)、轉(zhuǎn)變?yōu)樯虡I(yè)成果用戶角色的信息Persona虛構(gòu)出的一個(gè)用戶用來(lái)代表一個(gè)用戶群?？梢员热魏我粋€(gè)真實(shí)的個(gè)體都更有代表性。一個(gè)代表典型用戶的persona的資料有：性別、年紀(jì)、收入、地域、情感、經(jīng)常瀏覽過(guò)的URL、以及這些URL包含的內(nèi)容、關(guān)鍵詞等等。一個(gè)產(chǎn)品通常會(huì)設(shè)計(jì)3～6個(gè)用戶模型代表所有的用戶群體。UCD以用戶為中心的設(shè)計(jì)理念“用戶角色”定義需注意：（1）我們希望知道：用戶如何理解產(chǎn)品，如何使用產(chǎn)品用戶的目標(biāo)和行為模式不可能建立一個(gè)適合所有人的產(chǎn)品！【需求】設(shè)計(jì)一輛車（2）我們關(guān)注的重點(diǎn)：不是精確描述單個(gè)用戶是怎么樣、喜歡什么而是重點(diǎn)關(guān)注一群用戶——需要什么、想做什么A作為學(xué)生，他喜歡用郵箱訂閱新聞，不喜歡在郵箱里通過(guò)郵件來(lái)往聊天。A作為學(xué)生，主要將郵箱作為資訊獲得、管理和分享的工具。A的學(xué)生群體的用戶角色模擬，讓你知道突出：推送資訊功能、管理收發(fā)件功能、轉(zhuǎn)發(fā)分享功能（3）成功的商業(yè)模式通常只針對(duì)特定的群體當(dāng)你說(shuō)出“郵箱”這個(gè)詞的時(shí)候……想讓更多用戶喜愛(ài)的結(jié)果可能會(huì)將一個(gè)潛在的好產(chǎn)品置于死地——AlanCooper50%讓全體中的50%對(duì)產(chǎn)品滿意100%分離出這50%人，讓他們對(duì)對(duì)產(chǎn)品滿意度達(dá)99%以上（4）引起共鳴用戶思維取代產(chǎn)品思維做決策時(shí)想象角色在這種情形下會(huì)怎么做？讓每個(gè)人都優(yōu)先考慮有關(guān)目標(biāo)用戶和功能的問(wèn)題學(xué)渣考四級(jí)用戶角色模擬某TT，女，28歲，職業(yè)：白領(lǐng)，外來(lái)務(wù)工者居?。簭V州租房愛(ài)好：上班，睡覺(jué)，逛淘寶。（平時(shí)工作忙，節(jié)假日喜歡宅家，愛(ài)逛淘寶，有很多閑置物品）故事版本：周日早上9點(diǎn)，TT在收拾衣柜時(shí)候，發(fā)現(xiàn)有一批閑置衣服，不想掛在閑魚上二手交易，覺(jué)得捐贈(zèng)比較省時(shí)間。于是我在手機(jī)上提交一份捐贈(zèng)需求，寫明要捐贈(zèng)什么衣服，新舊程度選擇了7成新以上，寫了數(shù)量，預(yù)約上門時(shí)間

TT提交捐贈(zèng)后，基于地理位置搜尋到某回收站點(diǎn)，于是即刻收到預(yù)約電話，約好了下午4點(diǎn)上門取衣服。到了預(yù)定的時(shí)間，上門取衣服的社工掃了一下TT界面的二維碼，確認(rèn)用戶信息，在清點(diǎn)檢查了捐贈(zèng)的數(shù)量后，社工確認(rèn)收到幾件衣服，并發(fā)送積分，此公益積分，小A可以在積分頻道可以兌換書籍，也可以兌換一些公益合作商家的優(yōu)惠卡，如可以洗車、吃飯等。故事里大概會(huì)包含什么功能呢？案例——公益捐物APP1.有目標(biāo)用戶2.對(duì)目標(biāo)用戶使用有價(jià)值Before——即現(xiàn)狀分析(需求、問(wèn)題)。在沒(méi)有你的產(chǎn)品前，你的目標(biāo)用戶遇到的問(wèn)題是什么?他們明確的及潛在的需求是什么?市場(chǎng)上已經(jīng)有哪些產(chǎn)品?這些產(chǎn)品為什么沒(méi)有滿足這些需求，解決這個(gè)問(wèn)題?After——這個(gè)產(chǎn)品如何滿足需求及解決問(wèn)題的?除此之外，潛在的利益是什么?可以分用戶、公司多個(gè)維度闡釋。3.目標(biāo)用戶能用假設(shè)我們是要做這樣一個(gè)產(chǎn)品，一起來(lái)YY一下有哪幾個(gè)參與角色吧捐物者收物者可以和公益組織、社工群體、慈善組織取得聯(lián)系，讓他們成為第一種參與方假設(shè)定位于年輕人群體，舍得買也舍得捐，有足夠的能力儲(chǔ)備可以使用在線系統(tǒng)1.有目標(biāo)用戶2.對(duì)目標(biāo)用戶使用有價(jià)值3.目標(biāo)用戶能用各居民區(qū)住戶，年輕人為主，年齡在22到35歲Before：小戶型房子，儲(chǔ)物空間有限；時(shí)尚群體，消費(fèi)空間很大，比較喜歡嘗鮮，衣服和各種生活物品只進(jìn)不出，沒(méi)有足夠地方容納；處理舊衣物的方式有限：獨(dú)生子女群體居多，也沒(méi)有家人親戚可以贈(zèng)送；災(zāi)民缺衣少物也沒(méi)有通道進(jìn)行捐贈(zèng)；二手市場(chǎng)耗費(fèi)精力……After：可隨時(shí)提交捐贈(zèng)需求，等待有人上門收取，輕松做到眼不見(jiàn)心不煩。捐贈(zèng)帶來(lái)額外好處：1.換取公益積分2.公益積分可沖抵水電費(fèi)……捐物者收物者根據(jù)頁(yè)面舉各項(xiàng)操作，基于假設(shè)判斷用戶若點(diǎn)擊什么就會(huì)到哪里。在這個(gè)案例中，我希望用戶的第一個(gè)頁(yè)面是首頁(yè)。他有兩個(gè)主要被引導(dǎo)的操作：1.可以查看捐贈(zèng)或新提交一個(gè)捐贈(zèng)。2.可以查看公益積分或兌換積分。以下就是從這個(gè)頁(yè)面開始的一系列頁(yè)面流程：未完待續(xù)……功能流程圖Chapter

2（功能）流程圖（功能）流程圖簡(jiǎn)要：界面=操作+內(nèi)容操作是需要用戶觸發(fā)的，包含鏈接、按鈕、表單等等。用戶通過(guò)這些操作，看到同一個(gè)頁(yè)面上不同的內(nèi)容，或者跳轉(zhuǎn)到其他的頁(yè)面。流程圖元素頁(yè)面、命令、操作或狀態(tài)、鏈接線流程圖目標(biāo)表現(xiàn)用戶的不同的操作指令下不同頁(yè)面流轉(zhuǎn)關(guān)系也是形成原型圖的雛形代表起始代表中間代表判斷YN流程圖VS其他常用圖表信息架構(gòu)圖FernandoGuillen快速手繪出來(lái)的APP的用戶操作流程圖。最早期的設(shè)計(jì)版本線框圖線框圖是產(chǎn)品設(shè)計(jì)的低保真呈現(xiàn)方式。它有三個(gè)簡(jiǎn)單直接而明確的目標(biāo)：1、呈現(xiàn)主體信息群2、勾勒出結(jié)構(gòu)和布局3、用戶交互界面的主視覺(jué)和描述正確地創(chuàng)建了線框圖之后，它將作為產(chǎn)品的骨干而存在。它就像一幢建筑的藍(lán)圖一樣，將細(xì)節(jié)規(guī)定地明明白白。用戶體驗(yàn)用戶的“不喜歡”：我不喜歡每次開電腦管家，都告訴我很低分有時(shí)只是方式有誤陌陌的文案及視頻用戶的需求是一個(gè)結(jié)果，目的才是原因交互設(shè)計(jì)師的基本素質(zhì)聽、看、想、說(shuō)、磨、做、驗(yàn)、寫、講聽：傾聽看：博覽想：勤于思考說(shuō)：善于溝通磨：有耐心有技巧做：實(shí)現(xiàn)想法驗(yàn)：客觀中立的驗(yàn)證分析寫：分析、歸納總結(jié)講“演講””席克定律面臨選擇越多時(shí)間消耗越長(zhǎng)費(fèi)茨定律越遠(yuǎn)越小越難點(diǎn)擊目標(biāo)尺寸離選擇區(qū)域越遠(yuǎn)越難選中7+-2古騰堡法則奧卡姆剃刀原理（簡(jiǎn)單有效法則）泰思勒定律（復(fù)雜守恒定律）接近法則幫用戶分類劃分模塊防錯(cuò)原則0123法則0手冊(cè)1看就會(huì)不超過(guò)2次點(diǎn)不等待超3秒Chapter1什么是用戶體驗(yàn)

一個(gè)產(chǎn)品用戶體驗(yàn)的好壞取決于用戶群的感受和目標(biāo)，即用戶使用產(chǎn)品過(guò)程中所處的環(huán)境和使用場(chǎng)景移動(dòng)設(shè)備的特點(diǎn)，移動(dòng)情景的分析，在移動(dòng)應(yīng)用設(shè)計(jì)時(shí)要考慮更多的設(shè)計(jì)特征。由用戶、設(shè)備和使用情景相互作用的系統(tǒng)構(gòu)成了“人-機(jī)-環(huán)協(xié)同的交互系統(tǒng)”這是設(shè)計(jì)移動(dòng)應(yīng)用時(shí)應(yīng)考慮的基礎(chǔ)。移動(dòng)情景觸摸視覺(jué)輸出輸入信息加工信息加工”機(jī)“的輸出信息＝”人“接收的信息反之也成立”機(jī)“輸出信息受環(huán)境影響，以此影響到”人“接受信息質(zhì)量”人“輸出信息受環(huán)境影響：?jiǎn)坞p手操作、語(yǔ)音輸入識(shí)別度解決剛剛“小明事件”，方法有哪些呢？提供離線地圖增加界面友好性設(shè)計(jì)【例】牛牛，私家車主，手機(jī)導(dǎo)航，周日約了靜靜，從廣州開車去嶺南清遠(yuǎn)校區(qū)上課。目標(biāo)用戶?使用環(huán)境?使用工具?完成什么任務(wù)？感官體驗(yàn)如何？?jī)煞昼娀卮鹨陨衔鍌€(gè)問(wèn)題用戶體驗(yàn)內(nèi)容：目標(biāo)用戶?使用環(huán)境?使用工具?完成什么任務(wù)？感官體驗(yàn)如何？職業(yè)、薪資、年齡沒(méi)法手持？天氣惡劣？堵車？修路？接電話？聽音樂(lè)？沒(méi)有電？沒(méi)流量？路況？虛擬用戶角色卡片牛牛開車過(guò)程中手機(jī)

規(guī)劃導(dǎo)航，按時(shí)到達(dá)

貼心、方便、精準(zhǔn)什么是用戶體驗(yàn)需求目標(biāo)用戶群如何使用產(chǎn)品用戶體驗(yàn)概念用戶使用手機(jī)導(dǎo)航開車，手機(jī)開路線導(dǎo)航，方便精準(zhǔn)用戶在使用產(chǎn)品過(guò)程中的主觀感受產(chǎn)品：一款手機(jī)導(dǎo)航的APP應(yīng)用的使用情景特征休閑中等候中忙碌中移動(dòng)應(yīng)用多樣化的使用場(chǎng)景注意事項(xiàng)：休閑中：網(wǎng)絡(luò)狀態(tài)良好，用戶心情也放松，姿態(tài)也輕松，有長(zhǎng)時(shí)間使用應(yīng)用的可能性。等候中：公交車上、廁所外、茅坑上，短暫時(shí)間中使用，網(wǎng)絡(luò)不一定很好用，使用時(shí)間短暫忙碌中：用戶旅行在外，在公交車上，電量、網(wǎng)絡(luò)狀態(tài),同時(shí)在做很多事情瀏覽體驗(yàn)/視覺(jué)效果/趣味……碎片化/可保存……離線保存/快速切換/可保存……克服環(huán)境光的影響視覺(jué)設(shè)計(jì)師需要考慮環(huán)境光對(duì)界面的影響，讓對(duì)象與背景有個(gè)適中的對(duì)比度，使應(yīng)用在各個(gè)環(huán)境光條件下都有相對(duì)舒適的閱讀體驗(yàn)應(yīng)對(duì)不同的環(huán)境噪音迎合用戶的各種姿態(tài)在不同的使用場(chǎng)景中，用戶有不同的姿態(tài)：走路、坐著、躺著、干活中、貼耳傾聽等等。各種姿勢(shì)下的持機(jī)方式也不同，他們不僅會(huì)影響到用戶的操作，也會(huì)影響到用戶的注意力分配QQ雙擊對(duì)話界面會(huì)出現(xiàn)現(xiàn)實(shí)場(chǎng)景聽歌場(chǎng)景：切換歌與不切換歌小結(jié)：用戶體驗(yàn)的內(nèi)容：移動(dòng)應(yīng)用的使用情景特征：移動(dòng)應(yīng)用的考慮因素：目標(biāo)用戶、使用環(huán)境、使用工具、完成任務(wù)、感官體驗(yàn)休閑、等候（無(wú)聊）、忙碌（1）克服環(huán)境光的影響（2）應(yīng)對(duì)不同噪音（3）迎合各種姿態(tài)Chapter

3從哪些方面設(shè)計(jì)/改善用戶體驗(yàn)用戶體驗(yàn)設(shè)計(jì)方法：一級(jí)視覺(jué)、二級(jí)交互、三級(jí)情感統(tǒng)一字體，

減少不同種類字體的使用更能體現(xiàn)排版美學(xué)

只是用一款字體可以為品牌帶來(lái)一致性的感受

用戶更喜歡統(tǒng)一的字體帶來(lái)的簡(jiǎn)潔化（一）視覺(jué)12級(jí)APP界面設(shè)計(jì)AIF小組字體不統(tǒng)一，在手機(jī)如此小的屏幕下看，缺點(diǎn)會(huì)被無(wú)限放大多用卡片和留白

將不同的內(nèi)容放置于不同的卡片塊上，使用空白將不同內(nèi)容塊劃分開.

視覺(jué)體驗(yàn)更加清晰，產(chǎn)品易用性也得到了提高/shots/606745-In-app-Visual-Data娛樂(lè)類應(yīng)用：MONO用更少的顏色顏色更少以求一個(gè)更干凈的外觀更容易突出品牌特性關(guān)鍵元素可以被輕易突出，導(dǎo)航體驗(yàn)更好純度高的，建議選擇原色，不要選擇間色默默的一片閱兵藍(lán)12級(jí)APP界面設(shè)計(jì)渡小組12級(jí)APP界面設(shè)計(jì)渡小組1.滑動(dòng)適用場(chǎng)合：當(dāng)用戶需要導(dǎo)航以列表方式呈現(xiàn)的信息時(shí)（二）交互2.彈出適用場(chǎng)合：當(dāng)用戶與單一物體交互時(shí)3.最小化適用場(chǎng)合：當(dāng)用戶想要最小化某個(gè)物體時(shí)4、切換對(duì)象適用場(chǎng)合：當(dāng)用戶在對(duì)象之間切換時(shí)5.展開堆疊適用場(chǎng)合：當(dāng)用戶打開一沓物體時(shí)6.添加到列表適用場(chǎng)合：當(dāng)用戶需要將物體添加到已存列表中時(shí)7.翻頁(yè)適用場(chǎng)合：當(dāng)用戶翻頁(yè)時(shí)8.固定標(biāo)簽適用場(chǎng)合：當(dāng)用戶滾動(dòng)帶有標(biāo)簽的列表時(shí)（常見(jiàn)的頭部固定，可參考iOS7的電話簿列表9.橫豎屏切換10.按鈕標(biāo)簽轉(zhuǎn)換適用場(chǎng)合：同一層級(jí)之間的導(dǎo)航適用場(chǎng)合：當(dāng)內(nèi)容需要根據(jù)設(shè)備的旋轉(zhuǎn)來(lái)旋轉(zhuǎn)、重新排列時(shí)11.分合適用場(chǎng)合：當(dāng)用戶分離結(jié)合物體時(shí)12.滾動(dòng)適用場(chǎng)合：當(dāng)用戶水平或垂直的移動(dòng)物體時(shí)13.平移適用場(chǎng)合：當(dāng)用戶水平或垂直的移動(dòng)物體時(shí)14.滾動(dòng)條15.頁(yè)碼指示器適用場(chǎng)合：當(dāng)翻頁(yè)、切換屏幕內(nèi)容時(shí)適用場(chǎng)合：滾動(dòng)列表時(shí)16.保存指示器適用場(chǎng)合：當(dāng)用戶添加書簽、下載、保存時(shí)/appdesign/7303.html工具類產(chǎn)品，強(qiáng)調(diào)的是易用，簡(jiǎn)單比如有道云筆記，百度地圖。交互效果不易太花哨，要能使用戶第一時(shí)間完成他的目的。社交，視頻，音樂(lè)等社交類產(chǎn)品，增加一些有趣的交互效果，使用戶得到一種心情上的滿足感（三）情趣總結(jié)（1）用戶體驗(yàn)：用戶在產(chǎn)品使用過(guò)程中的主觀感受（2）從哪些方面設(shè)計(jì)用戶體驗(yàn)：感官體驗(yàn)、交互體驗(yàn)、瀏覽體驗(yàn)、情景體驗(yàn)（3）從哪幾個(gè)方面改進(jìn)用戶體驗(yàn)：視覺(jué)、交互、情趣、文案、操作流程極客公園:/36氪:http://36/虎嗅網(wǎng):///////https://aotu.io///1.創(chuàng)意組。參賽項(xiàng)目具有較好的創(chuàng)意和較為成型的產(chǎn)品原型或服務(wù)模式，在2017年5月31日前尚未完成工商登記注冊(cè)。參賽申報(bào)人須為團(tuán)隊(duì)負(fù)責(zé)人，須為普通高等學(xué)校在校生（可為本?？粕⒀芯可?，不含在職生）。參賽項(xiàng)目要求能夠?qū)⒁苿?dòng)互聯(lián)網(wǎng)、云計(jì)算、大數(shù)據(jù)、人工智能、物聯(lián)網(wǎng)等新一代信息技術(shù)與經(jīng)濟(jì)社會(huì)各領(lǐng)域緊密結(jié)合，培育基于互聯(lián)網(wǎng)新時(shí)代的新產(chǎn)品、新服務(wù)、新業(yè)態(tài)、新模式；發(fā)揮互聯(lián)網(wǎng)在促進(jìn)產(chǎn)業(yè)升級(jí)以及信息化和工業(yè)化深度融合中的作用，促進(jìn)制造業(yè)、農(nóng)業(yè)、能源、環(huán)保等產(chǎn)業(yè)轉(zhuǎn)型升級(jí)；發(fā)揮互聯(lián)網(wǎng)在社會(huì)服務(wù)中的作用，創(chuàng)新網(wǎng)絡(luò)化服務(wù)模式，促進(jìn)互聯(lián)網(wǎng)與教育、醫(yī)療、交通、金融、消費(fèi)生活等深度融合。參賽項(xiàng)目主要包括以下類型：1.“互聯(lián)網(wǎng)+”現(xiàn)代農(nóng)業(yè)，包括農(nóng)林牧漁等；2.“互聯(lián)網(wǎng)+”制造業(yè)，包括智能硬件、先進(jìn)制造、工業(yè)自動(dòng)化、生物醫(yī)藥、節(jié)能環(huán)保、新材料、軍工等；3.“互聯(lián)網(wǎng)+”信息技術(shù)服務(wù)，包括工具軟件、社交網(wǎng)絡(luò)、媒體門戶、企業(yè)服務(wù)等；4.“互聯(lián)網(wǎng)+”文化創(chuàng)意服務(wù)，包括廣播影視、設(shè)計(jì)服務(wù)、文化藝術(shù)、旅游休閑、藝術(shù)品交易、廣告會(huì)展、動(dòng)漫娛樂(lè)、體育競(jìng)技等；5.“互聯(lián)