對(duì)于產(chǎn)品經(jīng)理、設(shè)計(jì)師和運(yùn)營人員，心理學(xué)都是必須要補(bǔ)的一門課程。
可能很多同學(xué)都犯過和小摹相同的錯(cuò)誤——在各種商城放“神券”的時(shí)候屯一大堆專業(yè)書籍。實(shí)際上，心理學(xué)的書籍你大概只要看到第三本，就會(huì)發(fā)現(xiàn)翻來覆去講的就是那么幾個(gè)淺顯易懂的道理，而且大部分都是你在日常生活中就能觀察和感受到的。
基礎(chǔ)心理學(xué)（消費(fèi)者心理學(xué)，社會(huì)心理學(xué)，傳播和行為心理學(xué)等）的概念都不難，但如何精妙地運(yùn)用在自己的專業(yè)上則非?？简?yàn)使用者的功力。
為什么產(chǎn)品、設(shè)計(jì)、運(yùn)營都需要學(xué)習(xí)心理學(xué)？
因?yàn)樗麄児ぷ鞯谋举|(zhì)都是和“人”打交道——用產(chǎn)品方案、視覺內(nèi)容和活動(dòng)規(guī)劃來影響用戶的決策、行為和心理。
你可能會(huì)覺得“依靠數(shù)據(jù)來統(tǒng)計(jì)用戶的行為再針對(duì)性決策”會(huì)更客觀，但實(shí)際上想得到靠譜的數(shù)據(jù)和正確的結(jié)論一點(diǎn)也不輕松，甚至很多公司根本不具備開展這類型調(diào)研的條件。
在這種情況下唯一的辦法還是洞察用戶并主動(dòng)決策，此時(shí)基礎(chǔ)心理學(xué)原理就是你進(jìn)行判斷的重要依據(jù)。
本文為大家梳理了十大著名的心理學(xué)原理，這些概念來自于多本心理學(xué)的經(jīng)典名著，小摹進(jìn)行了適當(dāng)整合。
一、懷舊思維
簡單來說，就是人們?cè)诮^大部分時(shí)候都會(huì)遵循歷史慣性，更愿意相信過去的結(jié)論。
這也解釋了為什么現(xiàn)代商業(yè)中，品牌一直是一項(xiàng)核心競爭力：如果一個(gè)品牌曾經(jīng)贏得了消費(fèi)者的信任，那么消費(fèi)者往往愿意持續(xù)選擇這個(gè)品牌的產(chǎn)品。
在產(chǎn)品設(shè)計(jì)中，懷舊思維有著極其豐富的應(yīng)用場景。比如軟件產(chǎn)品的交互對(duì)于操作上的創(chuàng)新要非常慎重——快捷鍵、交互邏輯、界面布局等盡量和行業(yè)中主流產(chǎn)品一致，會(huì)更容易讓新用戶接受。
比如我們的原型設(shè)計(jì)工具“摹客RP”，界面布局借鑒了國外的UI工具Figma和Sketch。雖然產(chǎn)品主打的方向并不相同，但遵循業(yè)界已經(jīng)約定俗成的定式設(shè)計(jì)，在新用戶上手的角度有很大的優(yōu)勢(shì)。
二、暈輪效應(yīng)
暈輪效應(yīng)原指人際交往中，人身上表現(xiàn)出的某一方面的特征，掩蓋了其他特征，從而造成人際認(rèn)知的障礙。
比如有的老年人對(duì)青年人的個(gè)別缺點(diǎn)，或衣著打扮、生活習(xí)慣看不順眼，就認(rèn)為他們一定沒出息；有的青年人由于傾慕朋友的某一可愛之處，就會(huì)把他看得處處可愛，真所謂"一俊遮百丑"。
暈輪效應(yīng)是一種以偏概全的主觀心理臆測，和上面的懷舊思維類似，屬于一種思維的定式，因?yàn)檫@種方式大腦在決策時(shí)會(huì)更輕松。
對(duì)于產(chǎn)品規(guī)劃者，尤其要想清楚自己的核心優(yōu)勢(shì)和賣點(diǎn)是什么，不必完美主義地去追求面面俱到，因?yàn)槿绻钔怀龅膬?yōu)點(diǎn)能打動(dòng)用戶，即使有缺點(diǎn)也很容易被用戶忽略。
三、習(xí)得性無助
簡單地說，如果用戶在過程中產(chǎn)生了“無論如何都無法改變現(xiàn)狀”的感受，容易陷入深深的絕望和悲哀。
在實(shí)驗(yàn)中，經(jīng)過訓(xùn)練的狗本可以逃避實(shí)驗(yàn)者加于它的電擊。但是，如果狗以前受到過不可預(yù)期（不知道什么時(shí)候到來）且不可控制的電擊（如電擊的中斷與否不依賴于狗的行為），他們就會(huì)徹底躺平并不再逃離。
狗之所以表現(xiàn)出這種狀況，是由于在實(shí)驗(yàn)的早期學(xué)到了一種無助感。
也就是說，它認(rèn)識(shí)到自己無論做什么都不能控制電擊的終止。
人如果產(chǎn)生了習(xí)得性無助，將很快拋棄當(dāng)前讓他產(chǎn)生失望感的產(chǎn)品。這個(gè)原理解釋了為什么現(xiàn)在商品或者服務(wù)往往都要為用戶提供非常順暢的溝通方式（比如熱線電話）。
如果你比較了解國外在線軟件行業(yè)趨勢(shì)，就會(huì)發(fā)現(xiàn)很多的新興產(chǎn)品都已經(jīng)不滿足于提供官方的Email地址，而是直接提供Discord鏈接（可以理解為在線聊天室）。
及時(shí)的直接溝通可以避免用戶產(chǎn)生絕望感，增加產(chǎn)品的生存幾率。
四、貝博規(guī)率
其實(shí)用一個(gè)成語就可以形容這個(gè)規(guī)律：得寸進(jìn)尺。在實(shí)際場景中，只要想辦法讓用戶先接受了一個(gè)小要求，之后就更可能讓他接受一項(xiàng)更大、更不合意的要求。
原始的實(shí)驗(yàn)中，心理學(xué)家讓兩位大學(xué)生訪問郊區(qū)的一些家庭主婦。其中一位首先請(qǐng)求家庭主婦將一個(gè)小標(biāo)簽貼在窗戶（這是一個(gè)小的、無害的要求）。
兩周后，另一位大學(xué)生再次訪問家庭主婦，要求她們?cè)谠簝?nèi)豎立一個(gè)呼吁安全駕駛的大招牌（該招牌很不美觀，這是一個(gè)大要求）。
結(jié)果答應(yīng)了第一項(xiàng)請(qǐng)求的人中有55％的人接受這項(xiàng)要求，而那些第一次沒被訪問的家庭主婦中只有17％的人接受了該要求。
這個(gè)實(shí)驗(yàn)說明，如果想要用戶達(dá)到最終的目標(biāo)，可以先適當(dāng)設(shè)置一些和最終目標(biāo)相關(guān)，但完成難度小得多的目標(biāo)，循序漸進(jìn)地引導(dǎo)，可以大大提升轉(zhuǎn)化率。
這種原理在各種產(chǎn)品的銷售的場景的可謂是遍地開花。
比如汽車、不動(dòng)產(chǎn)等高價(jià)的商品，往往會(huì)給打出“來訪即送好禮”的方式吸引用戶前往，然后通過用戶試駕、樣板房體驗(yàn)等環(huán)節(jié)引導(dǎo)用戶去體驗(yàn)和接納，客戶有意向后，也只會(huì)要求付定金（而不是全款）......這樣繁復(fù)的流程都是為了把困難的目標(biāo)拆解得更細(xì)小。
五、主觀性證詞
心理學(xué)研究表明，很多證人提供的證詞都不太準(zhǔn)確，或者說是具有明顯的個(gè)人觀點(diǎn)、傾向性和意識(shí)。甚至，證人對(duì)他們的證詞的信心和證詞的準(zhǔn)確性沒有足夠的相關(guān)性。
結(jié)合這個(gè)原理，就能更好地理解為什么問卷或是訪談等經(jīng)典的調(diào)研方法并不一定能收集到足夠準(zhǔn)確的信息，對(duì)于一些主觀性較強(qiáng)的問題，個(gè)人的傾向會(huì)極大的影響答案的可信度。
正確的做法是，盡量避免在調(diào)研中出現(xiàn)主觀性過強(qiáng)的題目，如果無法避免，盡量將題目拆解為多項(xiàng)能被客觀量化或評(píng)估的問題。如果沒有考慮用戶本身對(duì)于產(chǎn)品的傾向性，很可能被言過其實(shí)的“證詞”誤導(dǎo)出錯(cuò)誤的結(jié)論。
六、馬太效應(yīng)
馬太效應(yīng)是指好的愈好，壞的愈壞，多的愈多，少的愈少的一種現(xiàn)象，出自圣經(jīng)《新約 | 馬太福音》中的一則寓言。
這個(gè)效應(yīng)常為經(jīng)濟(jì)學(xué)界所借用，反映貧者愈貧，富者愈富，贏家通吃的經(jīng)濟(jì)學(xué)中收入分配不公的現(xiàn)象。
類似的理論還有很多，比如二八定律（20%的頭部公司掌握80%的市場份額，20%的優(yōu)質(zhì)客戶貢獻(xiàn)80%的銷售收入，等等）。
這個(gè)原理告訴我們，要想讓產(chǎn)品在某一個(gè)領(lǐng)域保持優(yōu)勢(shì)，就必須在此領(lǐng)域迅速做大。
當(dāng)你成為某個(gè)領(lǐng)域的領(lǐng)頭羊時(shí)，你也能更輕易地獲得比弱小的同行更大的收益。而若沒有實(shí)力迅速在某個(gè)領(lǐng)域做大，就要不停地尋找新的發(fā)展領(lǐng)域，才能保證獲得較好的回報(bào)。
七、從眾行為
營銷和促銷手段中最重要心理原理之一，即：人們更容易相信被多數(shù)人接受的選擇。
我們經(jīng)?？梢钥吹铰愤厓杉也蛷d，一家門口排滿了等待的食客，另一家卻一桌客人都沒有，巨大的反差往往讓后面到來的客人寧愿等待也要選擇人多的餐廳。
關(guān)于這種心理，哲學(xué)家認(rèn)為是人類理性的有限性，社會(huì)學(xué)家認(rèn)為是人類的集體無意識(shí)，而經(jīng)濟(jì)學(xué)家則從信息不完全、委托代理等角度來解釋。但需要特別注意的是，從眾行為并非絕對(duì)的，因?yàn)樵谧非髠€(gè)人喜好上，人類往往也有很多個(gè)性的需求，從眾行為和個(gè)性追求往往是同時(shí)存在的。
從眾行為最典型的應(yīng)用方式就是密集推薦或評(píng)價(jià)，現(xiàn)在的書籍的扉頁動(dòng)輒幾十條推薦語，在線服務(wù)往往也會(huì)引用大量網(wǎng)友的好評(píng)，來證明自己的價(jià)值。
新產(chǎn)品在推向市場時(shí)，先多收集一些用戶的正面評(píng)價(jià)，宣傳時(shí)會(huì)非常有利。
八、比較心理
這是消費(fèi)者心理學(xué)最經(jīng)典的原理，簡單來說就是把一個(gè)200元的產(chǎn)品和一個(gè)100元的看上去差不多的產(chǎn)品擺在一起，你就會(huì)覺得100元這個(gè)超級(jí)劃算，很容易產(chǎn)生購買的沖動(dòng)。
對(duì)于每個(gè)人來說，所有的認(rèn)知，價(jià)值觀和結(jié)論都是建立在【比較】的基礎(chǔ)上得出的，所以，影響一個(gè)人的認(rèn)知，最有效的辦法就是創(chuàng)造對(duì)比的機(jī)會(huì)。
價(jià)格頁面最喜歡運(yùn)用比較心理，因?yàn)楸容^心理可以幫助他們重新設(shè)定消費(fèi)者的認(rèn)知。
常見的做法比如拉高產(chǎn)品的價(jià)格再做夸張的折扣讓用戶覺得這個(gè)商品現(xiàn)在超級(jí)劃算；或者在主推產(chǎn)品旁邊放置兩個(gè)明顯性價(jià)比不佳的次品，讓用戶對(duì)主推產(chǎn)品的效果感知更加強(qiáng)烈。
此外，在產(chǎn)品介紹時(shí)也可以將競品的參數(shù)列在表格中和自家的產(chǎn)品進(jìn)行對(duì)比（當(dāng)然，這個(gè)表格中的項(xiàng)目都是挑選過的），這樣更容易體現(xiàn)自家產(chǎn)品的優(yōu)勢(shì)。
九、投射效應(yīng)
人們?cè)谌粘Ｉ钪谐３＜僭O(shè)他人與自己具有相同的屬性、愛好或傾向等，心理學(xué)家稱這種心理現(xiàn)象為"投射效應(yīng)"。
"以小人之心度君子之腹"就是一種典型的投射效應(yīng)。當(dāng)別人的行為與我們不同時(shí)，我們習(xí)慣用自己的標(biāo)準(zhǔn)去衡量別人的行為，認(rèn)為別人的行為違反常規(guī)。
了解這一點(diǎn)對(duì)于產(chǎn)品的策劃者們非常重要：用戶的想法很可能和自己不同（即便你認(rèn)為自己在這個(gè)領(lǐng)域比其他人都專業(yè)得多），但仍然需要被尊重。
所以近年來特別流行用戶體驗(yàn)、同理心這樣的詞匯，產(chǎn)品應(yīng)該以真實(shí)用戶的體驗(yàn)滿意度作為參考指標(biāo)，設(shè)計(jì)者應(yīng)該盡可能地以設(shè)想自己是一個(gè)目標(biāo)用戶時(shí)，會(huì)有什么反應(yīng)，否則僅靠自己的“臆測”，創(chuàng)造出來的產(chǎn)品很可能和真實(shí)需求脫節(jié)。
十、賭博心理
以小博大的感覺是一種強(qiáng)上癮體驗(yàn)，人們只有在輸?shù)臅r(shí)候才想到離開，少有在贏的時(shí)候離開。這個(gè)就是賭場盈利的本質(zhì)模式。
由于真金白銀賭博是法律明令禁止的，所以產(chǎn)品設(shè)計(jì)角度一般都是借助積分、代幣等方式來給用戶制造“抽獎(jiǎng)”的機(jī)會(huì)。
對(duì)于國內(nèi)而言，氪金手游和盲盒就是典型的兩種應(yīng)用場景，前者往往會(huì)設(shè)定一個(gè)極低的概率讓玩家獲得珍貴的虛擬物品，后者則是讓消費(fèi)者有小概率獲得稀有款式的手辦，引誘顧客購買超過自己需求的商品。
對(duì)于產(chǎn)品設(shè)計(jì)人員來講，賭博機(jī)制可以說是一個(gè)潘多拉魔盒，通常不建議去使用和嘗試。人人都愛KPI，但也要取之有道，職場人都應(yīng)該有自己的底線。
作者：jongde來源： 站酷
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請(qǐng)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
在日常使用移動(dòng)端或PC端產(chǎn)品時(shí)，不知你有沒有這樣的體會(huì)？
推薦一個(gè)比較實(shí)用的設(shè)計(jì)法則，這個(gè)法則已經(jīng)有很多的文章說明了，可以說現(xiàn)在的任何互聯(lián)網(wǎng)產(chǎn)品都能看到這些理論的實(shí)踐，本次主要想以比較多的案列進(jìn)行實(shí)戰(zhàn)分析。
尼爾森的十大可用性原則是尼爾森博士在分析了兩百多個(gè)可用性問題的基礎(chǔ)上，提煉出的十項(xiàng)交互設(shè)計(jì)原則。被廣泛運(yùn)用于網(wǎng)頁、APP以及各種人機(jī)交互領(lǐng)域。
要注意的是，這10項(xiàng)原則是啟發(fā)式（heuristics）的、廣泛的經(jīng)驗(yàn)法則，可以指導(dǎo)我們更具價(jià)值的思考界面設(shè)計(jì)。
設(shè)計(jì)原則都可靈活運(yùn)用于各個(gè)地方,可以是交互設(shè)計(jì),也可以是界面設(shè)計(jì),深入了解各種設(shè)計(jì)原則,讓設(shè)計(jì)師在做設(shè)計(jì)的時(shí)候可以找到更好的解決方案,提高用戶的使用體驗(yàn)。
雅各布·尼爾森（Jakob Nielsen）是畢業(yè)于哥本哈根的丹麥技術(shù)大學(xué)的人機(jī)交互博士，被譽(yù)為可用性測試的鼻祖，2006年4月，并被納入美國計(jì)算機(jī)學(xué)會(huì)人機(jī)交互學(xué)院，被賦予人機(jī)交互實(shí)踐的終身成就獎(jiǎng)。
尼爾森于1995年1月1日發(fā)表了「十大可用性原則」，該原則被廣大設(shè)計(jì)師奉為教科書般的存在。雖然20多年過去了，但是對(duì)于現(xiàn)今的產(chǎn)品體驗(yàn)設(shè)計(jì)仍然具有很大的參考意義。
人機(jī)交互的基本原則是，讓系統(tǒng)和用戶之間保持良好的溝通和信息傳遞。系統(tǒng)要告知用戶發(fā)生了什么，預(yù)期是什么，如果系統(tǒng)不能及時(shí)向用戶反饋合適的信息，用戶必然會(huì)感到失控和焦慮，不知道下一步要做什么。
界面狀態(tài)分為兩種：靜態(tài)和動(dòng)態(tài)。
靜態(tài)即用戶通過界面查閱，明確知道自己的位置、處于何種狀態(tài)，或者知道界面數(shù)據(jù)的狀態(tài)。動(dòng)態(tài)即用戶在進(jìn)行界面操作時(shí)，系統(tǒng)應(yīng)當(dāng)立刻提供反饋，告訴用戶該項(xiàng)操作被系統(tǒng)接受，讓用戶對(duì)操作感知及判斷。
告訴用戶處在系統(tǒng)的什么位置，特別是對(duì)于新用戶，需要提供必要的信息，否則容易迷惑。比如：導(dǎo)航菜單、面包屑、標(biāo)簽頁、步驟條、分頁器等等。
相比于C端產(chǎn)品，B端產(chǎn)品在頁面層級(jí)往往更為復(fù)雜。因此，讓用戶明確當(dāng)前所處的位置尤為重要，這也就突顯出了導(dǎo)航的重要性。設(shè)計(jì)師在設(shè)計(jì)的過程中，要注意提供上下文線索，避免用戶迷路。
告知用戶系統(tǒng)運(yùn)行的狀態(tài)信息，比如進(jìn)度、內(nèi)容加載時(shí)，增加用戶掌控感。
最經(jīng)典的案例莫過于Loading頁的進(jìn)度條了，無論是加載頁面還是下載內(nèi)容，一個(gè)清晰的進(jìn)度條可以讓用戶隨時(shí)掌控進(jìn)度，同時(shí)也可以用具體的數(shù)字更加明確的表示，比如：安裝程序時(shí)顯示進(jìn)度條，并預(yù)估還需要多久結(jié)束，播放音樂時(shí)顯示進(jìn)度條，并提示預(yù)估剩余時(shí)間。
系統(tǒng)適當(dāng)反饋是用戶界面設(shè)計(jì)的最基本準(zhǔn)則。當(dāng)用戶在與系統(tǒng)進(jìn)行交互時(shí)，應(yīng)當(dāng)在各個(gè)階段為用戶提供必要、積極且即時(shí)的反饋，同時(shí)也要避免過度反饋打擾用戶?？梢允褂玫男问桨ǖ痪窒抻冢?/span>
操作反饋：點(diǎn)擊頁面跳轉(zhuǎn)、按鈕點(diǎn)擊狀態(tài)、警告提示、輸入反饋等等；
結(jié)果反饋：非模態(tài)彈窗，輕量化感知系統(tǒng)內(nèi)容反饋。（反饋內(nèi)容應(yīng)盡量不要打斷用戶操作，所以一般采用toast形式，反饋結(jié)果后及時(shí)消失。）
情感反饋：搜索沒有結(jié)果時(shí)，沒有數(shù)據(jù)等等空狀態(tài)。
還可以通過元素的顏色位置、界面元素變化、文字、聲音和震動(dòng)，甚至動(dòng)效等多種形式給予用戶提示反饋。
注意，越是消極的反饋，比如網(wǎng)絡(luò)連接失敗、系統(tǒng)錯(cuò)誤等，越是要及時(shí)告知用戶，同時(shí)提醒用戶采取適當(dāng)措施。比如：1、提交表單時(shí)，如果校驗(yàn)失敗，則在填寫有誤的內(nèi)容旁邊提示錯(cuò)誤原因；2、程序未響應(yīng)時(shí)，系統(tǒng)會(huì)讓用戶選擇是關(guān)閉程序還是等待程序響應(yīng)；
系統(tǒng)應(yīng)該在合理的時(shí)間內(nèi)，給予用戶適當(dāng)?shù)姆答?，讓用戶了解正在發(fā)生的事情。
當(dāng)系統(tǒng)反饋時(shí)間小于1秒，通常正常反饋即可；相反長于1秒時(shí)，我們通常會(huì)通過加載動(dòng)畫、占位符、分步加載等方式，減緩用戶等待的焦慮感。如果超過10秒還沒有得到相應(yīng)，那么通常會(huì)認(rèn)為這次請(qǐng)求是失敗的，需要給用戶失敗提示。
例如：下載提示、刷新提示、支付提示、新頁面加載提示等。
系統(tǒng)盡可能貼切用戶所在的真實(shí)環(huán)境。把復(fù)雜的系統(tǒng)語言換成用戶看得懂的語言；環(huán)境貼切原則的根本目標(biāo)是讓用戶可以快速上手產(chǎn)品，降低學(xué)習(xí)成本。
《iPhone人機(jī)交互指南》里提到的隱喻與擬物化是很好的實(shí)踐。此外，還應(yīng)該使用易懂和約定俗成的表達(dá)。
這里說的語言不僅僅包括文案層面的語言，還包括產(chǎn)品的設(shè)計(jì)語言（圖形、配色、風(fēng)格、動(dòng)效、手勢(shì)等）設(shè)計(jì)語言都應(yīng)該是易于用戶理解和認(rèn)知的。產(chǎn)品使用的語言應(yīng)該是目標(biāo)用戶能夠清晰理解的。如果用戶不能理解，他們會(huì)感到被忽視和受挫敗，許多人將選擇其他產(chǎn)品完成目標(biāo)。
從設(shè)計(jì)心理學(xué)角度來講，用戶在使用產(chǎn)品的過程中，其大腦會(huì)“優(yōu)待”較常用的記憶內(nèi)容和操作形式，有意抑制那些相似但不常用的內(nèi)容，以便減輕認(rèn)知負(fù)擔(dān)，防止混淆，這種習(xí)慣從某種程度上來說屬于“熟知記憶”。
比如細(xì)分市場的產(chǎn)品，針對(duì)中老年、青年、兒童的產(chǎn)品或商務(wù)、娛樂的產(chǎn)品，都要分別使用符合自己的定位的語言。
反面案例就是windows系統(tǒng)出錯(cuò)了頁面，一堆亂碼，看不懂又很慌張，就很不友好。另外還有一點(diǎn)，很多大公司的app都會(huì)針對(duì)他們不同國家的用戶群體進(jìn)行各種語言的翻譯處理。
為了照顧不同國家的用戶的使用習(xí)慣對(duì)頁面結(jié)構(gòu)布局，風(fēng)格，語言，字體，包括交互方式都會(huì)做特殊處理。這就是場景貼合原則。
模仿現(xiàn)實(shí)世界的產(chǎn)品或者使用映射，能夠利用人們現(xiàn)有的知識(shí)，可以顯著的降低用戶的認(rèn)知和學(xué)習(xí)困難，并增加他們的使用興趣。
比較好的案例就是iOS原生的計(jì)算器、指南針，微信紅包都是模仿了現(xiàn)實(shí)世界的產(chǎn)品。
從現(xiàn)實(shí)世界中借鑒的設(shè)計(jì)元素可明顯降低用戶的認(rèn)知和學(xué)習(xí)難度，并且增加興趣。最有代表性的就是網(wǎng)易云的音樂播放界面圖形隱喻表達(dá)。美團(tuán)APP的母嬰類目icon的設(shè)計(jì)非常有趣，且非常容易理解和使用，讓人印象深刻。
使用的操作手勢(shì)，應(yīng)該是用戶自然就能聯(lián)想到的，不要?jiǎng)?chuàng)造、更改操作手勢(shì)的意義。
動(dòng)效的加載樣式應(yīng)符合自然規(guī)律，需要平緩過渡，而不是生硬的加載效果。比如：網(wǎng)易云音樂播放時(shí)唱片轉(zhuǎn)動(dòng)、停止播放時(shí)唱片自動(dòng)移開，有趣且有效。
用戶在使用產(chǎn)品的過程中，誤操作是經(jīng)常發(fā)生的事情，系統(tǒng)應(yīng)提供撤銷和重做功能，讓用戶具有對(duì)產(chǎn)品的控制性與自由度。
用戶可控原則的根本目標(biāo)是讓用戶可以在界面自由操作，而且無需為操作不當(dāng)承擔(dān)責(zé)任。
清晰便捷的導(dǎo)航方式，使用戶可自由控制返回和跳轉(zhuǎn)的頁面。
由于B端系統(tǒng)的復(fù)雜性，有些功能的層級(jí)會(huì)比較深。彈窗A中的某個(gè)操作可能會(huì)觸發(fā)彈窗B的彈出，如果彈窗A和B承載的功能具有父級(jí)和子級(jí)的關(guān)系，同樣需要考慮「返回」的功能以及清晰的層級(jí)關(guān)系。
用戶在使用系統(tǒng)的過程也是一個(gè)試錯(cuò)的過程，系統(tǒng)要讓用戶覺得自己的行為是可控的，可以犯錯(cuò)，并且在犯錯(cuò)之后可以反悔。用戶在使用產(chǎn)品時(shí)可以自由進(jìn)退，遵循從哪里來就返回到哪里去的原則。當(dāng)用戶誤操作時(shí)要給用戶提供撤銷、取消、重做等相關(guān)功能。不可逆的操作要給用戶明顯的提示。
比如微信聊天是可以撤回的，并且撤回之后還支持重新編輯；對(duì)于我這種打字總是出錯(cuò)的人簡直就是福利。iphone相冊(cè)刪除照片后，支持在短期內(nèi)找回；在word中編輯文檔時(shí)，支持撤銷和恢復(fù)，保存的同時(shí)，還能查看歷史保存記錄。
回收站功能：讓用戶更有自由度，增加用戶安全感，可控的找回誤刪除資源。
系統(tǒng)在重要的不可逆轉(zhuǎn)的操作需要給用戶提供二次確認(rèn)或者撤銷的功能，這樣可提高用戶的操作可控性。在產(chǎn)品設(shè)計(jì)上，防止用戶常見的誤操作。比如很多產(chǎn)品在涉及到內(nèi)容的刪除操作時(shí)，經(jīng)常會(huì)有彈窗提醒，讓用戶再次確認(rèn)。這樣是防止用戶誤操作帶來的刪除損失。用戶不用因?yàn)椴僮鲙硇睦碡?fù)擔(dān)，從而提升操作可控性。
比如iPhone ios系統(tǒng)：
1、常見的二次確認(rèn)主要可以通過以下方式實(shí)現(xiàn)：通過文字提示，用戶閱讀后點(diǎn)擊是與否來進(jìn)行下一步；
2、通過動(dòng)作，用戶通過輸入特定字符或者完成驗(yàn)證碼拖拽等操作才可進(jìn)行下一步操作；
3、通過身份校驗(yàn)，用戶需要提交個(gè)人身份信息以完成校驗(yàn)；
整個(gè)系統(tǒng)要保持產(chǎn)品結(jié)構(gòu)架構(gòu)、導(dǎo)航、用語、色彩、操作行為交互的一致性與標(biāo)準(zhǔn)性，遵循平臺(tái)慣例與行業(yè)標(biāo)準(zhǔn)。我們?cè)谠O(shè)計(jì)中常見的制作平臺(tái)規(guī)范，其實(shí)就是為了保證平臺(tái)設(shè)計(jì)的一致性。
一致性原則的根本目的是保證產(chǎn)品的專業(yè)性，給用戶帶去統(tǒng)一的體驗(yàn)感受。
遵循產(chǎn)品內(nèi)部的慣例，可幫助用戶快速學(xué)習(xí)使用產(chǎn)品功能。產(chǎn)品內(nèi)部的一致性包含：產(chǎn)品功能框架、文字、設(shè)計(jì)風(fēng)格、布局、反饋等等。
比如：小熊藝術(shù)app，一款針對(duì)孩子學(xué)習(xí)美術(shù)的app，不管是首頁、個(gè)人中心以及加載等頁面，風(fēng)格保持一致性都是主打清新黃色+可愛icon。黃色小熊更是在不同的合適的時(shí)機(jī)出現(xiàn)，banner、加載，課程動(dòng)畫中等。不僅風(fēng)格一致性、布局、反饋等產(chǎn)品內(nèi)部保持一致性，也形成了統(tǒng)一的品牌傳達(dá)。
但是，有時(shí)候?yàn)榱诉_(dá)到產(chǎn)品目標(biāo)，偶爾也會(huì)故意采用不一致的設(shè)計(jì)。
比如：常見的對(duì)話框都將“確定”按鈕放在右邊位置，所以用戶在操作時(shí)，很容易產(chǎn)生條件反射，順手點(diǎn)擊右邊按鈕，然后才突然發(fā)現(xiàn)自己點(diǎn)錯(cuò)了。雖然看起來有些別扭甚至很多人不喜歡，但是很有效，這種設(shè)計(jì)在軟件卸載、App取消會(huì)員訂閱等操作中非常常見，主要是為了做一些心理暗示和引導(dǎo)，避免用戶卸載或退訂。
交互和用戶的習(xí)慣一致，意味著用戶不再需要重新學(xué)習(xí)，各種應(yīng)用之間的切換沒有學(xué)習(xí)成本。我們?cè)谇捌谝呀?jīng)培養(yǎng)好用戶的使用習(xí)慣，那么就不要輕易改變，減少用戶的認(rèn)知成本與學(xué)習(xí)成本。
例如：常見的頁面的后退或返回都在屏幕左上角、搜索欄都在屏幕最上方、菜單欄都懸浮在屏幕底部。
當(dāng)產(chǎn)品線進(jìn)行更新迭代的時(shí)候，應(yīng)該保留用戶既有的交互和操作習(xí)慣，用戶在上一個(gè)版本形成的交互認(rèn)知在下一個(gè)版本是否能被沿用，這對(duì)于用戶來說在產(chǎn)品體驗(yàn)上會(huì)造成很大的干擾。
比如微信的多年的迭代，底部tab功能一直都是這樣，主要功能入口一致沒有變化，就體現(xiàn)了迭代產(chǎn)品的一致性。
Office軟件中包含的各個(gè)產(chǎn)品，其界面布局和設(shè)計(jì)風(fēng)格都保持了高度一致，如下圖所示是PowerPoint和Word的界面，可以看出，二者的“插入”一級(jí)菜單下所包含功能的排列順序、布局方式乃至圖標(biāo)圖形，都是高度類似的。
遵循統(tǒng)一的產(chǎn)品設(shè)計(jì)規(guī)范／邏輯。這里的一致性包含產(chǎn)品和跨平臺(tái)產(chǎn)品之間的一致性。確保整個(gè)系統(tǒng)的結(jié)構(gòu)一致性、色彩一致性、操作一致性、反饋一致性、同種組件樣式保持一致等設(shè)計(jì)語言都遵循同一套設(shè)計(jì)規(guī)則。
比如，產(chǎn)品內(nèi)相同顏色的反復(fù)出現(xiàn)，為產(chǎn)品打造視覺錘符號(hào)，強(qiáng)化產(chǎn)品在用戶心中的記憶點(diǎn)。符合平臺(tái)設(shè)計(jì)規(guī)范，
蘋果系統(tǒng)參照人機(jī)交互設(shè)計(jì)指南設(shè)計(jì)規(guī)范，安卓系統(tǒng)參照Material Design設(shè)計(jì)規(guī)范，或者直接參照自己團(tuán)隊(duì)的的設(shè)計(jì)規(guī)范，應(yīng)該遵循慣例，并且保持系統(tǒng)的一致感，不要盲目地標(biāo)新立異。
不知道你發(fā)現(xiàn)了沒，現(xiàn)在的電商、音樂、社交等等app越來越一樣了，一樣的交互，一樣的排版設(shè)計(jì)，基本上都遵循著類似的交互邏輯和視覺元素。
與業(yè)內(nèi)產(chǎn)品保持一致，意味著用戶不再需要重新學(xué)習(xí)，就可以在各種應(yīng)用中自由切換，用戶學(xué)習(xí)成本的降低，也意味著我們獲客成本從某種程度上被降低。而這些約定俗成的規(guī)則和流程都被用戶不自覺地印刻在大腦中，成為一種自然的習(xí)慣，而獨(dú)特的設(shè)計(jì)，截然不同的規(guī)則，則常常會(huì)成為習(xí)慣以外的東西，引起混亂，讓初次上手的用戶感到受挫和沮喪。
如，在App底部的導(dǎo)航圖標(biāo)中，“首頁”永遠(yuǎn)排在第一個(gè)，個(gè)人中心（“我的”）永遠(yuǎn)排在最后。并且對(duì)于類似“首頁”“購物車”“訂單”等常見按鈕，不同App的設(shè)計(jì)樣式都非常相似。如下圖三個(gè)不同音樂app的對(duì)比圖：
如果你特立獨(dú)行地把個(gè)人中心放在第一個(gè)位置，或者采用奇怪的圖標(biāo)作為個(gè)人中心的icon，用戶使用時(shí)肯定會(huì)覺得別扭。
防錯(cuò)原則的根本目標(biāo)是阻止錯(cuò)誤行為，避免進(jìn)一步犯錯(cuò)，指引用戶正確的完成操作行為。
「防止錯(cuò)誤」主要分為三個(gè)階段：錯(cuò)誤行動(dòng)發(fā)生前，引導(dǎo)用戶向正確的方向前進(jìn)；用戶觸碰到危險(xiǎn)操作時(shí)給予提示；危險(xiǎn)操作發(fā)生之后，提供撤回的入口。
比一個(gè)優(yōu)秀的錯(cuò)誤提醒彈窗更好的設(shè)計(jì)方式，是在這個(gè)錯(cuò)誤發(fā)生之前就避免它。它可以幫助用戶排除一些容易出錯(cuò)的情況，或在用戶提交之前給他一個(gè)確認(rèn)的選項(xiàng)。
通常情況下，按鈕置灰表示對(duì)應(yīng)功能或操作無法使用，這也是防止錯(cuò)誤的一條有效途徑，因?yàn)橛脩敉ㄟ^按鈕樣式就可獲知其狀態(tài)，提前規(guī)避無效的提交操作。當(dāng)然，不是只要功能或操作無法使用時(shí)，就應(yīng)該將對(duì)應(yīng)的按鈕置灰。其實(shí)更好的做法是填寫完標(biāo)題后按鈕不置灰，點(diǎn)擊完成按鈕后定位或高亮必填項(xiàng)，讓用戶更容易識(shí)別錯(cuò)誤點(diǎn)。
比如在登錄時(shí)，只有輸出信息后才可以點(diǎn)擊登錄按鈕，未輸入信息時(shí)，按鈕是不可以點(diǎn)擊的狀態(tài)。通過系統(tǒng)主動(dòng)對(duì)用戶進(jìn)行操作限制，幫助用戶避免發(fā)生錯(cuò)誤。
限制用戶的選擇并不是一個(gè)好主意，但是如果有明確的規(guī)則來定義可接受的選項(xiàng)，那么限制用戶可以輸入的類型是一個(gè)很好的策略。再比如輸入驗(yàn)證碼頁面，為了防止用戶多輸入或者少輸入驗(yàn)證碼，只給到四個(gè)輸入框，讓用戶只能輸入四位數(shù)字，減少輸入錯(cuò)誤的幾率。
提供清晰的提示，防止用戶犯錯(cuò)，提示包括標(biāo)簽、文字、顏色、以及反饋狀態(tài)等。利用顏色，動(dòng)效提供警示信息，比如常見的微信退出的按鈕是紅色的，狀態(tài)未完成的標(biāo)簽是紅色的等等。
如：表單填寫過程中讓用戶及時(shí)知道輸入格式，出錯(cuò)原因，避免填寫完成后再提醒，浪費(fèi)用戶時(shí)間。
范圍限制：限制用戶的選擇并不是一個(gè)好主意，但是如果有明確的規(guī)則來定義可接受的選項(xiàng)，那么限制用戶可以輸入的類型是一個(gè)很好的策略。比如：電影購票時(shí)，已購買的位子不會(huì)再提供選擇，很好的避免了買重的問題
特別要注意在用戶操作具有毀滅性結(jié)果的功能時(shí)要有提示，防止用戶犯不可挽回的錯(cuò)誤，需打斷用戶，提示用戶是否要進(jìn)行此操作，讓用戶有更多的思考時(shí)間。所以在一些不可逆的操作中二次確認(rèn)是非常有必要的。
這條原則很重要也很常見。在刪除信息時(shí)，系統(tǒng)會(huì)讓用戶確認(rèn)刪除，也就是我們常說的二次確認(rèn)，電商平臺(tái)允許在一定的規(guī)則下取消訂單等等。
易取原則的根本目標(biāo)是提升用戶在界面上的操作效率，系統(tǒng)應(yīng)直觀地協(xié)助用戶完成任務(wù)。
系統(tǒng)應(yīng)協(xié)助用戶進(jìn)行記憶，通過使元素、操作和選項(xiàng)可見，減少用戶的記憶負(fù)荷，在適合的時(shí)機(jī)給用戶需要獲取的信息。
識(shí)別比回憶要好，對(duì)于路徑較長的操作，我們更應(yīng)該協(xié)助用戶記憶。比如在淘寶下單的操作路徑，每一個(gè)頁面頂部導(dǎo)航欄會(huì)盡可能的提醒用戶操作到哪里，用戶所有的操作信息都是可見、易獲取的，減少用戶對(duì)操作目標(biāo)的記憶負(fù)擔(dān)。
用戶心理學(xué)研究發(fā)現(xiàn)，互聯(lián)網(wǎng)用戶瀏覽網(wǎng)頁的動(dòng)作不是讀，不是看，而是“掃”。這是互聯(lián)網(wǎng)用戶瀏覽的主要方式。所以我們?cè)谠O(shè)計(jì)的時(shí)候，需要清晰的視覺層次結(jié)構(gòu)，突出重點(diǎn)，弱化和剔除無關(guān)信息，降低頁面干擾，來減輕用戶閱讀成本。
比起讓用戶輸入，讓用戶選擇更能降低用戶的記憶成本，更好地輔助用戶做決策。如果，有很多的信息或者選項(xiàng)是用戶高頻率會(huì)選擇的，設(shè)計(jì)師不妨給用戶提前做好選擇，提供默認(rèn)選項(xiàng)，如下圖：
通過智能讀取用戶之前填寫過的信息，或者智能識(shí)別等形式，減少用戶記憶負(fù)擔(dān)與操作負(fù)擔(dān)。
常見的是寄快遞-新增地址，將用戶復(fù)制的文本字符類型進(jìn)行識(shí)別并匹配，將有用的信息內(nèi)容提取出來，對(duì)體驗(yàn)而言顯得高效又智能。
或者淘寶購物確認(rèn)訂單時(shí)，系統(tǒng)會(huì)自動(dòng)為你帶入之前的商品信息，包括選擇的商品規(guī)則、數(shù)量、價(jià)格、默認(rèn)記錄顯示常用的地址等。這些信息雖然之前都選擇過，但是需要用戶在購買前二次確認(rèn)，由于信息比較多，用戶很難記憶，所以確認(rèn)訂單再展示出來更加合理。
比如：用手機(jī)登錄時(shí)，收到的驗(yàn)證碼直接展示在軟鍵盤上，用戶無需記憶也無需輸入，直接點(diǎn)選即可登錄；
美團(tuán)APP中，當(dāng)用戶選擇商品時(shí)，系統(tǒng)會(huì)自動(dòng)計(jì)算商品價(jià)格和滿減后的價(jià)格，還會(huì)幫用戶記錄選擇了哪些商品以及份數(shù)，不需要用戶自己花時(shí)間去計(jì)算還差多少才能滿減等，減少用戶記憶負(fù)擔(dān)，同時(shí)節(jié)省用戶點(diǎn)外賣的時(shí)間，這也用到了易取原則。
訂單頁面若某信息需要用戶從一個(gè)頁面復(fù)制到另一個(gè)頁面完成查詢或編輯輸入，那就有必要為該信息提供快捷復(fù)制功能，如訂單號(hào)緊跟著一個(gè)復(fù)制按鈕。
我們?cè)谒阉饕粋€(gè)歌名的時(shí)候，記不住完整的歌曲名，我們只要輸入關(guān)鍵的幾個(gè)詞，系統(tǒng)就是幫助我們記憶，出現(xiàn)相關(guān)的搜索。
作為用戶，你不記得的操作，系統(tǒng)可以幫你記錄。為用戶提供歷史記錄，文本創(chuàng)作的過程中自動(dòng)保存草稿，讓用戶方便查詢自己的進(jìn)程，這就是信息易取原則的設(shè)計(jì)。
保留歷史，最為常見的就是為用戶保留歷史搜索和歷史瀏覽、儲(chǔ)存賬號(hào)和密碼。視頻APP會(huì)詳細(xì)記錄用戶的觀看記錄，當(dāng)用戶沒有看完某部電影時(shí)，下次進(jìn)入直接從斷點(diǎn)續(xù)播上次播放的位置，無需用戶記憶上次看到哪里了；
不只是觀看記錄，視頻軟件還會(huì)幫你記錄同一賬號(hào)在不同設(shè)備上的登錄記錄，觀看記錄也會(huì)在不同設(shè)備之間進(jìn)行同步。
將選擇的對(duì)象，動(dòng)作，選項(xiàng)可視化，讓用戶一看就懂。注意圖標(biāo)符號(hào)化能讓人理解，避免引起誤解。
抽象圖形+文字，提供了更多的信息，更加豐富了記憶效果，避免了用戶需要記憶才能想起圖形代表的含義。我們常用的app導(dǎo)航欄都是以這種icon和文字相結(jié)合的形式，這就是很符合易取原則的例子。
在用戶使用產(chǎn)品的過程中，會(huì)有一些需要用戶記憶的內(nèi)容、或者操作路徑，在設(shè)計(jì)的時(shí)候我們要避免用戶記憶，把信息直接提取出來，送到用戶手里。同時(shí)每個(gè)頁面?zhèn)鬟f的信息量盡量少，減少用戶的閱讀壓力。
常見的例子是各類優(yōu)惠券，設(shè)計(jì)的時(shí)候會(huì)有明確的位置說明限制時(shí)間，類別等等，同時(shí)還會(huì)有清晰的入口引導(dǎo)去使用或者規(guī)則的入口。
這一點(diǎn)其實(shí)也非常好理解，一個(gè)簡單的動(dòng)作，比打字要輕松得多，常見的就是在設(shè)備解鎖的時(shí)候，用手勢(shì)解鎖替代密碼解鎖。
隨著技術(shù)發(fā)展，有了更多的行為代替輸入的方式，比如指紋識(shí)別和面部識(shí)別，用簡單的操作，就可以達(dá)到進(jìn)入系統(tǒng)的目的，這就避免了用戶需要較多的操作和密碼的記憶。
靈活易用原則不僅是一個(gè)交互設(shè)計(jì)原則，也代表了一種軟件產(chǎn)品設(shè)計(jì)理念：系統(tǒng)既要做得簡單、易用，讓所有用戶用起來得心應(yīng)手；
靈活易用原則的根本目標(biāo)是保持系統(tǒng)的靈活性，以滿足不同用戶的不同需求。既要提供必要的幫助，讓剛?cè)腴T的初級(jí)用戶順利上手，還需要支持靈活的個(gè)性化定制，讓高級(jí)用戶能夠快捷高效使用高頻功能，充分發(fā)揮其價(jià)值。
讓用戶靈活定制的最典型的例子是各類軟件和App的配置功能，基本上所有軟件都會(huì)提供定制化功能，從快捷鍵設(shè)置，到頁面布局，再到自定義參數(shù)，軟件系統(tǒng)會(huì)盡量提供全面的個(gè)性化設(shè)置功能，來滿足不同用戶的使用訴求和習(xí)慣，提升用戶的使用效率和體驗(yàn)。
例如支付寶首頁，用戶可以自定義首頁的應(yīng)用。對(duì)于使用頻率比較高的老用戶來說，這是一個(gè)非常方便的功能。
還有一種是系統(tǒng)更具用戶常用自動(dòng)整理歸納，以提升使用效率，減少用戶多余操作。
比如：微信的聊天表情，由于可以選擇的表情很多，正常情況下用戶很難快速找到自己想用的表情。而用戶的使用習(xí)慣往往是循環(huán)使用其中的某幾個(gè)，所以把最近使用的表情展現(xiàn)出來，會(huì)極大的提升用戶的尋找效率。
除了從新老用戶的角度對(duì)用戶做區(qū)分，還可以從其他維度區(qū)分用戶，針對(duì)不同用戶做不同的功能。比如：微信為了讓中老年用戶使用方便，推出了關(guān)懷模式。在關(guān)懷模式下（下圖）文字更大、色彩更強(qiáng)、按鈕更大，還可以使用“聽文字消息”的功能。這些功能充分考慮了“中老年用戶”的需求和痛點(diǎn)，讓產(chǎn)品更加靈活易用。
靈活高效原則在交互設(shè)計(jì)中使用會(huì)提高用戶使用效率，例如微信聊天頁面中，當(dāng)用戶輸入某個(gè)字詞之后，系統(tǒng)會(huì)自動(dòng)幫你匹配相應(yīng)的表情包；
當(dāng)你輸入某個(gè)詞之后，輸入法會(huì)幫你自動(dòng)聯(lián)想接下來你可能會(huì)輸入的詞；截圖后進(jìn)入微信聊天頁面后，系統(tǒng)會(huì)將你剛截的圖前置，它會(huì)自動(dòng)判斷你可能想發(fā)送該截圖。如下圖：
通過用戶快捷跳過的入口，比如常見的：引導(dǎo)頁、操作手冊(cè)、還是開屏廣告，有“跳過”或者”立即進(jìn)入“按鈕真的很貼心。
對(duì)于用戶頻繁使用的部分，提供快捷的重復(fù)使用操作，比如：外賣app，用戶可以快捷地再來一單，同時(shí)保存上一次操作記錄。
在設(shè)計(jì)功能時(shí)，最好能考慮到不同層次用戶的需求，以此來讓用戶「各取所需」（需要平臺(tái)有多類型用戶）；比如常見的Word、Photoshop等，有一個(gè)“二八定律”，就是說80%的功能是給20%的用戶使用的。
設(shè)計(jì)這類產(chǎn)品時(shí)，最常用的20%的功能一定擺在最顯著的位置上，方便所有用戶使用，而80%的高端功能，要適度隱藏，使得整個(gè)產(chǎn)品看起來盡量簡潔、美觀。比如Sketch的工具欄和快捷鍵就是給新手或資深用戶準(zhǔn)備的。
淘寶的首頁每個(gè)人推薦的商品都不相同，淘寶后臺(tái)根據(jù)用戶的瀏覽習(xí)慣，購買/收藏記錄等大數(shù)據(jù)智能判斷用戶的喜好，對(duì)商品進(jìn)行千人千面的分發(fā)。
但是切記不要太過依賴大數(shù)據(jù)算法的判斷，因?yàn)橐坏┬纬蛇@種模式，會(huì)給用戶造成回音壁效應(yīng)，你越喜歡的東西系統(tǒng)就越給你推薦，其他的商品就像回音壁一樣被吸收過濾，用戶永遠(yuǎn)沒有辦法發(fā)現(xiàn)新的東西，讓用戶的選擇永遠(yuǎn)都在一個(gè)死循環(huán)，所以做千人千面設(shè)計(jì)時(shí)一定要適度。
優(yōu)美而簡約原則的根本目標(biāo)是讓用戶快速找到界面的重要信息，引導(dǎo)用戶的視線及操作行為。
UI設(shè)計(jì)應(yīng)該是符合大眾審美的，不需要多么酷炫，而是需要我們注重信息獲取效率，更加聚焦內(nèi)容，刪除多余的視覺表達(dá)元素，讓界面保持美觀簡約。
“快掃”是互聯(lián)網(wǎng)用戶瀏覽的主要方式。我們熟知的產(chǎn)品設(shè)計(jì)的四大基本原則：親密性、對(duì)齊、重復(fù)、對(duì)比，就是使頁面優(yōu)美而簡約的方法。
建立清晰的視覺層級(jí)，越重要的內(nèi)容越突出，能夠方便用戶無障礙地瀏覽信息，提高用戶操作與信息獲取效率，各模塊間采用卡片或者間距區(qū)分開，加強(qiáng)頁面層級(jí)區(qū)分。
我們通過顏色、大小、字體的字重、對(duì)比度、元素的間距、特殊造型、動(dòng)效等來表現(xiàn)。
避免界面呈現(xiàn)過多元素，包括動(dòng)效、配圖、icon、按鈕等等，降低用戶的視覺干擾。保留產(chǎn)品最主要的信息，如果不是優(yōu)先級(jí)最高，要盡一切可能避免去影響產(chǎn)品的簡潔和美觀，可采用大留白增加頁面呼吸感，聚焦內(nèi)容。
用戶注意力資源有限，應(yīng)該保持信息精煉，突出重要信息，弱化次要信息。
上面兩個(gè)案例通過加粗放大、標(biāo)記顏色，從而讓頁面簡潔，且突出重要信息。
容錯(cuò)原則的根本目標(biāo)是讓那個(gè)用戶在操作出錯(cuò)后還能挽回錯(cuò)誤的余地，從而給用戶一致產(chǎn)品很安全貼心的感覺。
系統(tǒng)需幫助用戶識(shí)別、診斷、并為用戶從錯(cuò)誤中恢復(fù)提出建設(shè)性的解決方案。通過提示性文字或者插圖讓用戶意識(shí)到出錯(cuò)了，比如404頁面的情感化插圖、彈窗提示用戶出錯(cuò)等。
當(dāng)發(fā)生錯(cuò)誤時(shí)，提示信息一定要直觀，視覺上能夠引起用戶注意，可視化處理，文案要簡單概要，并給出解決方案。例如刪除訂單時(shí)，會(huì)提示二次確認(rèn)，避免用戶誤操作。
在出錯(cuò)界面給出解決方案，可以是文字提醒或者按鈕跳轉(zhuǎn)等形式，幫助用戶解決問題。比如缺省頁的設(shè)計(jì)除了配置插圖還會(huì)有提示文案與操作按鈕，引導(dǎo)用戶去操作，去進(jìn)一步解決問題。
系統(tǒng)能幫助用戶自動(dòng)甄別錯(cuò)誤，并及時(shí)進(jìn)行糾正時(shí)，將會(huì)給用戶帶來極大的便利，撤銷或者找回功能，都是幫用戶把損失降到最低的有效方法。
比如微信信息的消息撤回重新編輯，相冊(cè)的最近刪除、回收站等等功能。
人性化幫助原則的根本目標(biāo)是用戶在使用產(chǎn)品的過程中有所依循，因?yàn)楫a(chǎn)品已經(jīng)貼心地為他們準(zhǔn)備好了幫助方式，或者即時(shí)提示和反饋，或者客服。
人性化幫助用戶最好的方式分別為：1、無需提示；2、一次性提示；3、常駐提示；4、幫助文檔。
最好的就是沒有提示，用戶就能看懂與應(yīng)用產(chǎn)品；其次是一次性提示，提示一次用戶就懂如何使用，比如第一次進(jìn)入app或新功能上線的引導(dǎo)設(shè)計(jì)、通常為氣泡形式。常駐提示需要一直固定在某個(gè)位置實(shí)時(shí)幫助用戶。
最后就是幫助文檔了，一般用于解釋規(guī)則或者熱點(diǎn)問題，通常以超鏈接的形式存在于頁面中，或者以集合形式位于設(shè)置頁中，此時(shí)需要注意要易于檢索。
幫助文檔的入口容易找到，幫助信息方便用戶查找。常見的方式有：鼠標(biāo)劃過懸浮文字說明，幫助用戶更好地理解。
用戶通過查看幫助文檔來學(xué)習(xí)新功能，相對(duì)比較麻煩。如果能將教程和功能放在一起，用戶可以“邊學(xué)邊練”，就更容易讓用戶理解。
提示語避免使用專業(yè)術(shù)語，盡量使用圖片或者圖形，同時(shí)處理文字外還可以使用示意圖，操作步驟等，方便用戶應(yīng)用。
在操作時(shí)的幫助信息，比如幫助懸浮按鈕：一直出現(xiàn)在頁面固定位置，方便用戶遇到問題尋求幫助。
搜索時(shí)，預(yù)搜索詞直觀地顯示出來，可以讓用戶更快地做出搜索判斷。微信轉(zhuǎn)賬頁面，當(dāng)用戶輸入金額較大時(shí)，會(huì)在第一位數(shù)字下方提示轉(zhuǎn)賬金額的人民幣單位，目的是為了避免用戶輸入錯(cuò)誤金額導(dǎo)致資金損失；
復(fù)雜的流程可以通過分步驟來引導(dǎo)用戶逐步完成，而不是一次完成所有任務(wù)。個(gè)性化的提示一次就夠了，用戶用過一次就知道其用法。
現(xiàn)在很多C端產(chǎn)品普遍做了良好的交互設(shè)計(jì)，可以幫助用戶快速學(xué)習(xí)使用，而不用閱讀、理解復(fù)雜的說明文檔。
然而，B端產(chǎn)品的復(fù)雜性比C端產(chǎn)品高很多，因?yàn)锽端產(chǎn)品蘊(yùn)含很多業(yè)務(wù)流程的規(guī)則，系統(tǒng)中的一個(gè)按鈕可能代表了一個(gè)復(fù)雜的業(yè)務(wù)處理規(guī)則，如果不了解整個(gè)業(yè)務(wù)場景和處理規(guī)則，是很難理解按鈕的操作含義的。
因此，對(duì)于B端產(chǎn)品，用戶進(jìn)行自助服務(wù)、自助操作的難度高很多，B端產(chǎn)品的幫助文檔依然有存在的必要。產(chǎn)品設(shè)計(jì)人員要盡量在前端交互上做好引導(dǎo)提示，對(duì)于復(fù)雜的規(guī)則和邏輯，可以考慮通過幫助文檔來指導(dǎo)用戶。
尼爾森十大可用性原則可靈活運(yùn)用于各個(gè)地方，可以是交互設(shè)計(jì)，也可以是界面設(shè)計(jì)，深入了解該設(shè)計(jì)原則，可以找到更好的解決方案，提高用戶的使用體驗(yàn)。要注意的是，這10項(xiàng)原則是啟發(fā)式（heuristics）的、廣泛的經(jīng)驗(yàn)法則，而不是具體的規(guī)定。
1、狀態(tài)可見原則：位置可見、數(shù)量可見、狀態(tài)可見；
2、環(huán)境貼近原則：語言應(yīng)該是用戶所能理解和習(xí)慣的；
3、用戶可控原則：可見導(dǎo)航、關(guān)閉與返回、撤銷與重做；
4、一致性原則：產(chǎn)品內(nèi)部一致、交互一致、迭代產(chǎn)品一致、同一產(chǎn)品線一致、設(shè)計(jì)語言一致、業(yè)內(nèi)產(chǎn)品一致；
5、防錯(cuò)原則：操作前預(yù)警、操作中確認(rèn)、操作后可撤回；
6、易取原則：易掃描、智能獲取、草稿箱和歷史記錄、對(duì)象可視化、選擇代替輸入；
7、靈活高效原則：靈活配置、允許頻繁操作、各取所需；
8、優(yōu)美而簡約原則：視覺層次明顯、簡約且突出重點(diǎn)信息；
9、容錯(cuò)原則：幫助用戶識(shí)別、診斷，并從錯(cuò)誤中恢復(fù)提供方法；
10、人性化幫助原則：無需提示、一次性提示、常駐提示、幫助文檔。
我準(zhǔn)備了一些常用的設(shè)計(jì)素材送給大家，需要的話免費(fèi)拿走。獲取方式：老規(guī)矩公眾號(hào)后臺(tái)，發(fā)送文字“素材”，就可以獲取了～
文中如有不嚴(yán)謹(jǐn)?shù)牡胤较Ｍ蠹医o予指正，希望大家可以多多點(diǎn)贊評(píng)論鼓勵(lì)一下，最后感謝你的耐心閱讀。
今天與大家分享的是關(guān)于B端頁面中篩選區(qū)的功能設(shè)計(jì)，本文會(huì)從篩選的展現(xiàn)形式、布局、反饋、設(shè)計(jì)中遇到的問題以及設(shè)計(jì)思考這幾個(gè)方面進(jìn)行講述。
篩選，也可以稱作過濾器，它屬于搜索框架的一部分主要用于內(nèi)容提取，將一類數(shù)據(jù)展示，同時(shí)一類數(shù)據(jù)隱藏，可以整合很多的組件。
在B端產(chǎn)品設(shè)計(jì)中，篩選區(qū)的設(shè)置便于用戶進(jìn)行數(shù)據(jù)查詢和數(shù)據(jù)定位，可以快速的按照需要對(duì)數(shù)據(jù)進(jìn)行查詢和篩選；篩選的存在對(duì)于整個(gè)表單來說是非常重要的，它可以幫助用戶在表單茫茫多的數(shù)據(jù)當(dāng)中進(jìn)行快速的數(shù)據(jù)定位；可以對(duì)表單進(jìn)行快速數(shù)據(jù)按照自己想要的方式進(jìn)行劃分，縮短用戶對(duì)于數(shù)據(jù)的尋找時(shí)間。
1、篩選區(qū)的展現(xiàn)形式有哪些？
篩選區(qū)常見到的有搜索、條件篩選這兩類控件。搜索和篩選雖然同在篩選區(qū)，但是二者還是有所差異的。
通過百度百科我們可以了解到：
搜索，意思指仔細(xì)查找，搜尋。
篩選，篩選是利用篩子使物料中小于篩孔的細(xì)粒物料透過篩面，而大于篩孔的粗粒物料滯留在篩面上，從而完成粗、細(xì)料分離的過程。該分離過程可看作是物料分層和細(xì)粒透篩兩個(gè)階段組成的。物料分層是完成分離的條件，細(xì)粒適篩是分離的目的。
在B端系統(tǒng)界面設(shè)計(jì)中，搜索是通過指定任意條件，系統(tǒng)對(duì)此條件進(jìn)行的檢索后，展示相對(duì)應(yīng)內(nèi)容，功能偏主動(dòng)性；篩選是系統(tǒng)提供指定各種條件縮小范圍，可以選擇查找不同條件的內(nèi)容，功能偏被動(dòng)性。
無論被動(dòng)性還是主動(dòng)性，搜索和篩選這倆個(gè)功能都是讓用戶使用某個(gè)條件對(duì)內(nèi)容進(jìn)行區(qū)分，從而找到用戶想要的內(nèi)容。二者在功能上相輔相成，在B端系統(tǒng)的頁面中僅靠搜索或者篩選作為內(nèi)容篩選都是不夠的，這就需要組合篩選區(qū)了。
1.1搜索篩選
精確搜索
優(yōu)點(diǎn)：搜索準(zhǔn)確率高，所要即所得。
缺點(diǎn)：需要用戶自己輸入，然后進(jìn)行查詢。需要記憶搜索詳細(xì)信息。輸入框需要有提示輸入的內(nèi)容，方便用戶填寫，以及確認(rèn)輸入的類別或格式。
適用場景：適用于用戶有清晰的目標(biāo)，同時(shí)需要有查詢/搜索按鈕，來執(zhí)行篩選。搜索需要配合篩選固有類一起使用。
模糊搜索
優(yōu)點(diǎn)：模糊搜索可以用于搜索關(guān)鍵字的同義詞，提高搜索的精確性。字段匹配推薦搜索結(jié)果，減少記憶負(fù)擔(dān)，適用于不明確的信息篩選。
缺點(diǎn)：篩選出很多類似相關(guān)的內(nèi)容，需要查找鑒別所要內(nèi)容，不便捷。
適用場景：用戶對(duì)目標(biāo)模糊，模糊是指不用關(guān)心輸入了什么格式，哪怕錯(cuò)了，系統(tǒng)也會(huì)推薦給用戶相對(duì)正確的；用戶需要瀏覽操作過濾器提供的信息來輔助篩選達(dá)到目標(biāo)。搜索需要配合篩選固有類一起使用。
搜索的設(shè)計(jì)原則
關(guān)于搜索，幾乎沒有人不知道，哪怕是不從事設(shè)計(jì)、產(chǎn)品的人，他們也知道。同時(shí)每一個(gè)產(chǎn)品，隨著規(guī)模變大，搜索一定必不可少。那么如何設(shè)計(jì)好搜索呢？有哪些原則可以借鑒，總結(jié)了以下4個(gè)方面。
漸進(jìn)呈現(xiàn)
在我們?cè)O(shè)計(jì)搜索時(shí)，可以考慮漸進(jìn)呈現(xiàn)的方式。這是指搜索結(jié)果不要一股腦兒都塞給用戶，而是使用逐步擴(kuò)大的方式，讓用戶慢慢進(jìn)入目標(biāo)。但這里要注意，漸進(jìn)的層級(jí)不要太深，漸進(jìn)的內(nèi)容要做到足夠?yàn)橛脩糁搿?/span>
結(jié)構(gòu)化
結(jié)構(gòu)化是指搜索結(jié)果呈現(xiàn)的形式要有歸納和整理的意圖，不能反饋給用戶的是沒有層次的內(nèi)容。簡單來說，分類就是結(jié)構(gòu)化呈現(xiàn)的體現(xiàn)，內(nèi)容結(jié)構(gòu)化后用戶查找和定位才會(huì)更快速。
可操作
對(duì)于搜索結(jié)果，我們可以給予操作選擇，例如收藏、分享等，這將會(huì)大大提升用戶與搜索結(jié)果之間的后續(xù)聯(lián)系。
可操作性是最佳優(yōu)先的好伙伴。同時(shí)給搜索結(jié)果添加使用類操作，這會(huì)讓用戶專注于目標(biāo)。
可保存
無論搜索任何內(nèi)容，用戶都有權(quán)保存自己常用的搜索結(jié)果，保證用戶后續(xù)無需重復(fù)搜索。這點(diǎn)上已經(jīng)有很多C端產(chǎn)品做的很好了，我們?cè)贐端產(chǎn)品上也可以考慮起來。
1.2條件篩選
下拉篩選
優(yōu)點(diǎn)：頁面的空間利用率高，同時(shí)下拉起到了很好的收納作用，不占據(jù)頁面空間。
缺點(diǎn)：由于下拉的局限性無法觀看到所有的篩選字段，需要操作點(diǎn)擊查看。
適用場景：下拉的篩選字段選項(xiàng)有限，可以明確的總結(jié)分類時(shí)，一般采用固定選項(xiàng)類。這種操作起來便捷，降低用戶的操作難度。一般情況下需要“搜索/查詢”按鈕，但是也有的產(chǎn)品是勾選即執(zhí)行的。主要需要結(jié)合具體的使用場景去判定。
矩陣(平鋪)篩選
優(yōu)點(diǎn)：用戶可以直接看到篩選內(nèi)容，支持輸入更多篩選條件，減少操作步驟提高了用戶篩選的效率。
缺點(diǎn)：平鋪的篩選類目占據(jù)頁面空間較大，空間利用率低，信息量過多都是重點(diǎn)等于沒有重點(diǎn)，增加用戶的決策時(shí)間，不適合選項(xiàng)太多的情況。
適用場景：平鋪篩選控件的普適性為最強(qiáng)，當(dāng)沒有其他更好想法時(shí)，用平鋪總是一個(gè)好的選擇。需要注意的是，篩選條件不要過多（遵循7±2 法則）。
注意事項(xiàng)：
當(dāng)確實(shí)需要支持大量的篩選條件時(shí)，有兩種解決方案可供參考
1、用戶自行配置篩選條件：對(duì)用戶來說，單次篩選會(huì)用到的條件是有限的；通過可配置的篩選條件，實(shí)現(xiàn)檢索效率和信息噪音的平衡，對(duì)于用戶自定義項(xiàng)的體驗(yàn)與應(yīng)用都有更好的支持。
2、 隱藏低頻的篩選條件：這種方法需要對(duì)用戶需求有明確的把握，哪些篩選條件是高頻、哪些是低頻需要有明確的分界，優(yōu)點(diǎn)是第一次使用時(shí)用戶能更快上手。
表頭篩選
優(yōu)點(diǎn)：通過表頭的點(diǎn)擊，簡潔、直觀的篩選當(dāng)前表格列。
缺點(diǎn)：只能篩選當(dāng)前列的內(nèi)容，篩選字段比較少，篩選形式比較單一。每個(gè)表頭都會(huì)有篩選的icon，影響用戶對(duì)于表頭的識(shí)別。表頭篩選學(xué)習(xí)成本最高，且和表頭排序容易沖突，篩選值展示也不夠直觀。
適用場景：表頭篩選類似Excel表格的操作，是一種相對(duì)高級(jí)的交互，適合表格列比較單一內(nèi)容的篩選。
注意事項(xiàng)：
一般來說不推薦使用，僅建議在以下幾種情況考慮使用
1、空間是在有限或者表格非常靈活；
2、用戶可能對(duì)每一列都有篩選需求（如數(shù)據(jù)報(bào)表、Excel）；
3、產(chǎn)品規(guī)劃時(shí)對(duì)于用戶篩選需求不夠明確，也可通過這種模式先采集數(shù)據(jù)，分析其使用頻次，對(duì)后期的界面優(yōu)化進(jìn)行指導(dǎo)。
TAB標(biāo)簽
優(yōu)點(diǎn)：篩選條件一目了然，交互步驟少，一個(gè)Tab標(biāo)簽代表一個(gè)緯度，平鋪展示篩選內(nèi)容方便識(shí)別，學(xué)習(xí)成本低。
缺點(diǎn)：Tab標(biāo)簽篩選字段數(shù)量有限制，不宜過多，分類需覆蓋選項(xiàng)，并且保證每一項(xiàng)沒有交集，空間占用多、不夠靈活，對(duì)用戶自定義項(xiàng)支持較差。
適用場景：Tab標(biāo)簽切換一般用于和時(shí)間、狀態(tài)的流轉(zhuǎn)有關(guān)，且沒有交集的數(shù)據(jù)內(nèi)容（可以是同性質(zhì)，也可以是不同性質(zhì)）。權(quán)重高，選項(xiàng)值不超過5個(gè)。
1.3組合篩選
在B端系統(tǒng)表格類頁面中，字段屬性很多，簡單的檢索方式很難準(zhǔn)確定位到目標(biāo)數(shù)據(jù)，所以在實(shí)際使用當(dāng)中，常會(huì)將大量非交叉關(guān)系的屬性進(jìn)行羅列，搜索、篩選、TAB標(biāo)簽切換組合出現(xiàn)，形成多屬性的組合檢索。而篩選項(xiàng)互相組合，其展示方式有如下幾種：
平鋪式
平鋪式是將所有篩選項(xiàng)羅列出來平鋪在頁面上，可以兼容多種數(shù)據(jù)格式比如數(shù)字、文本、標(biāo)簽、枚舉值、布爾值等，包含但不限于日期選擇期、標(biāo)簽切換、單選框、復(fù)選框等多種控件。
優(yōu)點(diǎn)：用戶能直接看到選項(xiàng)內(nèi)容，方便用戶識(shí)別選項(xiàng)，且提高了用戶篩選的效率（節(jié)省了篩選操作），大而全的篩選字段最大限度避免篩選條件遺漏的問題。
缺點(diǎn)：篩選項(xiàng)多會(huì)占據(jù)大量頁面空間，信息量過多都是重點(diǎn)等于沒有重點(diǎn)，增加用戶的決策時(shí)間，不利于表格數(shù)據(jù)的直觀展示，此類型一般配合“勾選即執(zhí)行”使用。
適用場景：普適性為最強(qiáng)，當(dāng)沒有其他更好想法時(shí)，用平鋪總是一個(gè)好的選擇。適用于從各個(gè)緯度篩選的場景，多維度篩選對(duì)信息篩選的顆粒度需求不一致，同時(shí)希望備選項(xiàng)被選中。
折疊式
折疊式篩選是平鋪式篩選的改進(jìn)，一種簡單直接的篩選形式，對(duì)平鋪的篩選項(xiàng)進(jìn)行收納，如果多屬性組合檢索中的一部分檢索條件不是高頻率使用的，但又是必須存在的，可以通過折疊的方式將這部分篩選字段隱藏起來，高頻篩選字段外露。
優(yōu)點(diǎn)：高頻篩條件可優(yōu)先快速篩選、一定程度上減少用戶的認(rèn)知負(fù)荷，同時(shí)占用空間較小。
缺點(diǎn)：不好劃分不同用戶的高頻篩選項(xiàng)，當(dāng)高頻篩選項(xiàng)過多時(shí)，頁面同樣會(huì)出現(xiàn)信息冗雜、空間占比大等問題。
適用場景：折疊低頻篩選，顯示高頻篩選，能滿足大多場景下不占用太多空間。針對(duì)有更多篩選需求的用戶也有更好的引導(dǎo)性。
從位置上來說，組合篩選一般有如下幾種常見類型：上下布局水平篩選區(qū)、左右布局的垂直側(cè)邊篩選區(qū)、 內(nèi)嵌的的表頭篩選區(qū)。
上下布局水平篩選區(qū)
最常用的上下布局，篩選區(qū)放置在表格頁面的上方，方便用戶識(shí)別選項(xiàng)，提高了用戶篩選的效率，明確哪些數(shù)據(jù)是用戶所需的。上下布局的篩選區(qū)也方便用戶進(jìn)行閱讀，對(duì)于那些由不同數(shù)據(jù)結(jié)構(gòu)組成的頁面，是一個(gè)很好的選擇。
上下布局的篩選區(qū)的可擴(kuò)展性差，當(dāng)篩選項(xiàng)目少于五個(gè)的情況下，最常使用的就是上下布局，而當(dāng)篩選項(xiàng)目多的時(shí)候，會(huì)占據(jù)大量頁面空間，內(nèi)容在較多時(shí)，推薦增加收起功能，這樣保證篩選整體面積不會(huì)很大，提升屏效比。
左右布局的垂直側(cè)邊篩選區(qū)
左右布局的篩選區(qū)一般是以字段選擇進(jìn)行篩選，篩選區(qū)的位置較固定，不會(huì)因?yàn)楹Y選項(xiàng)過多而影響頁面中主要內(nèi)容的位置，可擴(kuò)展性強(qiáng)，可在收起部分嵌套更多的字段值。
左右布局的好處就是能夠?qū)⒑Y選的所有條件都直接的展示出來，可以適應(yīng)很多場景，但是這種類型篩選器可以影響整個(gè)頁面。我們需要確保頁面上的每個(gè)元素都有效地受到篩選的影響，避免造成混亂。
內(nèi)嵌的表頭篩選區(qū)
表頭篩選是一種復(fù)雜的篩選形式，常見于列表中，是一種列表內(nèi)置篩選形式，適合表格列比較單一內(nèi)容的篩選，其最開始是源于Excel的篩選形式，點(diǎn)擊表單的篩選按鈕，可以將表頭的篩選字段直接帶入，方便用戶。
篩選區(qū)有兩種不同的反饋模式：數(shù)據(jù)實(shí)時(shí)更新反饋和數(shù)據(jù)手動(dòng)更新反饋。
數(shù)據(jù)實(shí)時(shí)更新反饋
界面將與所有設(shè)置的篩選相匹配并對(duì)結(jié)果進(jìn)行實(shí)時(shí)更新。
這種模式的優(yōu)點(diǎn)是在執(zhí)行篩選時(shí)為用戶提供了一種方便簡單的體驗(yàn)，可以在每次點(diǎn)擊后立即看到結(jié)果。適用于較低風(fēng)險(xiǎn)的交互，一旦處理多選過濾器或更復(fù)雜的輸入時(shí)可能會(huì)造成混亂。當(dāng)然還需要考慮處理數(shù)據(jù)的多少，如果應(yīng)用中數(shù)據(jù)量巨大，每次更新時(shí)間較長，反而會(huì)降低用戶的使用效率。
手動(dòng)更新反饋
在手動(dòng)更新反饋模式下，過濾結(jié)果只有在用戶點(diǎn)擊查詢時(shí)才會(huì)更新。如果用戶想在每次更改后查看結(jié)果，必須單擊查詢按鈕。
這種模式適合多緯度復(fù)雜的篩選，所有篩選字段設(shè)置完畢之后，統(tǒng)一執(zhí)行操作，和實(shí)時(shí)反饋結(jié)果相比降低篩選等待時(shí)間，尤其是在大量數(shù)據(jù)進(jìn)行篩選中，優(yōu)化了用戶體驗(yàn)。
什么情況不適合用篩選？
選用篩選組件的前提是信息能被清晰分類。如用戶ID/電話號(hào)碼，注冊(cè)用戶郵箱這種無明顯規(guī)則的就不適合用篩選組件去查找，用搜索會(huì)更好。
篩選分類條件有什么要求？
一是分類需符合大眾認(rèn)知的條件。如：按照年月日的認(rèn)知來選擇，地理位置按照省市區(qū)街道…
二是要求篩選類目的分類要合理、避免晦澀難懂的文案。這決定了用戶使用篩選功能的時(shí)候是否清晰無困惑。
高頻篩選操作怎么樣方便用戶操作？
首先高頻篩選操作不是產(chǎn)研團(tuán)隊(duì)自己主觀臆斷出來的，需要有數(shù)據(jù)支撐。很多產(chǎn)品為了滿足用戶快捷操作，會(huì)在篩選區(qū)幫用戶集成常用的快捷操作入口。比如很多電商產(chǎn)品的新品、包郵等快捷篩選。根據(jù)不同產(chǎn)品用戶習(xí)慣下操作整理出快捷操作入口能提高用戶體驗(yàn)方便度。
篩選和搜索的區(qū)別？
主要區(qū)別在于用戶對(duì)目標(biāo)的清晰度不同，需要選用不同組件功能來達(dá)到其目的。
在B端系統(tǒng)界面設(shè)計(jì)中，搜索是通過指定任意條件，系統(tǒng)對(duì)此條件進(jìn)行的檢索后，展示相對(duì)應(yīng)內(nèi)容；篩選是系統(tǒng)提供指定各種條件縮小范圍，可以選擇查找不同條件的內(nèi)容。
搜索和篩選都是讓用戶使用某個(gè)條件對(duì)內(nèi)容進(jìn)行區(qū)分，從而找到用戶想要的內(nèi)容。
在設(shè)計(jì)組合篩選的時(shí)候，篩選區(qū)的設(shè)計(jì)需要根據(jù)業(yè)務(wù)實(shí)際情況進(jìn)行設(shè)計(jì)，考慮每個(gè)篩選字段和業(yè)務(wù)場景，來安排合理的篩選展示方式。
那么到底什么情況下使用何種篩選模式？我們?cè)谠O(shè)計(jì)篩選的時(shí)候可以如何思考？顯然，使用頻率和界面空間是兩個(gè)非常重要的評(píng)判維度。除此之外，我們還可以以可見性、系統(tǒng)性能和用戶認(rèn)知等維度去深入思考，下面將逐一分析。
頻率
使用頻率是界面設(shè)計(jì)的一個(gè)重要考量因素，我們通常都會(huì)把高頻使用的功能放在顯眼且容易操作的位置。同理，對(duì)于篩選模式，我們也會(huì)依據(jù)篩選條件的高低頻進(jìn)行設(shè)計(jì)。頻率除了影響使用什么模式外，還會(huì)影響篩選條件及篩選項(xiàng)的排列順序，這里就不多敘述了。
界面空間
一些界面模式的出現(xiàn)就為了應(yīng)對(duì)界面空間不足的情況。而我們基于有限的界面空間選擇合適的篩選模式是件再正常不過的事。
可見性太弱，當(dāng)篩選條件都被收納在一個(gè)個(gè)小小的入口按鈕時(shí)，它的可見性也會(huì)隨之降低，尤其在PC端，一個(gè)大屏幕下更難發(fā)現(xiàn)。
可見性
既然說到可見性，不妨展開講講。可見性是一項(xiàng)重要的設(shè)計(jì)原則之一。一個(gè)明顯的道理是，可見總比不可見好，但由于界面空間限制，我們不得不取舍。那么如何取舍才能保證可用性仍然友好？
針對(duì)篩選模式的可見性，我們可以分三個(gè)要點(diǎn)去考慮：
1、篩選條件本身的可見性：
用戶越難發(fā)現(xiàn)，即可見性越低。通常，我們都可以以使用頻率來決定篩選條件的可見程度。但有時(shí)候也會(huì)失效，因?yàn)檎缟衔乃峒埃搅撕Y選這一步通常是顆粒度比較細(xì)的分類，否則我們可以用導(dǎo)航解決。但顆粒度越細(xì)，用戶對(duì)信息的需求就越不一致。比如，挑一件衣服，有人希望按品牌篩選，有人希望按價(jià)格，有人希望按顏色，我們很難判斷哪個(gè)頻率更高。面對(duì)這種情況，只能將所有的篩選條件平鋪出來供用戶選擇。例如，淘寶天貓等電商產(chǎn)品往往會(huì)使用矩陣式的篩選，而一些數(shù)據(jù)格式更多樣的B端產(chǎn)品則直接使用輸入式的篩選。
2、篩選項(xiàng)的可見性：
篩選項(xiàng)的可見性同樣影響模式的選擇。頁簽式和矩陣式篩選的可見性比下拉式更高，因?yàn)橛脩艨梢灾苯涌吹胶Y選項(xiàng)。但篩選項(xiàng)一定要讓用戶看見嗎？對(duì)于這個(gè)問題，可直接以篩選項(xiàng)的多少去決策（少則可見，多則不可見），比如一些B端產(chǎn)品，如果將備選項(xiàng)都全平鋪出來可能一個(gè)屏幕都放不下，所以只能將所有篩選項(xiàng)收起。但這是一種極端的情況，缺乏說服力。
用戶對(duì)備選項(xiàng)是否足夠熟悉？比如對(duì)于一個(gè)尺碼的下拉框，我很清楚自己能選擇什么，但對(duì)于一個(gè)衣服風(fēng)格的下拉框，由于我對(duì)風(fēng)格不熟悉，不能預(yù)判這個(gè)篩選條件能起什么作用，很可能會(huì)將其忽略。
3、選中項(xiàng)的可見性：
選中項(xiàng)的可見性，即當(dāng)我選中某幾項(xiàng)后再次查看選中項(xiàng)的難易程度。
性能
數(shù)據(jù)量大才需要篩選，而數(shù)據(jù)量大必然會(huì)有性能問題。在不同場景下，用戶會(huì)發(fā)生不同的行為，對(duì)性能的要求也會(huì)不一樣。我們能經(jīng)常發(fā)現(xiàn)一些篩選模式會(huì)帶有“確認(rèn)”按鈕，當(dāng)用戶設(shè)置完篩選條件后不會(huì)即時(shí)刷新，而需點(diǎn)擊按鈕才能觸發(fā)。而有的篩選模式則沒有“確認(rèn)”按鈕。這分別對(duì)應(yīng)著兩種不同的場景。
第一種場景，如B端產(chǎn)品中的查詢報(bào)表場景。我需要找出符合條件A、B、C的所有信息，并進(jìn)行對(duì)比分析，那么我就會(huì)設(shè)置篩選條件A、B、C后一并篩選出來，這種情況是一步到位的，我不需要再額外添加條件D或E，所以有“確認(rèn)”按鈕的篩選模式更符合此場景。反而即時(shí)刷新會(huì)在我設(shè)置篩選條件時(shí)造成干擾。
另外一種場景，常見于B端產(chǎn)品中的查詢列表場景。如果我想找到信息α，通過篩選A后得出10個(gè)信息，那么憑肉眼即可找出信息α，任務(wù)結(jié)束，但如果篩選A后得出1000個(gè)信息，我可能會(huì)再添加篩選條件B、C或D，直到篩出的信息能讓我一眼分辨出信息α。換句話說，這時(shí)候我的心理模式是即時(shí)滿足的，只要信息縮窄到一定范圍我就會(huì)停止添加篩選條件，否則我會(huì)繼續(xù)添加篩選條件。所以即時(shí)刷新能更符合此場景，但與此同時(shí)就需要考慮到性能問題。
另外，我們也可從變更頻次和變更概率這兩個(gè)維度進(jìn)行思考。
變更頻次是指用戶反復(fù)使用篩選的次數(shù)，變更概率是指用戶使用篩選的可能性，一般來說，高頻次必然大概率，但大概率不一定高頻次。而這兩種情況對(duì)性能的要求是不同的。還是以報(bào)表和列表為例，在列表中，雖然很大概率會(huì)使用篩選來尋找信息，但由于用戶是即時(shí)滿足的，而且滿足即可，所以不會(huì)重復(fù)變更篩選條件。而在報(bào)表中，雖然用戶會(huì)一次性設(shè)置篩選條件，但需要分析的數(shù)據(jù)不只一種，所以會(huì)高頻更換篩選項(xiàng)，回想一下我們?nèi)シ治鲎约寒a(chǎn)品或競品的日活月活等數(shù)據(jù)時(shí)，是不是會(huì)高頻地切換數(shù)據(jù)來分析比對(duì)？所以，高頻次的篩選就會(huì)對(duì)性能有更強(qiáng)的要求，而為了避免性能問題，往往也會(huì)加上“確認(rèn)”按鈕。
用戶認(rèn)知
最難解決的其實(shí)是用戶的認(rèn)知問題，尤其在模式相對(duì)固定的當(dāng)下，讓用戶適應(yīng)并習(xí)慣新的模式并非易事。我們想出一些創(chuàng)新性的篩選模式時(shí)，不要忽略用戶的認(rèn)知。
想要了解B端C端不同，那么我們先了解B端是什么
B釋義為：Business（業(yè)務(wù)），顧名思義B端產(chǎn)品更偏重于業(yè)務(wù)，偏重于功能的使用，B端設(shè)計(jì)在更加注重對(duì)于使用者的效率，這個(gè)功能是否方便直接達(dá)到目的。B端產(chǎn)品最直接的使用者是企業(yè)或者說每個(gè)“小企業(yè)”（班級(jí)、部門團(tuán)隊(duì)等）要做的就是直接幫助他們用更低的成本使他們的效率大大提高。我們目前對(duì)于B端產(chǎn)品最簡單的理解就是疫情期間火爆的“釘釘”以及各位都熟知的“飛書”，在我們使用這兩款軟件時(shí)，我們就會(huì)發(fā)現(xiàn)這些功能好多面面俱到，“請(qǐng)假、匯報(bào)、簽到”等，不論多小的功能這兩款軟件都有，但是如果是C端的話，一些次要、點(diǎn)擊率低的功能指不定那天就消失了。單從產(chǎn)品角度來看就能看出B端與C端的區(qū)別，這些顯而易見的B端產(chǎn)品好像多了一絲冷靜但是很體貼的直男，C端就像一個(gè)花言巧語哄著你的playboy（僅舉例子區(qū)分，他們對(duì)于我們來說都是必不可少的產(chǎn)品）就像下面的自我介紹對(duì)比就能明顯的看出哪個(gè)是B端，哪個(gè)是C端。
這些通過你應(yīng)該已經(jīng)初步了解了什么是B端，那么接下來我們從更深層次的開始了解。
B端C端的不同在于哪些呢？
B端的使用者更多是企業(yè)單位，老板等，需要共同協(xié)作，比如你的上級(jí)領(lǐng)導(dǎo)千里之外就能給你派發(fā)加急任務(wù)；我們部門需要一起進(jìn)行這個(gè)需求等，這時(shí)B端產(chǎn)品的特性就體現(xiàn)了，就像現(xiàn)在經(jīng)常有人說“只要聽到“釘”的一聲”和“紅色閃電”心里就突然揪了起來。
C端的使用者在于用戶本身，通過精準(zhǔn)推送直擊用戶痛點(diǎn)，增加用戶粘性購買度等。
B端大多為辦公場景，項(xiàng)目需求、審批等
C端則較為廣泛，某寶買買買，某音看看看！
B端的價(jià)值更體現(xiàn)在我們整個(gè)團(tuán)隊(duì)的效率，這個(gè)項(xiàng)目的使用成本，；比如說我需要通過這個(gè)軟件幫助我們整個(gè)團(tuán)隊(duì)的效率提升，大家一起協(xié)作作圖、一起探討。
C端的價(jià)值體現(xiàn)在這個(gè)活動(dòng)這款產(chǎn)品怎樣使用戶更好的體驗(yàn)，在使用時(shí)很快樂的把單下了；比如我們?cè)谀澄镔徫飼r(shí)，購買完成后會(huì)獲得一張3D虛擬卡片，我們的購物體驗(yàn)之旅是不是會(huì)極其開心，這里就使用了峰終法則（如果用戶在一段體驗(yàn)的高峰處和結(jié)尾處是愉悅的，那么用戶對(duì)這段體驗(yàn)的整體感受就是愉悅的。）
B端更注重這個(gè)功能的實(shí)現(xiàn)，我在使用這個(gè)功能時(shí)是否可以更高效，更加的去節(jié)省我的使用成本，再設(shè)計(jì)時(shí)我們需要去理解整個(gè)業(yè)務(wù)邏輯、業(yè)務(wù)導(dǎo)向，介于B端產(chǎn)品比較私密，很少有公開的，所以比較設(shè)計(jì)起來難度較為提高。我們我們平常面對(duì)小伙伴B端的問題時(shí)，如果不去了解他們整個(gè)業(yè)務(wù)流程就很難客觀地去判斷，很容易對(duì)他的指點(diǎn)使他造成一次工作失誤。
C端的業(yè)務(wù)導(dǎo)向，更在于對(duì)于用戶心理、使用體驗(yàn)的拿捏，能讓用戶做到“0”成本學(xué)習(xí)，無腦上手無腦沖沖沖，就比如你搞優(yōu)惠搞了半天復(fù)雜操作做后才200-10這誰不氣？光明正大割韭菜啊。
我在資料中查閱到未來的B端的進(jìn)步就會(huì)在“B端產(chǎn)品在使用體驗(yàn)和視覺感受這兩個(gè)方面和C端產(chǎn)品接近”，B端C化其實(shí)很簡單，就是將B段專業(yè)性強(qiáng)會(huì)忽略視覺這一點(diǎn)進(jìn)行補(bǔ)充，B端產(chǎn)品也可以使自己的產(chǎn)品視覺更加富有沖擊力、3D、情感化、就像一些大廠最近的展示更多的去運(yùn)用了一些3D玻璃質(zhì)感提升B端產(chǎn)品的用戶視覺體驗(yàn)，飛書也會(huì)制作情感也會(huì)在缺省頁的時(shí)候用emoj表情對(duì)你體現(xiàn)“話語安慰”是你在使用功能時(shí)不再那么枯燥，釘釘?shù)腎P設(shè)計(jì)同樣也是在拉近與用戶之間的距離，通過IP讓本就繁瑣的產(chǎn)品得到心情的愉悅，這都是在進(jìn)一步提升B端的情感化，淘寶的功能、抖音的功能更加方便高效其實(shí)也是B端的體現(xiàn)，所以我們B C端其實(shí)歸根結(jié)底我們的目標(biāo)服務(wù)都是為了人設(shè)計(jì)的，設(shè)計(jì)也一樣，服務(wù)于人，都是以更加舒適的道路上前進(jìn)。
其實(shí)B端C端從根本來說不同點(diǎn)很小，因?yàn)槎际菫榱恕叭恕比シ?wù)，未來的發(fā)展也是為了更好的讓我們?nèi)ジ咝У氖褂?；就很像國?nèi)國外設(shè)計(jì)有什么不同，其實(shí)沒什么不同，我們?cè)O(shè)計(jì)每一個(gè)項(xiàng)目、每一個(gè)作品時(shí)不管我們是否屬于哪個(gè)國家，我們的目的也只有一個(gè)“為了讓這個(gè)世界因?yàn)橛辛嗽O(shè)計(jì)而看起來更美一點(diǎn)！”
作者：小蘆同學(xué)有大腦袋 來源：站酷
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請(qǐng)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
列表頁多用于一個(gè)功能的首屏，是一個(gè)功能的數(shù)據(jù)集中載體，它的主要功能就是集中處理、展示、查詢、以及統(tǒng)計(jì)數(shù)據(jù)等。列表頁一般包含5個(gè)組成部分：標(biāo)題、查詢、操作、統(tǒng)計(jì)以及表格。
系統(tǒng)中只要是功能，就一定有標(biāo)題，就像只要是個(gè)人，就一定有姓名一樣，標(biāo)題的展示根據(jù)系統(tǒng)的結(jié)構(gòu)，可能在面包屑中，可能在標(biāo)簽欄中，也有可能在頁面容器中。如果標(biāo)題放在容器中，位置一般是固定的，不隨著頁面滾動(dòng)而滾動(dòng)，標(biāo)題字體也要和內(nèi)容字體做區(qū)分，一般是字號(hào)增大或者加粗等方式。
查詢條件的設(shè)計(jì)也是五花八門，根據(jù)查統(tǒng)頁使用場景大致可以分成兩種：一種是省空間的設(shè)計(jì)，一般只需要放一兩個(gè)查詢條件，那么它就可以和操作按鈕放一起，多出現(xiàn)于數(shù)據(jù)字段比少且簡單的情況；一種是經(jīng)常需要混合高級(jí)查詢，一般會(huì)獨(dú)立有一塊查詢條件模塊，多出現(xiàn)于數(shù)據(jù)統(tǒng)計(jì)類頁面。
為了達(dá)到省空間的目的，查詢條件和操作放一行，一般會(huì)只放一兩個(gè)查詢條件，輸入或選擇后即執(zhí)行查詢，不需要單獨(dú)點(diǎn)擊查詢按鈕，這種方式好處就是省空間，缺點(diǎn)是它默認(rèn)展示的篩選項(xiàng)比較少，需要再點(diǎn)擊“更多查詢”才能看到更多。設(shè)計(jì)這種查詢方式需要注意的是，輸入查詢一般是輸入后即執(zhí)行查詢，容易導(dǎo)致執(zhí)行過于頻繁（輸入一個(gè)字符即執(zhí)行了），因此會(huì)做防抖設(shè)置，可以在輸入0.5s后執(zhí)行。再一個(gè)，這種展開收起的情況，用戶容易看不到隱藏的篩選，因此需要一些標(biāo)記，比如展示已選擇的數(shù)量。
獨(dú)立查詢條件的方式，就是將查詢條件單獨(dú)劃出一個(gè)模塊，可以一次性展示多個(gè)查詢條件。這種方式的好處就是，查詢更便捷，還可以做更多的拓展性方案，如用戶可以自定義高級(jí)查詢方案。缺點(diǎn)就是占空間，對(duì)于小分辨率電腦不是很友好。
列表的操作是由產(chǎn)品的功能權(quán)限控制，由權(quán)限決定哪些人能夠使用和查看數(shù)據(jù)，下面從操作的類型、組合、操作反饋以及狀態(tài)的角度分析如何設(shè)計(jì)好操作功能。
操作模塊一般是由一組用于操作表格數(shù)據(jù)的按鈕組，主要分為3種：一種是全局性操作，一種是選擇數(shù)據(jù)進(jìn)行操作，一種是混合型操作。全局性操作（如新增數(shù)據(jù)、導(dǎo)入、導(dǎo)出模板、刷新等）不需要勾選當(dāng)前具體某行數(shù)據(jù)，就可以直接點(diǎn)擊操作；選擇數(shù)據(jù)進(jìn)行操作（如刪除、編輯、審批等），即操作前需要至少勾選一條數(shù)據(jù)，因?yàn)樗菍?duì)當(dāng)前已存在的數(shù)據(jù)進(jìn)行操作；混合型操作（如導(dǎo)出、更新狀態(tài)等），在勾選數(shù)據(jù)的時(shí)候會(huì)對(duì)當(dāng)前數(shù)據(jù)進(jìn)行操作，未勾選數(shù)據(jù)的時(shí)候默認(rèn)會(huì)全部處理或者其他的操作，比如“導(dǎo)出操作”，勾選數(shù)據(jù)時(shí)會(huì)導(dǎo)出已選數(shù)據(jù)，未勾選時(shí)則默認(rèn)導(dǎo)出空模板或者導(dǎo)出全部數(shù)據(jù)（根據(jù)具體產(chǎn)品要求）。
操作組一般會(huì)由一個(gè)或多個(gè)按鈕組成，通常只有一個(gè)主操作（primary）。主操作是帶有引導(dǎo)性的功能，如“新增數(shù)據(jù)”，還有若干個(gè)普通按鈕（default），不帶有引導(dǎo)性。按鈕組還可以根據(jù)操作類型形成組合，以分割線或收納的形式展示，收納按鈕主要有兩種展示形式：一種是帶主操作的收納按鈕（如歸納同類型的操作），一種是直接收納，不帶主操作的（如按鈕太多需要進(jìn)行收起）。操作的順序通常也會(huì)根據(jù)優(yōu)先級(jí)和操作頻次來決定。
操作后需要給個(gè)反饋，告知用戶操作結(jié)果，告知結(jié)果分三種情況：1、直接給結(jié)果，如toast提示，操作成功/操作失?。?、給操作建議，如：toast提示，請(qǐng)先勾選至少一條數(shù)據(jù)；3、警告提示，如刪除數(shù)據(jù)時(shí)候告知風(fēng)險(xiǎn)，二次確認(rèn)防止誤操作。
數(shù)據(jù)統(tǒng)計(jì)一般是拾取表格數(shù)據(jù)某些維度的統(tǒng)計(jì)結(jié)果，用于快速知曉當(dāng)前所有數(shù)據(jù)的情況，有些統(tǒng)計(jì)還帶交互，比如點(diǎn)擊選中后進(jìn)行數(shù)據(jù)過濾。
市面上封裝好的表格組件可配置api很多，像antd，但是想要做的更強(qiáng)大，還有很多能夠做的細(xì)節(jié)，我們先來分析下表格的組成。表格是由行和列組成的網(wǎng)格數(shù)據(jù)，表格可以分2種，明細(xì)表和交叉表，查統(tǒng)頁中采用的就是明細(xì)表中的橫表，即表頭是橫向的。
表格的設(shè)計(jì)原則遵循以下幾點(diǎn)：數(shù)據(jù)可讀性、展示效率、操作便捷性、以及靈活性等。
表格作為信息密度最大的組件，在設(shè)計(jì)的時(shí)候要考慮數(shù)據(jù)的可讀性，可以從以下幾點(diǎn)入手。
B端產(chǎn)品尤其是ERP這種數(shù)據(jù)密集程度很高的產(chǎn)品，對(duì)空間的利用要求是很高的，因此在設(shè)計(jì)的時(shí)候要充分考慮展示的效率，可以從行高、列寬等角度去設(shè)計(jì)表的細(xì)節(jié)。我設(shè)計(jì)表的時(shí)候習(xí)慣先跟產(chǎn)品討論清楚每個(gè)字段大概的長度，在設(shè)計(jì)的時(shí)候就會(huì)預(yù)留匹配的默認(rèn)字段寬度，比如14號(hào)字體的表格，在展示“創(chuàng)建時(shí)間”字段的時(shí)候，字段寬度不會(huì)超過170px，我會(huì)留180px的默認(rèn)寬度，既有呼吸感，又不浪費(fèi)空間。最后預(yù)留一個(gè)字段寬度作為auto自適應(yīng)，給到個(gè)min最小值，這樣在不同分辨率上能展示相同的效果。
表格在展示數(shù)據(jù)的時(shí)候往往會(huì)遇到一些問題，比如字段顯示不完整，這時(shí)候就需要手動(dòng)支持調(diào)節(jié)列寬，或者懸停tips展示全部內(nèi)容。再比如想要復(fù)制某段內(nèi)容，而文字展示不全，又不支持調(diào)整列寬，這時(shí)候要么在比較常用于復(fù)制的字段后面跟個(gè)“復(fù)制”圖標(biāo)，或者懸停出現(xiàn)tips的時(shí)候鼠標(biāo)移上去不會(huì)馬上消失，這樣用戶就能框選文字復(fù)制了。
表格設(shè)計(jì)的時(shí)候不一定能覆蓋所有用戶和場景，因此需要預(yù)留一些靈活調(diào)整的空間，下面介紹幾個(gè)常用點(diǎn)。
表格元素包含了背景、數(shù)據(jù)（文字、圖片、圖標(biāo)、標(biāo)簽、附件等）、序號(hào)、邊框、選擇框、操作項(xiàng)、斑馬線等。這些在設(shè)計(jì)表格的時(shí)候都是設(shè)計(jì)師需要去定義展示形式
為什么要單獨(dú)把操作列拿出來講，因?yàn)椴僮髁械脑O(shè)計(jì)蘊(yùn)含了太多內(nèi)容需要考慮，設(shè)計(jì)師在設(shè)計(jì)的時(shí)候很容易忽略。
目前操作列按鈕主要兩種形式，“圖標(biāo)按鈕”和“文字按鈕”，圖標(biāo)按鈕主要用于比較簡單易懂的一些常規(guī)操作，優(yōu)勢(shì)是長度可控，容易對(duì)齊，劣勢(shì)是，有時(shí)候需要懸停上去才知道含義，不夠直接；文字按鈕用的范圍比較廣，簡單明白，缺點(diǎn)是長度不可控，不好對(duì)齊。
操作列和復(fù)選框一樣，一般作為固定列，不隨著字段橫向滾動(dòng)。數(shù)量也不可控，根據(jù)業(yè)務(wù)情況，有多有少，因此在做的時(shí)候要解決數(shù)量問題，如果全部展示，則勢(shì)必影響內(nèi)容的展示面積，因此設(shè)計(jì)師根據(jù)真實(shí)的操作數(shù)量設(shè)定固定列寬度規(guī)則，操作項(xiàng)超過一定數(shù)量或一定長度做“更多”按鈕收納。還有一種展示方式，默認(rèn)不展示，鼠標(biāo)懸停展示該條數(shù)據(jù)需要展示的操作，這樣既可以解決信息展示面積問題，又不需要考慮和其他行數(shù)據(jù)的操作對(duì)齊，還不需要定操作列列寬規(guī)則，缺點(diǎn)是，不夠直接，如果不懸停就不知道還有操作項(xiàng)。有的產(chǎn)品干脆直接把操作項(xiàng)去掉，全部采用上面的全局操作，勾選數(shù)據(jù)后執(zhí)行，總之各有各的優(yōu)缺點(diǎn)。
設(shè)計(jì)師經(jīng)常會(huì)困惑，什么時(shí)候操作禁用，什么時(shí)候隱藏。按鈕隱藏一般根據(jù)數(shù)據(jù)權(quán)限控制，“隱藏”通常是角色無該操作權(quán)限的時(shí)候采用，“禁用”通常是由于數(shù)據(jù)本身的問題導(dǎo)致暫時(shí)性失效。舉例個(gè)例子，組織架構(gòu)的頁面，管理員對(duì)所有組織架構(gòu)和成員有編輯和刪除權(quán)限，而普通員工只能查看數(shù)據(jù)，這時(shí)候操作按鈕就需要隱藏。再比如訂單功能，有的訂單已經(jīng)進(jìn)入審批環(huán)節(jié)不可刪除，那么它的刪除按鈕就會(huì)變成禁用，而有的訂單還未進(jìn)入審批環(huán)節(jié)，這時(shí)候是允許刪除的，這時(shí)候刪除按鈕就會(huì)亮起。
數(shù)據(jù)量比較大的時(shí)候會(huì)用上分頁器，設(shè)計(jì)師在設(shè)計(jì)的時(shí)候也要定好默認(rèn)一頁幾條，不然開發(fā)就會(huì)根據(jù)自己的臆想來做。分頁器位置的設(shè)計(jì)也分兩種，在表格上方和表格下方，市面上看到的大部分都是在下方。放在下方就有個(gè)問題了，是要固定頁面位置還是隨著表格自動(dòng)計(jì)算位置？我對(duì)比了幾個(gè)比較成熟的產(chǎn)品，大部分都是固定在底部，不隨著頁面滾動(dòng)，整個(gè)頁面滾動(dòng)的區(qū)域只有表身，有小部分是跟在表格尾部，每頁條數(shù)超過屏幕高度可展示量，分頁器就會(huì)被擠到下面看不見，這種好處就是省了一點(diǎn)展示空間，不好的地方就是，要想再使用分頁器得往下找。還有極小部分產(chǎn)品兼容了這兩個(gè)方案，當(dāng)條數(shù)少的時(shí)候跟在表格尾部，當(dāng)條數(shù)多的時(shí)候，會(huì)頂在底部，類似固定釘功能。總之不管采用哪種方案，都要兼顧便捷性和易用性。
表頭篩選平時(shí)用的比較少，因?yàn)橥饷嬉呀?jīng)有獨(dú)立的篩選功能，有些也放出來，補(bǔ)充一些不常用的篩選。
排序規(guī)則主要由產(chǎn)品提供，設(shè)計(jì)需要知道一下。一般默認(rèn)是以產(chǎn)品的創(chuàng)建時(shí)間為排序，排序不帶具體業(yè)務(wù)含義的一般采用時(shí)間倒序，最新數(shù)據(jù)在表格最上面，這樣每次新增數(shù)據(jù)就可以快讀看到，不用劃到最后面甚至翻頁后才能看到。有的采用時(shí)間正序，最新的數(shù)據(jù)在最后面，這種一般是數(shù)據(jù)本身帶有排序?qū)傩?，如果貿(mào)然在最上面插入數(shù)據(jù)會(huì)打亂已設(shè)定好的順序，這種帶排序?qū)傩缘谋砀?，往往還有調(diào)整順序的操作。觸發(fā)排序一般只需要點(diǎn)擊表頭即執(zhí)行，通常點(diǎn)一次會(huì)進(jìn)行正序/反序，再點(diǎn)一次會(huì)反過來，再點(diǎn)一次取消排序。如果點(diǎn)另一個(gè)字段的排序則默認(rèn)會(huì)采用最新的排序字段。
有些比較難懂的字段需要在表頭增加一個(gè)提示信息，來輔助用戶理解字段含義
前面講了表格的各種屬性，為了使用的靈活性，有些成熟的產(chǎn)品會(huì)設(shè)計(jì)一個(gè)設(shè)置表格屬性的功能，可以讓用戶自定義表格屬性，如字段展示（篩選）、字段順序、字段對(duì)齊方式、字段固定列、是否展示序號(hào)、斑馬線等。事情有利必有弊，靈活也意味著學(xué)習(xí)成本高和投入開發(fā)成本大，是否需要做有各自的真實(shí)情況決定，不過作為設(shè)計(jì)師得知道，這些就是你能雕琢的地方。
還有一些額外的設(shè)計(jì)過程中你不一定會(huì)注意到但挺好用功能推薦。
在選擇數(shù)據(jù)的時(shí)候，為了便于一眼看到選中的數(shù)據(jù)，會(huì)做這個(gè)么個(gè)操作。
表格的選擇，默認(rèn)一般是不支持跨頁選擇的，所以產(chǎn)品或者設(shè)計(jì)需要要求開發(fā)支持跨頁選擇，而一旦支持跨頁選擇，就容易忘了到底選了多少條，因此會(huì)展示選中條數(shù)，以及一鍵清空選中，這個(gè)功能還可以和“只看已選”功能混合著用。
對(duì)于有些帶明細(xì)數(shù)據(jù)的表單，通常在表單中會(huì)分表頭和明細(xì)（表身），舉個(gè)例子，商品訂單中會(huì)包含一些像訂單編號(hào)、客戶名稱、發(fā)貨時(shí)間、發(fā)貨地址等等這種，叫做表頭。像具體的明細(xì)數(shù)據(jù)，如訂單中包含100個(gè)a商品，200個(gè)b商品等等，叫做明細(xì)（表身），因此在列表功能展示的時(shí)候有時(shí)候需要一眼看出明細(xì)數(shù)據(jù)，就會(huì)以表身明細(xì)數(shù)據(jù)為主數(shù)據(jù)展示，但是數(shù)據(jù)量會(huì)蹭蹭往上，因此用戶可能會(huì)選擇是按“表頭”數(shù)據(jù)展示還是按“表頭+明細(xì)”數(shù)據(jù)展示。
列表頁承載了一個(gè)b端系統(tǒng)半壁江山，設(shè)計(jì)師在設(shè)計(jì)過程中需要不斷打磨，設(shè)計(jì)出符合自己產(chǎn)品特性的列表。
作者：落難的黑人 來源：站酷
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請(qǐng)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
同理心是在某種情況下理解他人感受或想法的能力。
同理心有時(shí)會(huì)與同情相混淆，但這兩個(gè)詞并不是同一個(gè)意思。同理心是指理解別人的感受或想法，通常是通過自己感受這些情緒。同情是一種表現(xiàn)出關(guān)心或同情而不去感受情緒本身的體驗(yàn)。
通過有效地與用戶感同身受，盡最大努力了解他們的需求，你為產(chǎn)品體驗(yàn)奠定了良好的基礎(chǔ)，這將有助于解決他們獨(dú)特的問題。
帶著同理心進(jìn)行設(shè)計(jì)將提升你所創(chuàng)造的產(chǎn)品。通過與用戶建立更深層次的聯(lián)系，您將更好地理解他們的觀點(diǎn)和痛點(diǎn)。盡早找到這種聯(lián)系可以引導(dǎo)你走上正確的設(shè)計(jì)道路，并避免在設(shè)計(jì)過程的后期階段大量修改產(chǎn)品。
作為一個(gè)用戶體驗(yàn)設(shè)計(jì)師，與用戶共情可以幫助我們創(chuàng)造體驗(yàn)更好的產(chǎn)品，因?yàn)槲覀冊(cè)谠O(shè)計(jì)過程中會(huì)站在用戶的角度去體驗(yàn)產(chǎn)品。我們?cè)绞巧朴陬A(yù)測用戶的欲望和需求，用戶對(duì)我們的設(shè)計(jì)就越滿意，用戶才越有可能長期地使用我們?cè)O(shè)計(jì)的產(chǎn)品。
設(shè)計(jì)師要避免自我假設(shè)很多需求，我們要通過問很多的問題來了解用戶的直接需求和想法（跟我們需要設(shè)計(jì)的產(chǎn)品相關(guān)的問題）?？梢允褂檬鞘裁?、為什么、怎么樣等問題來深入了解用戶。
需要注意整個(gè)用戶，而不僅僅是他們的語言。詳細(xì)研究用戶與產(chǎn)品互動(dòng)的過程，用視頻、錄音、筆記等方式詳細(xì)記錄。
全神貫注地傾聽，理解并記住與你互動(dòng)的用戶所說的話，避免分心。在用戶體驗(yàn)設(shè)計(jì)中，練習(xí)積極傾聽可以幫助你直接從用戶那里得到公正的反饋，你可以應(yīng)用它來改進(jìn)你的設(shè)計(jì)。
收到的反饋是客觀和公正的，這點(diǎn)很重要。朋友或同事通常會(huì)提供偏頗的、大多是正面的反饋，因?yàn)樗麄兿胫С帜慊蛉偰?。因此，不同的來源和不同的用戶組的反饋很重要。在尋求反饋時(shí)，可以多使用開放式的問題。
我們都有偏見。記住，偏見是基于有限的信息而對(duì)某事或某人有偏見。作為用戶體驗(yàn)設(shè)計(jì)師，我們必須把這些偏見放在一邊，以便更好地與他人產(chǎn)生共鳴。你的目標(biāo)是理解用戶，而不是用你自己的觀點(diǎn)和情緒復(fù)雜化他們的反饋。
關(guān)注研究人員，加入在線社區(qū)，了解影響用戶體驗(yàn)設(shè)計(jì)師和用戶的最新研究。隨著我們對(duì)人類心理學(xué)的了解越來越多，研究也在不斷變化和發(fā)展。緊跟潮流會(huì)讓你在理解聽眾和與聽眾互動(dòng)方面更有優(yōu)勢(shì)。
為了確保訪談中能夠充分利用時(shí)間，不談一些偏離的話題，需要先制定訪談目標(biāo)。
下面是一些關(guān)于與用戶共情的常見研究目標(biāo):
我想了解人們?cè)谑褂梦以O(shè)計(jì)的產(chǎn)品解決問題時(shí)所經(jīng)歷的過程和產(chǎn)生的情緒是怎么樣的
我想確定目前人們對(duì)此問題是如何解決的？其常見的用戶行為和體驗(yàn)如何？
我想了解用戶的需求和不滿
時(shí)刻記住訪談目標(biāo)，提前寫下你的訪談問題，訪談問題越符合你的目標(biāo)，你得到的數(shù)據(jù)就越有用。
多問開放式的問題，訪談?wù)呖梢愿杂傻胤窒硭麄冋鎸?shí)的想法
保持問題簡短明了，訪談?wù)卟湃菀桌斫饽愕膯栴}
追問問題，在訪談?wù)呋卮鹜暌粋€(gè)問題后，試著多問他們“為什么?”或者用“多告訴我一點(diǎn)”來獲取更深層的信息
選擇研究對(duì)象需要基于研究目標(biāo)和所設(shè)計(jì)產(chǎn)品的目標(biāo)用戶。可以發(fā)送一份篩選調(diào)查問卷來確定潛在參與者是否符合研究要求，收集的數(shù)據(jù)例如：年齡、地理位置、職業(yè)或行業(yè)、性別等。
一旦你確定了研究目標(biāo)和書面采訪問題(在如何確定你的研究目標(biāo)和問題)，并創(chuàng)建篩選調(diào)查，以找到研究參與者的代表性樣本，你就可以開始招募參與者了!
如何以及在哪里找到研究參與者取決于你工作的公司、你設(shè)計(jì)的產(chǎn)品類型、研究的時(shí)間限制、項(xiàng)目預(yù)算和目標(biāo)用戶的可訪問性?；谶@些項(xiàng)目細(xì)節(jié)，您可以選擇從各種各樣的方式來尋找研究參與者。
個(gè)人社交圈?？紤]一下符合你的目標(biāo)用戶的家庭、朋友或同事。
現(xiàn)有用戶。如果你的產(chǎn)品已經(jīng)有一些用戶基礎(chǔ)，你可以從現(xiàn)有用戶中招募參與者。
互聯(lián)網(wǎng)招募。如果是為新成立的企業(yè)設(shè)計(jì)產(chǎn)品，最簡單的招募參與者的方法是網(wǎng)上招募。你可以使用社交媒體來尋找研究參與者，或者使用專門招募用戶的網(wǎng)站，如用戶測試和用戶訪談。你也可以找一些符合你目標(biāo)用戶群體的聊天群去招募用戶。
走廊測試。去最可能遇到產(chǎn)品目標(biāo)受眾的地方，比如狗公園或咖啡店，現(xiàn)場拉一些路過的人進(jìn)行測試。如果你招募的參與者不多，時(shí)間有限，或者你想免費(fèi)進(jìn)行研究，那么走廊測試是比較好的選擇。然而，以這種方式尋找參與者是有風(fēng)險(xiǎn)的，因?yàn)樗麄兛赡懿皇悄愕臐撛谟脩簟?nbsp;
第三方機(jī)構(gòu)。有預(yù)算的企業(yè)可以雇傭第三方研究機(jī)構(gòu)，他們可以節(jié)省你的時(shí)間，而且更加專業(yè)。
將你要問用戶的所有問題列下來，在實(shí)踐中已經(jīng)證實(shí)保持訪談?wù)邌栴}的一致性很重要。當(dāng)然，訪談腳本只是一個(gè)指南，當(dāng)有必要的時(shí)候我們可以偏離準(zhǔn)備的問題以了解用戶更多的痛點(diǎn)。
制作一份訪談所需物品的清單，比如一臺(tái)電腦、一份打印出來的問題清單，或者紙和鉛筆。如果你在訪談中需要使用新的設(shè)備或技術(shù)，一定要提前了解清楚怎么使用。
盡可能提前了解你要訪談的人。如果你準(zhǔn)備訪談的用戶在訪談前提供了他們的個(gè)人信息，要注意確認(rèn)他們的個(gè)人信息是否符合真實(shí)情況，避免訪談一個(gè)競爭對(duì)手的臥底。
在正式訪談之前練習(xí)一下你要問的問題，跟同事或朋友模擬地進(jìn)行一次訪談。
感謝用戶的到來。在面試開始前，感謝用戶花時(shí)間與你見面并分享他們的觀點(diǎn)。感謝用戶是建立良好關(guān)系的一部分，可以幫助他們覺得自己的意見是有價(jià)值的。
收集基本的細(xì)節(jié)。當(dāng)你與用戶見面時(shí)，記得詢問與訪談?wù)呦嚓P(guān)的基本信息，如他們的姓名或人口統(tǒng)計(jì)信息。11
遵守訪談禮儀
提問時(shí)，說話要清晰簡潔，無論用戶如何回答問題，都要保持專業(yè)。當(dāng)用戶分享他們的觀點(diǎn)時(shí)，表現(xiàn)出你在積極地傾聽，比如點(diǎn)頭、進(jìn)行適當(dāng)?shù)难凵窠涣骰蜃龉P記。
問開放式的問題
避免問那些會(huì)導(dǎo)致簡單回答“是”或“不是”的問題，最好多問一些以“為什么”開頭的問題。如果參與者確實(shí)提供了一個(gè)簡短的“是”或“不是”的回答，你應(yīng)該追問一些問題，讓他們分享更多信息。
及時(shí)記筆記
如果不做筆記，準(zhǔn)確復(fù)述參與者所表達(dá)的幾乎是不可能的!當(dāng)你在面試中觀察和傾聽參與者的談話時(shí)，盡可能多地寫下你能捕捉到的內(nèi)容。當(dāng)你想出解決用戶痛點(diǎn)的想法時(shí)，一份完整的筆記和觀察清單將會(huì)很有幫助。這里有一些最好的做法，可以幫助你在面試中做筆記:
突出引人注目的報(bào)價(jià)
面試中最明顯的部分就是記錄面試者所說的話。有趣的引用是用戶真實(shí)想法和感受的有力指示器。在你的同理心地圖中包含引用是一種很好的方式，以真實(shí)用戶的第一手視角為特色，這可以在你開始設(shè)計(jì)時(shí)提供有價(jià)值的見解。
記錄對(duì)參與者的觀察
不僅要記錄用戶所說的話，還要記錄他們的情緒、表情、肢體語言和行為。要特別注意外界因素，比如噪音或干擾，這些可能會(huì)影響面試結(jié)果。在創(chuàng)建同理心地圖時(shí)，所有這些觀察結(jié)果都是重要的考慮因素。
語音/視頻記錄訪談
詢問參與者是否允許你錄入訪談。如果他們同意的話，錄下來的訪談在之后會(huì)很有幫助，可以幫助你回顧訪談中你可能不記得的部分，或者在訪談結(jié)束后整理額外的筆記。
在你問完所有的訪談問題后，給用戶一個(gè)機(jī)會(huì)分享他們對(duì)面試中討論的任何項(xiàng)目的最終想法。一些參與者可能會(huì)公開他們的觀點(diǎn)，并透露他們之前沒有分享的見解。
另外，記得再次感謝參與者。你要讓用戶在訪談結(jié)束時(shí)對(duì)你及未來的產(chǎn)品和你可能代表的公司有一個(gè)不錯(cuò)的感覺。
幫助設(shè)計(jì)師以圖表的形式梳理每次訪談的信息，以明確用戶需求
你的公司正在開發(fā)一個(gè)新的應(yīng)用程序來幫助人們安排遛狗的時(shí)間。該應(yīng)用程序的目的是將合格的遛狗者與需要幫助照顧他們的狗的客戶匹配起來，類似于拼車或家庭共享應(yīng)用程序。你是用戶體驗(yàn)團(tuán)隊(duì)的一員，你的團(tuán)隊(duì)處于設(shè)計(jì)應(yīng)用程序的早期階段，并正在了解用戶的痛點(diǎn)。一位同事已經(jīng)采訪了經(jīng)常使用該應(yīng)用程序的狗主人和專業(yè)遛狗者?，F(xiàn)在你有責(zé)任用同理心地圖總結(jié)每次采訪。
名稱:Makayla斯科特
情境:Makayla是一名45歲的女教師，住在德克薩斯州休斯頓。她有兩條狗。作為一名四年級(jí)老師，Makayla日常的工作比較多。放學(xué)后，她還自愿擔(dān)任排球教練。Makayla的伴侶是一名全職兒科外科醫(yī)生，經(jīng)常在當(dāng)?shù)蒯t(yī)院的夜班和白班之間輪流工作。
UXR：
你能描述一下你目前的工作情況以及是如何照顧你的狗的嗎?
Makayla：
我是一名教師，放學(xué)后我要教排球，所以我的狗Reggie和Snowball在很長一段時(shí)間內(nèi)要被單獨(dú)留在家里。我的伴侶在一家醫(yī)院工作，需要隨叫隨到，還通常有12個(gè)小時(shí)的白班或夜班。當(dāng)我們都很忙的時(shí)候，我們需要有人遛Reggie和Snowball。
UXR：
你在照顧你的狗狗時(shí)面臨什么挑戰(zhàn)?這讓你有什么感覺?
Makayla：
我愛我的狗!他們是那么的可愛。如果問他們要出去玩多少次，他們肯定會(huì)說一天想要遛五次!但是，按照我們的日常工作情況，很難經(jīng)常帶他們出去。我每天早上第一件事就是把它們放出來玩一會(huì)兒，然后晚上也會(huì)把它們放出來玩一會(huì)兒。有時(shí)候，我會(huì)付錢給隔壁鄰居17歲的兒子讓他幫我遛狗。但是，我們?nèi)ヂ糜蔚臅r(shí)候就會(huì)有很大的困擾。我和我的伴侶喜歡去旅行，我們不能總是帶著我們的寵物。如果我們能預(yù)定一個(gè)遛狗的人，那我們就能安心地出去玩了。
我們鄰居的兒子今年就要畢業(yè)了，他的日程安排越來越不穩(wěn)定。我不能在一直依賴他，我擔(dān)心他沒有專業(yè)的照顧狗狗的經(jīng)驗(yàn)。當(dāng)然，一個(gè)17歲的孩子只是每天帶狗散散步是沒問題，但如果他周末帶狗出去玩，Snowball生病了怎么辦?他怎么知道該做什么，或者該不該給我打電話?這確實(shí)讓我很擔(dān)心，但我又不想把狗狗拿去寵物店寄養(yǎng)。
還有很多地方我不能帶Reggie去，他比Snowball大得多。他不像Snowball那樣容易過敏。因?yàn)樗罅?，帶它去公路旅行都很困難。我們?nèi)ツ陝偘岬叫菟诡D，可以求助的人不多。我考慮過在網(wǎng)上發(fā)布廣告，但我不確定把誰留在家里會(huì)比較安全，誰可以和狗很好地相處。
UXR：
你覺得有什么方法可以解決這些挑戰(zhàn)嗎?
Makayla：
我想找一個(gè)遛狗的人，我希望我可以了解更新他們的信息并且提前篩選。我希望能有一種固定預(yù)約的方式。比如這個(gè)人可以每個(gè)周末來，然后在我白天工作的時(shí)候也可以約一些特定的時(shí)間。理想情況下，我可以提前幾天安排遛狗。我只需要一個(gè)固定的遛狗者，希望可以通過篩選，確保他們是安全可靠的，與寵物可以友好相處的!我愿意多花一點(diǎn)錢來得到這樣的服務(wù)，而不用老是向我的鄰居求助。
把被采訪人的名字寫進(jìn)你的同理心地圖
逐字引用訪談中的內(nèi)容。準(zhǔn)確地寫下這個(gè)人說了什么而不要用你自己的話來總結(jié)。如果總結(jié)了訪談?wù)叩脑?，可能?huì)錯(cuò)誤地解釋用戶的意思。在訪談中要時(shí)刻關(guān)注用戶的狀態(tài)，并記錄他們的痛點(diǎn)。例如，如果用戶在訪談中多次重申相同的問題，那么這可能是一個(gè)主要的痛點(diǎn)。
在這里，你可以總結(jié)一下用戶表達(dá)的想法。添加用戶通過肢體語言、語氣或其他明顯的指示來傳達(dá)的感受，即使他們沒有口頭上向你表達(dá)。你可以對(duì)這些感覺做出推斷，但你必須注意不要對(duì)用戶做出假設(shè)。例如，Makayla對(duì)鄰居十幾歲的兒子表示擔(dān)憂，并提到了他的年齡和資格。一個(gè)假設(shè)是，Makayla想要一個(gè)成年遛狗者。一個(gè)推論是，她想要一個(gè)有汽車和駕照的遛狗人，可以帶狗去急診獸醫(yī)。如果你發(fā)現(xiàn)任何矛盾，你可以讓你的用戶解釋他們的肢體語言。
Makayla向我們?cè)敿?xì)說明了她為克服遛狗面臨的挑戰(zhàn)而采取的行動(dòng)步驟。
在訪談中，注意用戶的憤怒、沮喪、興奮等情緒，列在這個(gè)模塊。它可能與你在“所想”中列出的一些內(nèi)容重疊，沒有關(guān)系，就重疊地列出來。如果用戶在訪談中沒有明確提到任何感受，你可以通過追問“這讓你有什么感受?”來探究用戶感受。
這張同理心地圖分解了你的團(tuán)隊(duì)在決定你的應(yīng)用如何滿足Makayla需求時(shí)需要考慮的所有要點(diǎn)。真正的挑戰(zhàn)來自于你要從所有用戶訪談中得出的聚合共情地圖，并找出每個(gè)潛在用戶需求的重疊。
重要的是要理解有兩種類型的共情地圖:單用戶共情地圖和聚合共情地圖(也稱為“多用戶共情地圖”)。
單用戶共情地圖是通過從一個(gè)用戶的訪談中獲取數(shù)據(jù)并將其轉(zhuǎn)化為共情地圖來創(chuàng)建的，就像本文前面的例子一樣。這種方法可以幫助設(shè)計(jì)師將單個(gè)用戶的想法、感受和特征提煉成一種更容易收集數(shù)據(jù)的格式。
聚合共情地圖，代表了一組擁有相似想法、觀點(diǎn)或品質(zhì)的用戶。聚合共情地圖是通過創(chuàng)建多個(gè)單用戶共情地圖來創(chuàng)建的，然后將用戶表達(dá)類似內(nèi)容的地圖組合成一個(gè)新的共情地圖。這有助于設(shè)計(jì)師確定有相似傾向的人群，他們將會(huì)使用產(chǎn)品。聚合共情地圖的洞察力允許設(shè)計(jì)師確定主題，這有助于他們更好地與他們正在設(shè)計(jì)的群體共情。
要了解更多不同類型的共情圖，請(qǐng)查看尼爾森·諾曼集團(tuán)關(guān)于共情圖的這篇文章。
https://www.nngroup.com/articles/empathy-mapping/
角色是虛構(gòu)的用戶，多個(gè)用戶匯聚成一類角色，他們的目標(biāo)和特征代表了更大的用戶群體的需求。您創(chuàng)建的每個(gè)角色都將代表一組具有您通過研究了解到的類似特征的用戶。角色是設(shè)計(jì)過程的關(guān)鍵，因?yàn)樗鼈兎从沉擞脩舻纳罘绞剑⒔o你的團(tuán)隊(duì)提供了如何滿足用戶需求或挑戰(zhàn)的思路。
在用戶體驗(yàn)設(shè)計(jì)的世界里，用戶永遠(yuǎn)是第一位的。我們要了解用戶需求，必須知道我們的用戶是誰。
角色是通過進(jìn)行用戶研究、確定痛點(diǎn)來創(chuàng)建的，痛點(diǎn)是指用戶體驗(yàn)方面的痛點(diǎn)，它們會(huì)挫敗和阻礙用戶從產(chǎn)品中獲得他們需要的東西。
在創(chuàng)建人物角色時(shí)，要在數(shù)據(jù)中查找最常見的標(biāo)簽，并將這些標(biāo)簽擬人化的用戶分組在一起。例如，想象一下，從遛狗應(yīng)用程序的用戶訪談中收集的數(shù)據(jù)顯示，許多年齡在45歲到60歲之間的潛在用戶都擔(dān)心遛狗者能夠進(jìn)入他們的家。這肯定是你想要在代表特定年齡段用戶的角色中包含的痛點(diǎn)。
一般來說，創(chuàng)建3到8個(gè)角色就足以代表產(chǎn)品的大部分用戶。把人物角色看作是你所有研究和采訪的總覽。雖然人物角色準(zhǔn)確地代表用戶很重要，但不可能滿足他們的每一個(gè)特定需求。角色也是特定于環(huán)境的，這意味著他們應(yīng)該專注于用戶與產(chǎn)品有效互動(dòng)的行為和目標(biāo)。
以下是Daniela的用戶畫像：
專業(yè)提示:
在構(gòu)建用戶角色之前，先征求團(tuán)隊(duì)對(duì)產(chǎn)品用戶的意見。在你構(gòu)建了角色之后，審查來自你的團(tuán)隊(duì)的建議，并將它們與你創(chuàng)建的角色進(jìn)行比較。指出數(shù)據(jù)是如何驗(yàn)證或反駁他們的建議的。團(tuán)隊(duì)中的每個(gè)人都需要理解角色，這樣才能與用戶真正地建立聯(lián)系。
“作為一名為團(tuán)隊(duì)收集咖啡訂單的市場實(shí)習(xí)生，我想提前提交和監(jiān)控團(tuán)隊(duì)訂單，以便更好地管理訂單準(zhǔn)確性和計(jì)劃取貨時(shí)間?！?/strong>
安妮卡是一家中型廣告公司的市場實(shí)習(xí)生。每周兩次，在晨會(huì)之前，他們會(huì)從附近的咖啡店為團(tuán)隊(duì)收集6-12杯咖啡。但有時(shí)他們會(huì)發(fā)現(xiàn)自己點(diǎn)的菜不完整，或者因?yàn)榈攘颂貌艁砣〔硕鴽隽?。他們需要一種方法來提前下單，跟蹤訂單狀態(tài)，并更好地計(jì)劃他們的到貨時(shí)間。
“作為一名每天花3-4小時(shí)學(xué)習(xí)和購買產(chǎn)品的遠(yuǎn)程學(xué)生，我希望能夠在不起床的情況下點(diǎn)餐，這樣我就可以享受CoffeeHouse的產(chǎn)品，并繼續(xù)工作。”
阿離是一名廚師，住在一個(gè)小城市，大部分時(shí)間在晚上工作。白天，阿離會(huì)參加3-4小時(shí)的在線編程訓(xùn)練營，學(xué)習(xí)一項(xiàng)新的就業(yè)技能。他們通常在當(dāng)?shù)氐目Х鹊赀M(jìn)行新兵訓(xùn)練營，但有時(shí)會(huì)因?yàn)樽挥邢薅械骄趩省Ｋ麄冞€擔(dān)心，如果他們站起來點(diǎn)新的咖啡或食物，會(huì)失去他們的桌子。阿離可以使用CoffeeShop應(yīng)用程序預(yù)訂店內(nèi)工作區(qū)，并在顧客到達(dá)后通過該應(yīng)用程序下單。
無障礙設(shè)計(jì)是為殘疾人設(shè)計(jì)產(chǎn)品、設(shè)備、服務(wù)或環(huán)境。無障礙設(shè)計(jì)是考慮所有用戶的旅程，牢記他們的永久性、臨時(shí)性或情境性殘疾。通過研究殘疾人如何與你的產(chǎn)品互動(dòng)，你可以更好地理解如何為他們?cè)O(shè)計(jì)。我們不可能準(zhǔn)確猜測用戶體驗(yàn)產(chǎn)品的所有方式，這也是為什么在你的研究中包含殘疾人是如此重要的原因之一。
當(dāng)你在設(shè)計(jì)過程的共情階段進(jìn)行研究時(shí)，需要考慮以下幾點(diǎn)。
你會(huì)如何為那些只使用一只手的用戶設(shè)計(jì)，無論是永久的、暫時(shí)的還是情境的?
你將如何為那些視力有限的用戶設(shè)計(jì)，無論是永久的、暫時(shí)的還是情境的?
使用更大的字體來設(shè)計(jì)更適合讀者的應(yīng)用程序。
確保應(yīng)用程序和圖像有可被屏幕閱讀器讀取的替代文本。
檢測用戶是否在駕駛機(jī)動(dòng)車。
使用高對(duì)比度的顏色設(shè)計(jì)應(yīng)用程序。
不要依賴文本顏色來解釋導(dǎo)航或下一步操作。例如，不要單獨(dú)使用紅色文本作為警告的指示。相反，你的設(shè)計(jì)應(yīng)該包含明確的說明。
可定制的文本
還有一些額外的網(wǎng)頁輔助工具，有閱讀障礙或其他視覺處理障礙的人可以從中受益。其中一種方法是自定義文本，該特性允許用戶更改文本的顯示方式，以便更容易地閱讀文本。文本定制包括更改從顏色或字體到文本大小甚至間距的所有內(nèi)容。例如，有些字體可能更便于用戶閱讀，因此定制字體可能會(huì)有很大幫助。因此，可定制文本提供了比簡單地放大或放大文本更多的選項(xiàng)，使內(nèi)容更具適應(yīng)性，同時(shí)保持功能。
你會(huì)如何為那些永久性、暫時(shí)性或情境性聽力受限的用戶進(jìn)行設(shè)計(jì)?
不要僅僅依靠聲音來提供應(yīng)用更新，比如新消息通知。相反，應(yīng)該啟用觸覺技術(shù)，即吸引用戶觸覺的振動(dòng)和通知燈。
對(duì)所有視頻應(yīng)用封閉字幕。
在應(yīng)用程序中提供一個(gè)文本消息系統(tǒng)，允許用戶通過書寫進(jìn)行交流。
你會(huì)如何為那些永遠(yuǎn)、暫時(shí)或情境性不能說話的用戶設(shè)計(jì)?
在為殘疾用戶設(shè)計(jì)時(shí)，這個(gè)列表只是需要考慮的一小部分。了解如何改進(jìn)你的設(shè)計(jì)的最好方法是進(jìn)行研究并直接從殘疾人那里獲得反饋。
創(chuàng)造一個(gè)考慮到每個(gè)能力范圍的產(chǎn)品設(shè)計(jì)是非常困難的。值得慶幸的是，有一些服務(wù)和應(yīng)用程序旨在幫助彌合這一差距。例如，手機(jī)供應(yīng)商最近新增的一項(xiàng)服務(wù)是“實(shí)時(shí)短信”(Real-Time text)，用戶可以在打電話時(shí)發(fā)短信，以改善溝通。
另一個(gè)幫助殘疾人的功能是替代文本。視力低下或失明的人通常依賴屏幕閱讀器大聲朗讀屏幕上的內(nèi)容。但是，如果信息圖標(biāo)沒有標(biāo)簽或替代文本，屏幕閱讀器就無法向用戶描述該按鈕的功能。不是每個(gè)圖像或圖標(biāo)都是信息，所以只在必要的時(shí)候添加描述。
研究和學(xué)習(xí)輔助技術(shù)將幫助您更好地理解這些技術(shù)的影響。這里有一些鏈接可以幫助你開始:
討論殘疾技術(shù)的價(jià)值:YouTube上TEDx演講中的殘疾技術(shù)
https://www.youtube.com/watch?v=eFkhFxJZvho
科技的可達(dá)性如何改變生活:盲人如何利用科技從YouTube上的TEDx演講中看到世界
https://www.youtube.com/watch?v=0EQOZRIA-nA
智能手機(jī)可訪問性:來自Uswitch的全面指南
https://www.uswitch.com/mobiles/guides/smartphone-accessibility/
谷歌無障礙信息中心主頁
https://www.google.com/accessibility/
為了將包容性設(shè)計(jì)付諸實(shí)踐，重要的是讓自己沉浸在殘疾人可能使用的輔助技術(shù)中，并與他們討論他們的經(jīng)歷。為你周圍的世界進(jìn)行同理心設(shè)計(jì)的最好方法是與你的用戶互動(dòng)，并詢問他們你的設(shè)計(jì)可以幫助他們成功的方法。
要了解更多關(guān)于包容性設(shè)計(jì)的知識(shí)，這里有一些額外的資源可以幫助你入門:
描述方法設(shè)計(jì)產(chǎn)品包容性:包容性設(shè)計(jì):12種方法為每個(gè)人設(shè)計(jì)從Shopify
https://www.shopify.com/partners/blog/inclusive-design
谷歌的包容性設(shè)計(jì)的無障礙方法:從谷歌I/O的包容性設(shè)計(jì)的無障礙過程
https://www.youtube.com/watch?v=TAzkrXTGEOM&feature=emb_title
分解重要的包容性設(shè)計(jì)原則:來自UX Planet的6條包容性設(shè)計(jì)原則
https://uxplanet.org/6-principles-for-inclusive-design-3e9867f7f63e
坡道與相鄰街道形成坡道的人行道的斜面
人行道斜坡效應(yīng) Curb-cut effect
路沿切割通常在十字路口發(fā)現(xiàn)。多虧了路緣切割，坐輪椅、腿支架或拐杖的人可以更自由地在他們的社區(qū)里穿行。但是，有趣的是:削減路沿的好處延伸到每個(gè)人，從推嬰兒車的人到騎自行車的人，搬家的人，和老年人。很有可能，路邊停車對(duì)你也有幫助。路緣切割已經(jīng)成為無障礙設(shè)計(jì)的一個(gè)非常流行的例子，現(xiàn)在有一個(gè)完整的概念以它命名。
“人行道斜坡效應(yīng)”是一種現(xiàn)象，描述的是為殘疾人設(shè)計(jì)的產(chǎn)品和政策如何最終幫助到所有人。
識(shí)別用戶面臨的問題是用戶體驗(yàn)設(shè)計(jì)中最重要的部分之一。在這篇閱讀中，你將學(xué)習(xí)如何定義用戶未說出口的痛點(diǎn)，并利用它們形成強(qiáng)有力的問題陳述。
痛點(diǎn)：任何讓用戶受挫并阻礙他們獲得所需內(nèi)容的用戶體驗(yàn)問題。
想想遛狗應(yīng)用和我們的一個(gè)用戶角色，Arnold。Arnold快50歲了，他的孩子們鼓勵(lì)他升級(jí)到智能手機(jī)。Arnold是公司的領(lǐng)導(dǎo)者，他不習(xí)慣承認(rèn)自己對(duì)技術(shù)不適應(yīng)。妻子去世后，Arnold成了家里動(dòng)物的主要照料者。但是，他每周工作60多個(gè)小時(shí)，無法每天兩次帶著他的三條狗散步。Arnold向遛狗軟件求助。
痛點(diǎn)可以分為四類:
財(cái)務(wù)：與金錢相關(guān)的痛點(diǎn)。
產(chǎn)品：與質(zhì)量問題相關(guān)的痛點(diǎn)。
過程：與用戶旅程相關(guān)的痛點(diǎn)。
支持：與從客戶服務(wù)獲得幫助有關(guān)的痛點(diǎn)。
Arnold的痛點(diǎn)屬于過程范疇。他最大的挑戰(zhàn)是他不懂技術(shù)，所以他很難理解如何使用這款應(yīng)用。 要構(gòu)建問題陳述，您可以利用5w1h框架。
用于創(chuàng)建問題陳述的最常用框架是5w1h框架。在定義了用戶的痛點(diǎn)之后，您可以回答誰、什么、何時(shí)、何地、為什么以及如何解決用戶的問題。
誰正在經(jīng)歷這個(gè)問題?
了解用戶及其背景能為用戶設(shè)計(jì)更好的解決方案。
你想要解決的痛點(diǎn)是什么?
盡早確定用戶的痛點(diǎn)可以讓您回答剩下的這些問題，并闡明痛點(diǎn)的上下文。
當(dāng)用戶使用產(chǎn)品時(shí)，他們?cè)谀睦?
用戶的物理環(huán)境對(duì)您的設(shè)計(jì)很重要。
什么時(shí)候出現(xiàn)問題?
也許是漫長而乏味的過程剛剛結(jié)束，也可能是每天都在發(fā)生的事情。知道問題何時(shí)發(fā)生可以幫助您更好地理解用戶的感受。
為什么這個(gè)問題很重要?
了解這個(gè)問題如何影響用戶的體驗(yàn)和生活將有助于明確潛在的后果。
用戶如何使用產(chǎn)品以達(dá)到他們的目標(biāo)?
了解用戶如何達(dá)到他們的目標(biāo)可以讓你繪制用戶通過你的產(chǎn)品的旅程。
以Arnold舉例：
誰:一個(gè)忙碌的主管 。
事情:Arnold想為他的三只狗雇一個(gè)每日遛狗的人。
地點(diǎn):Arnold很可能在工作中，在路上使用這款應(yīng)用。
何時(shí):當(dāng)Arnold打開應(yīng)用程序時(shí)，他會(huì)感到沮喪。
原因:Arnold在手機(jī)應(yīng)用或類似技術(shù)方面沒有太多經(jīng)驗(yàn)。
如何操作:Arnold希望從應(yīng)用程序的主屏幕輕松切換到遛狗者列表，再到確認(rèn)屏幕。
那么，如何創(chuàng)建問題陳述呢?首先定義用戶是誰，他們的需求和動(dòng)機(jī)是什么。
【用戶名】是一個(gè)【用戶特征】ta需要【用戶需求】因?yàn)椤径床臁?
現(xiàn)在把這個(gè)公式應(yīng)用到Arnold身上。Arnold是一個(gè)忙碌的專業(yè)人士，他需要一個(gè)遛狗人。但它的洞察力是什么?他的電話!他的孩子們給了他一部閃亮的新智能手機(jī)。Arnold分享說，他經(jīng)常與技術(shù)作斗爭，在應(yīng)用程序?qū)Ш缴嫌袉栴}。
該問題以人為中心，專注于特定角色的需求；
該問題有發(fā)散的空間；
該問題可以用實(shí)用的設(shè)計(jì)方案來解決；
有兩種常用的方式可以用來陳述解決方案：
如果.....那么....（關(guān)注用戶需求）
如果Arnold下載了遛狗應(yīng)用程序，那么他們就可以利用“簡化”模式設(shè)置只查看應(yīng)用程序的基本功能。
如果Arnold斯注冊(cè)了遛狗軟件，那么他們就可以快速輕松地選擇適合自己時(shí)間表的遛狗者。
我們相信，....將...（從團(tuán)隊(duì)的角度描述并保持對(duì)用戶需求的同理心）
我們相信，Arnold的遛狗應(yīng)用程序的簡化模式將允許他們高效地雇用遛狗者。
我們相信，Arnold可以方便地找到遛狗的人，這將增加他們?yōu)閷櫸镞x擇的散步次數(shù)。
該方案說明了一個(gè)具體的操作，并能夠說明解決方案應(yīng)該讓用戶做什么；
該方案成功滿足用戶需求的期望結(jié)果；
我們?nèi)绾问褂玫侥壳盀橹箻?gòu)建的所有內(nèi)容（共情地圖、人物角色、用戶故事、問題陳述和假設(shè)陳述）讓用戶認(rèn)為，“我必須擁有這個(gè)!” 。答案是：從定義產(chǎn)品的價(jià)值主張開始。
價(jià)值主張總結(jié)了消費(fèi)者為什么應(yīng)該使用一種產(chǎn)品或服務(wù)。
價(jià)值主張的例子：
看看一個(gè)你可能認(rèn)識(shí)的產(chǎn)品——Gmail——然后問問你自己，你是否能認(rèn)出它的一些價(jià)值主張。當(dāng)谷歌在2004年推出Gmail時(shí)，他們進(jìn)入了一個(gè)已經(jīng)非常擁擠的免費(fèi)電子郵件服務(wù)市場。Gmail提供:
免費(fèi)收發(fā)電子郵件
電子郵件分類、歸檔和星星功能
垃圾郵件過濾
電子郵件對(duì)話視圖
1g的云存儲(chǔ)
清單上的兩項(xiàng)是當(dāng)時(shí)其他電子郵件服務(wù)無法提供的獨(dú)特服務(wù):電子郵件對(duì)話視圖，它將單個(gè)電子郵件放在更大的線程上下文中;還有整整1gb的存儲(chǔ)空間，這是競爭對(duì)手提供的存儲(chǔ)空間的1000倍。這些都是Gmail獨(dú)特的價(jià)值主張。
你的產(chǎn)品所提供的一切對(duì)你來說可能是顯而易見的，但你必須把自己放在用戶的心里。用戶還不知道你的產(chǎn)品，也不了解它的價(jià)值。這就是價(jià)值主張的用武之地。
首先，你需要做一些調(diào)查，以回答以下兩個(gè)問題:
一旦你回答了這些問題，你就可以遵循一系列的步驟來專注于你的產(chǎn)品獨(dú)特的價(jià)值主張。讓我們以遛狗應(yīng)用程序?yàn)槔齺硖剿鬟@是如何工作的。
列出你的產(chǎn)品的所有偉大的功能和好處，無論大小。列出所有想到的東西，然后再縮小范圍。
任何你確定為價(jià)值主張的東西都需要對(duì)你的用戶有益。在本例中，對(duì)于遛狗應(yīng)用程序，在用戶訪談中確定了四類產(chǎn)品價(jià)值:可訪問性、遛狗者的專業(yè)體驗(yàn)、成本和可靠性。第一步的功能和好處被分成了這四個(gè)類別。
最初的列表中有一些功能和好處不屬于這四個(gè)類別，并沒有為用戶增加真正的“價(jià)值”:
每月為您的寵物提供有機(jī)食品和新產(chǎn)品資訊
專門供遛狗使用(不含其他寵物)
遛狗者分級(jí)系統(tǒng)
培訓(xùn)技巧
這些特性和好處沒有被分類到這四類，而是被放在了一邊。
我們的目標(biāo)是確定對(duì)用戶真正有價(jià)值的東西，而不僅僅是用戶沒有要求的酷功能。為了確定價(jià)值，將你所開發(fā)的人物角色與滿足其最大痛點(diǎn)的價(jià)值主張配對(duì)。
通過將它們與實(shí)際用戶需求相匹配，您已經(jīng)縮小了大量好處和功能的范圍。現(xiàn)在是時(shí)候回顧你的產(chǎn)品提供的價(jià)值主張清單了。對(duì)于遛狗應(yīng)用程序，以下是與早期開發(fā)的人物角色相匹配的價(jià)值主張:
這就是你的價(jià)值主張清單!然而，您的競爭對(duì)手也提供了其中的一些功能和好處。那么，你如何知道是什么讓你的產(chǎn)品在競爭中脫穎而出呢?確定應(yīng)用的獨(dú)特價(jià)值定位。這意味著要重新審視與你的人物角色相匹配的價(jià)值主張列表，并刪除競爭對(duì)手也提供的價(jià)值主張。
了解你的產(chǎn)品的競爭對(duì)手的方法之一是閱讀評(píng)論。將評(píng)論從低到高進(jìn)行排序，仔細(xì)檢查評(píng)論者對(duì)你的競爭對(duì)手分享了什么。以下是一款競品遛狗應(yīng)用的一些評(píng)論:
你能在這個(gè)例子中找出最大的痛點(diǎn)嗎?在一些評(píng)論中，一個(gè)共同的主題是需要對(duì)遛狗者進(jìn)行徹底的、面對(duì)面的培訓(xùn)，以確保遛狗者知道如何做好他們的工作。一些評(píng)論還呼吁遛狗者需要可靠。沒有其他遛狗應(yīng)用程序可以滿足這種需求，所以這是我們的應(yīng)用程序可以提供的獨(dú)特價(jià)值主張!
關(guān)于價(jià)值主張最重要的一點(diǎn)是，它們必須簡短、清晰、切中要點(diǎn)。用戶希望能夠很容易地準(zhǔn)確地確定您的產(chǎn)品將如何滿足他們的獨(dú)特需求，以及是什么使您的產(chǎn)品在市場上與眾不同。有時(shí)候用戶不知道他們需要什么，除非你向他們解釋。這才是產(chǎn)品設(shè)計(jì)創(chuàng)新的真正核心。
設(shè)計(jì)師需要了解我們是為誰解決問題，他們的需求是什么。我們可以通過用創(chuàng)建共情圖、角色模型、用戶故事和用戶旅程圖
首先我們需要定義好所面臨的問題，這樣團(tuán)隊(duì)中的所有成員才能為了解決同一個(gè)問題而集中發(fā)力。明確我們所面臨的問題也可以幫助我們始終將用戶需求放在第一位。
我們需要一個(gè)舒適的空間，讓團(tuán)隊(duì)中的每個(gè)人都可以聚在一起表達(dá)各自的想法。如果是線下會(huì)議，建議選擇一個(gè)不同于平常工作環(huán)境的創(chuàng)意空間。如果是遠(yuǎn)程會(huì)議，可以在家里找一個(gè)容易集中精力的地方。
日常的設(shè)計(jì)工作是無窮無盡的，我們需要給自己充分的時(shí)間去創(chuàng)意想法。然而，你不能一直頭腦風(fēng)暴，所以需要設(shè)置頭腦風(fēng)暴的限定時(shí)間并且開始更深刻地思考你想出來的創(chuàng)意點(diǎn)。
一個(gè)由不同種族、性別、能力和背景的成員組成的包容性的團(tuán)隊(duì)，將幫助你想出各種各樣的解決方案。
不要把自己局限于傳統(tǒng)的想法和解決方案，我們需要天馬行空的創(chuàng)意。如果你有一個(gè)看起來與眾不同的很酷的想法，把它寫下來!
擴(kuò)展閱讀
https://careerfoundry.com/en/blog/ux-design/what-is-ideation-in-design-thinking/
https://designthinking.ideo.com/
競品分析是對(duì)競爭對(duì)手優(yōu)勢(shì)劣勢(shì)的分析，可以從中獲取產(chǎn)品的基本市場情況，也可以幫助我們?cè)O(shè)計(jì)出對(duì)用戶更有幫助和更獨(dú)特的產(chǎn)品。競品可以分為兩種：直接和間接。直接競品與你的產(chǎn)品功能相近、用戶群體相同。間接競品與你的產(chǎn)品功能相近但用戶群體不同，或用戶群體相似但功能不同。
案例項(xiàng)目背景：假設(shè)你正在為你的新客戶花園漢堡進(jìn)行關(guān)于快餐漢堡餐廳的競品研究?；▓@漢堡認(rèn)為他們目前的網(wǎng)站缺少吸引力，獲客少，他們想讓你幫助公司重新設(shè)計(jì)他們的網(wǎng)站。
目標(biāo)：比較競品網(wǎng)站的用戶體驗(yàn)
使用一致的維度來梳理競品信息可以幫助我們更加直觀地對(duì)競品評(píng)級(jí)。
推薦評(píng)級(jí)標(biāo)準(zhǔn)：
需改進(jìn)：無法滿足用戶需求
良好：有缺陷，但可以滿足用戶需求
優(yōu)秀：較好地滿足用戶需求，但易用性有待提升
卓越：符合或超出用戶預(yù)期，并且體驗(yàn)一致
可以詢問客戶來了解他們的直接或間接對(duì)手有哪些。比如花園漢堡認(rèn)為漢堡來了是他們的直接競爭對(duì)手，而你根據(jù)自己的研究發(fā)現(xiàn)約翰漢堡和小高牛肉漢堡是與花園漢堡在同一區(qū)域的漢堡餐廳，因此他們是兩個(gè)更直接的競品。同時(shí)，你還發(fā)現(xiàn)有個(gè)叫素食漢堡的間接競品，他們網(wǎng)站上的圖片非常吸引人。通過以上信息，我們可以構(gòu)建競品分析圖表的框架如下：
舉例：
第一印象：網(wǎng)絡(luò)是否有延遲？跨設(shè)備的適配怎么樣？你覺得這個(gè)網(wǎng)站怎么樣？
交互：有哪些功能？是不是所有用戶都可以訪問網(wǎng)站？對(duì)不使用英語的用戶包容性如何？在使用過程中是否會(huì)感到困惑？導(dǎo)航是否清晰？
視覺設(shè)計(jì)：視覺是否一致？品牌是否與目標(biāo)用戶匹配？頁面設(shè)計(jì)是否讓人難忘？
文案內(nèi)容：文案內(nèi)容是否符合公司品牌？用戶可以找到他們感興趣的細(xì)節(jié)嗎？
可以將列舉出來的維度放在競品分析表的第一行，然后我們需要填寫每一個(gè)競品的這些信息。
目標(biāo)群體
調(diào)研發(fā)現(xiàn)，千禧一代及其家庭是競爭對(duì)手們的主要目標(biāo)群體，其次是z世代的大學(xué)生。這與花園漢堡的目標(biāo)群體非常相似。只有素食漢堡的目標(biāo)群體不同，因此它被列入間接競品中。
第一印象
第一印象最好的是小高牛肉漢堡和素食漢堡。兩者的圖片都很清晰且吸引人，網(wǎng)站的響應(yīng)速度很快。漢堡來了和約翰漢堡的網(wǎng)站不太容易記住，它們的導(dǎo)航很清晰，但是布局需要改進(jìn)一下。 就手機(jī)網(wǎng)站體驗(yàn)來說，只有漢堡來了沒有做好適配，手機(jī)端的間距不對(duì)，導(dǎo)致一些信息看不到。 評(píng)分較低的網(wǎng)站最大的問題是菜單，有時(shí)菜單無法訪問或展示的形式難以閱讀。這絕對(duì)是你重新設(shè)計(jì)漢堡花園網(wǎng)站時(shí)要注意的事情!
交互
小高牛肉漢堡的網(wǎng)站有加載動(dòng)畫，約翰漢堡的網(wǎng)站首頁有很多不必要的內(nèi)容使得人們很難找到他們想要的重要信息。另外，清晰的導(dǎo)航（明確哪些元素可點(diǎn)擊，哪些不可點(diǎn)擊）在網(wǎng)站設(shè)計(jì)中非常重要，素食漢堡在這方面做的很好，具有定位商店等功能和全面的可訪問性，包含多種語言選項(xiàng)并且兼容多種瀏覽器。
視覺設(shè)計(jì)
網(wǎng)站清晰和一致的視覺設(shè)計(jì)可以吸引用戶去了解產(chǎn)品和公司?；▓@漢堡目前的網(wǎng)頁設(shè)計(jì)非常扎實(shí)，但是存在一些優(yōu)化點(diǎn)可以更好地反應(yīng)他們的品牌調(diào)性。
小高牛肉漢堡和素食漢堡通過獨(dú)特的顏色、字體和圖片傳達(dá)他們的品牌。約翰漢堡和漢堡來了缺少一致的網(wǎng)站風(fēng)格設(shè)計(jì)，約翰漢堡并沒有很好地傳達(dá)自身品牌
文案內(nèi)容
文案的描述也是傳達(dá)公司品牌和吸引用戶的另一個(gè)好辦法。大多數(shù)花園漢堡的競品都使用吸引注意和有趣的語言來迎合他們的客戶。花園漢堡的語言基調(diào)有一些不一致，并且沒有它的競品那樣感覺讓人放松。
總的來說，競品的內(nèi)容簡短且易于理解。漢堡花園目前的網(wǎng)站描述顯得有些枯燥和冗長。
在進(jìn)行研究、收集數(shù)據(jù)和分析洞察之后需要進(jìn)行總結(jié)。需要根據(jù)競品分析目標(biāo)來梳理報(bào)告中的內(nèi)容以及呈現(xiàn)洞察。
例如，如果競品分析目標(biāo)是對(duì)了比較競爭對(duì)手的目標(biāo)群體，我們可以使用一些信息圖形來呈現(xiàn)數(shù)據(jù)?；蛘?，目標(biāo)重點(diǎn)是視覺設(shè)計(jì)，我們可以截取競品的圖片并突出顯示重點(diǎn)區(qū)域。
可以使用ppt或書面文檔的形式來展現(xiàn)競品分析報(bào)告，ppt會(huì)更有視覺沖擊力表現(xiàn)形式更豐富，但需要花費(fèi)更多的時(shí)間。書面文檔寫起來很方便，如果你的報(bào)告對(duì)象比較少，建議使用書面文檔。
概述研究問題、研究方法以及與競品相比較的一些產(chǎn)品特征，這部分內(nèi)容可以讓團(tuán)隊(duì)對(duì)競品分析的目標(biāo)有一個(gè)清晰的認(rèn)知。
為了更好地向聽眾傳達(dá)信息結(jié)構(gòu)，在每個(gè)部分開始前需要有一個(gè)標(biāo)題頁，就像下圖所示：
下一步，總結(jié)你從競品身上學(xué)到的以及跟自身產(chǎn)品的對(duì)比。一定要指出本產(chǎn)品的優(yōu)勢(shì)和可以改進(jìn)的機(jī)會(huì)點(diǎn)。
在你組織信息呈現(xiàn)的時(shí)候，要注意思考如何最有效地展現(xiàn)你的洞察點(diǎn)。保持整體設(shè)計(jì)簡單和干凈，避免雜亂，讓聽眾能聚焦在重要信息。
最后，總結(jié)關(guān)鍵點(diǎn)。競品最多可以比較10家公司，這里面的信息量非常大，總結(jié)概括最重要的信息來幫助聽眾記憶。
有效地展示數(shù)據(jù)
展示數(shù)據(jù)的方式會(huì)影響聽眾的解讀，不同類型的數(shù)據(jù)需要用到不同的展現(xiàn)形式。例如，你的報(bào)告有很多數(shù)字或量化數(shù)據(jù)，一個(gè)圖表或圖表可以幫助聽眾比較數(shù)據(jù)。為了演示競品的特定功能或問題，可以在演示中加入錄屏視頻。
最后，可以加入你在競品分析中使用到的評(píng)分標(biāo)準(zhǔn)的說明。例如，我們?cè)谑纠袑⒃u(píng)級(jí)分為“需改進(jìn)”到“卓越”，對(duì)應(yīng)每間餐廳在每個(gè)類別中以1到4的等級(jí)，從而形成最終的評(píng)級(jí)。
其他小提示
《福布斯》的這篇文章將幫助你緩解演講時(shí)的緊張感，聽聽來自專家的關(guān)于與聽眾溝通的建議：
https://www.forbes.com/sites/markfidelman/2014/08/15/20-world-class-presentation-experts-share-their-top-tips/?sh=2920b075c40d
“我們?nèi)绾文軌?How might we (HMW)”是一種將問題轉(zhuǎn)化為設(shè)計(jì)機(jī)會(huì)的設(shè)計(jì)思維活動(dòng)。HMW可以激發(fā)設(shè)計(jì)師的創(chuàng)造力，并引導(dǎo)設(shè)計(jì)師從不同的角度思考問題，從而想出各種各樣的解決方案。要想創(chuàng)建好的HMW問題，我們需要一個(gè)好的問題陳述來定義問題。
假設(shè)用戶Darren面臨一個(gè)問題:Darren是一個(gè)音樂會(huì)觀眾，他需要一直拿著音樂會(huì)門票，因?yàn)樗麄冊(cè)谕ㄟ^安檢時(shí)需要門票。
放大好處（如何利用問題中的積極因素來解決問題）
我們?cè)鯓硬拍苁褂涗涢T票成為朋友間的一種有趣的競爭呢?
探索相反的方向（將如何解決你所列出的問題的反面）
我們?cè)鯓硬拍馨l(fā)明一種不用拿著票的方法呢?
改變現(xiàn)狀（想想完全改變這個(gè)過程的方法）
我們?nèi)绾沃谱鞣羌堎|(zhì)的音樂會(huì)門票?
將POV分解為碎片（這對(duì)于長時(shí)間、復(fù)雜的問題尤其有幫助）
我們?cè)鯓硬拍苁诡櫩偷钠辈粊G失呢?我們?cè)鯓硬拍茏尠踩珗F(tuán)隊(duì)更容易處理丟失的機(jī)票呢?
消除壞處（想想如何完全消除問題中消極的部分）
我們?cè)鯓硬拍茏屢魳窌?huì)觀眾不需要門票就能進(jìn)入場館呢?
改變現(xiàn)狀（把消極的形容詞試著變成積極的）
我們?cè)鯓硬拍苁归T票持有者在進(jìn)入音樂會(huì)場地時(shí)不那么緊張呢?
質(zhì)疑假設(shè)（刪除或更改任何有質(zhì)疑的流程）
我們?nèi)绾卧谝魳窌?huì)中取消安全檢查程序?
根據(jù)需要或上下文創(chuàng)建一個(gè)類比（考慮將這個(gè)用戶體驗(yàn)與另一個(gè)用戶體驗(yàn)進(jìn)行比較的方法）
我們?cè)鯓硬拍茏屚ㄟ^安檢像玩電子游戲一樣?
識(shí)別意外資源（考慮一下如何通過問題陳述中沒有提到的資源來解決問題）
如何使用面部識(shí)別軟件幫助管理音樂會(huì)入場?
開放的
一個(gè)好的HMW模型應(yīng)該允許多個(gè)解決方案。例如“我們?nèi)绾问垢欓T票變得有趣和有競爭力？”可以用無數(shù)種方式來回答。
不要太寬泛
HMW是全面的，但要足夠聚焦，才能關(guān)注到解決方案的重點(diǎn)。一個(gè)過于寬泛的HMW問題的例子：“我們?nèi)绾尾拍苁蛊眲?wù)更好?”這個(gè)HMW沒有為提出解決方案的想法提供足夠明確的指導(dǎo)。
進(jìn)行多次修改
在寫完HMW問題后，可以修改它們。如果你發(fā)現(xiàn)你的HMW不能幫助你想出任何有用的解決方案，那就改變它!
創(chuàng)造性的
HMW意味著富有想象力，甚至是有趣的。你可以使用上面斯坦福大學(xué)列出的建議，想出新的、有創(chuàng)意的方法來組織你的問題。
寫盡可能多的HMW
你擁有的HMW越多，你就能想出更多的解決方案。如果你能從所學(xué)的一個(gè)框架中提出不止一個(gè)問題，那就大膽寫下所有！
將一張紙對(duì)折3次，得到8個(gè)用劃痕劃分的模塊，分別記錄下8個(gè)設(shè)計(jì)創(chuàng)意點(diǎn)。相比于電腦，紙更加快速方便，只需要八分鐘，你就可以獲得八個(gè)解決方案并且非常方便團(tuán)隊(duì)交流。注意要控制創(chuàng)意時(shí)間，大概1分鐘畫1個(gè)方案草圖。每個(gè)人選擇兩三個(gè)自己認(rèn)為優(yōu)秀的方案和團(tuán)隊(duì)成員共享交流，選出最好的方案，然后繼續(xù)細(xì)化。
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請(qǐng)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系。
作者：騰訊ISUX團(tuán)隊(duì) 來源：伊糖巷陌
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
01
什么是靈動(dòng)島（Dynamic island）
2022蘋果秋季新品發(fā)布會(huì)，備受關(guān)注的新一代iPhone如期而至，此次發(fā)布會(huì)最大的亮點(diǎn)是iPhone 14 Pro系列一改之前「劉?！乖O(shè)計(jì)，首次采用了「藥丸」挖孔屏。雖然「藥丸」在安卓陣營中并不是什么新鮮玩意，但一向以創(chuàng)新著稱的蘋果還是玩出了不一樣的花樣，帶來了全新的交互方式，模糊了硬件和軟件的界限，通過實(shí)時(shí)變化顯示重要的提醒、通知以及簡單的功能操作，蘋果把這一創(chuàng)新稱之為靈動(dòng)島（Dynamic island）。
02
靈動(dòng)島能做什么 / 不能做什么
靈動(dòng)島其實(shí)可以簡單的理解為基于前置攝像頭區(qū)域拓展的消息通知和快捷操作的新交互方式。
來電
當(dāng)有來電時(shí)，靈動(dòng)島會(huì)發(fā)生變化，并在后臺(tái)打電話時(shí)顯示通話時(shí)間和聲音波紋。
音樂
有點(diǎn)類似于鎖屏后的音樂功能操作，保留了基本的播放、暫停、前進(jìn)、后退等功能。
Airpods
連接AirPods后，AirPods的型號(hào)外觀和當(dāng)前電量會(huì)一起顯示。
導(dǎo)航
顯示導(dǎo)航方向和距離，并且能夠在適當(dāng)?shù)臅r(shí)候放大顯示更多導(dǎo)航信息。
Face ID
以前Face ID認(rèn)證會(huì)顯示在屏幕中間，現(xiàn)在集成于靈動(dòng)島的擴(kuò)展功能之中。
充電
當(dāng)充電時(shí)，會(huì)顯示充電的狀態(tài)以及當(dāng)前電量百分比。
當(dāng)然，目前除了官方展示的這些功能以外，還會(huì)有更多的應(yīng)用方式，在此不一一列舉。但靈動(dòng)島也并不是萬能的，例如會(huì)存在以下的局限性：
重度使用場景
從官方給出的樣例來看，靈動(dòng)島更多的是承擔(dān)了消息通知和提醒的作用，并不適用于重度使用和復(fù)雜交互等場景，例如消息聊天、刷短視頻、買賣交易等等。
過于復(fù)雜的圖形
受限于前置物理攝像頭，靈動(dòng)島這個(gè)區(qū)域并不能顯示過于復(fù)雜的圖形，并需要避開攝像頭區(qū)域，因?yàn)樵搮^(qū)域是不能顯示任何圖像的。
軟硬件的邊界
靈動(dòng)島的實(shí)際效果并不會(huì)像宣傳圖中那樣好，特別是在反光強(qiáng)烈的戶外。攝像頭的挖孔清晰可見的，即使是在黑色不發(fā)光的OLED屏幕上，軟件和硬件的界限還是能夠明顯區(qū)分。
03
對(duì)于靈動(dòng)島的各方反應(yīng)
新事物的出現(xiàn)，總會(huì)伴隨著支持和反對(duì)兩種聲音，此次靈動(dòng)島的創(chuàng)新交互，自然也是褒貶不一，還需要經(jīng)受時(shí)間的考驗(yàn)，因?yàn)榧词故翘O果這樣的公司也難免會(huì)犯錯(cuò)，比如3D Touch、MacBook上的Touch bar等。
支持方認(rèn)為「靈動(dòng)島是繼劉海屏之后的又一個(gè)成功設(shè)計(jì)，甚至?xí)絼⒑Ｆ?，更受歡迎」。
「靈動(dòng)島的設(shè)計(jì)非常討巧，同時(shí)也給挖孔屏帶來了更多的想象空間」。
而反對(duì)方的理由也十分充分，首先是羅永浩第一時(shí)間發(fā)表了自己的觀點(diǎn)，表面上是硬贊這個(gè)創(chuàng)新，但實(shí)則是諷刺了這樣多此一舉的方式，「先在臉上涂屎，然后再把屎的顏色調(diào)整得跟粉底差不多」
很多的輿論認(rèn)為，靈動(dòng)島的創(chuàng)新是蘋果的一種無奈和妥協(xié)，因?yàn)樽詮牡谝淮鷌Phone革新性的使用觸摸屏之后，十多年以來手機(jī)在工業(yè)設(shè)計(jì)方面并沒有太多的創(chuàng)新，大部分廠家是在屏幕分辨率，后蓋材質(zhì)，攝像頭像素上面做文章，而蘋果作為一個(gè)工業(yè)設(shè)計(jì)創(chuàng)新的公司，也只能通過后置攝像頭模組的排列來維持每一代iPhone的變化。所以此次靈動(dòng)島的創(chuàng)新，被認(rèn)為是工業(yè)設(shè)計(jì)乏力之后推動(dòng)交互設(shè)計(jì)創(chuàng)新的無奈之舉。
但無論支持還是反對(duì)，前置攝像頭挖孔屏終究是一個(gè)過渡性的方案，最終會(huì)被全面屏所替代，而在這個(gè)過渡時(shí)期，很明顯蘋果的解決思路與國內(nèi)的絕大多數(shù)廠商都不一樣。
04
為什么國產(chǎn)手機(jī)不做靈動(dòng)島
國產(chǎn)手機(jī)的前置攝像頭解決方案除了「劉?！挂酝?，單攝像頭「圓孔」和雙攝像頭「藥丸」設(shè)計(jì)都已經(jīng)非常成熟，但是為什么經(jīng)過這么多年的迭代，依然沒有創(chuàng)新呢？
思維方式的差異
國產(chǎn)手機(jī)廠商的思路跟蘋果相反，希望盡可能的把前置攝像頭做得越小越好，甚至頭部的廠商嘗試探索升降攝像頭和屏下攝像頭的解決方案，目的就是為了把前置攝像頭隱藏。而蘋果的思路則是，既然現(xiàn)階段的技術(shù)沒有辦法把前置攝像頭隱藏，那么干脆就以此為基礎(chǔ)，把這個(gè)區(qū)域運(yùn)用到極致。
缺少創(chuàng)新和引領(lǐng)者
似乎國內(nèi)的用戶更關(guān)心的是電量是否持久、屏幕刷新率高不高、拍照功能強(qiáng)不強(qiáng)大等問題，秉持著「人民需要什么，我們就造什么」的成功理念，各大廠商也開始在這些方面內(nèi)卷，從60Hz到120Hz刷新率，從千萬像素到一億像素，從萊卡加持到一英寸大底傳感器... 大家都在做從1到100的事情，而很少有關(guān)注從0到1，因?yàn)檫@樣做的性價(jià)比的確不高。
市場的接受和認(rèn)可程度
當(dāng)劉海屏第一次出現(xiàn)的時(shí)候，很多用戶都在吐槽，其中也包括很多蘋果的忠實(shí)用戶，寧愿買iphone8P也不愿意使用劉海屏的iPhone X。而經(jīng)過一兩年的審美教育以及國產(chǎn)手機(jī)的跟風(fēng)之后，才慢慢的被更多用戶所接受。因此國內(nèi)的廠商很難有信心通過一己之力去改變用戶習(xí)慣，并贏得市場的認(rèn)可。我相信，蘋果發(fā)布以后，各大廠商已經(jīng)在積極的學(xué)習(xí)和模仿，新的一輪內(nèi)卷即將拉開帷幕。
即便如此，國產(chǎn)廠商也并不是完全沒有在前置攝像頭的區(qū)域努力嘗試過。例如魅族曾經(jīng)在前置攝像頭上顯示當(dāng)前電量，稱之為「環(huán)形電量」，并盡可能的使其與狀態(tài)欄的其它信息融為一體。
榮耀的通話時(shí)間膠囊和自拍膠囊，都以前置攝像頭為基礎(chǔ)做延展，可以看得出在想盡辦法的規(guī)避前置攝像頭所帶來的不好體驗(yàn)。
雖然VIVO的原子通知不是圍繞前置攝像頭區(qū)域拓展，但從效果和想法來看，也與靈動(dòng)島的概念比較類似。
HTC曾經(jīng)出過一款HTC U Ultra，當(dāng)然那時(shí)候還沒有全面屏的概念，所以HTC把它稱之為副屏，可以顯示消息通知、音樂播放操作、App快捷入口等等。
除此以外，幾乎所有劉海屏的手機(jī)都有把劉海隱藏起來的功能。
05
對(duì)設(shè)計(jì)師的影響
靈動(dòng)島的出現(xiàn)，對(duì) iOS 原本通知、交互、卡片、彈窗等一系列交互規(guī)范進(jìn)行了解構(gòu)再重做，就好比「劉海屏」首次出現(xiàn)的時(shí)候，需要設(shè)計(jì)師對(duì)全新交互邏輯、卡片行為、動(dòng)畫等重新適配。那么對(duì)于「靈動(dòng)島」我想需要考慮的是這幾個(gè)方面。
新的交互方式
之所以叫靈動(dòng)島，就是因?yàn)樗恰胳`動(dòng)」的，擁有不同的狀態(tài)變化，以適應(yīng)各種功能提示和操作。設(shè)計(jì)師在使用這個(gè)功能的時(shí)候，需要充分考慮其場景，恰如其分的給予提醒而不給用戶帶來過多的打擾。
新的容器
不同形態(tài)的容器可以裝載不同的內(nèi)容，相比于以往常規(guī)的通知提醒，新的容器可以展示更多的信息，甚至是簡單的功能操作。在提出解決方案的時(shí)候，留給設(shè)計(jì)師更多的想象空間。
新的表達(dá)方式
靈動(dòng)島相當(dāng)于一個(gè)永遠(yuǎn)在桌面上的島嶼，比任何App的優(yōu)先級(jí)都要高，所以會(huì)成為各個(gè)應(yīng)用的必爭之地，使用一種好的表達(dá)方式，必然能夠達(dá)到事半功倍的效果，因此也是考驗(yàn)設(shè)計(jì)師在寸土寸金的區(qū)域中，通過視覺化手段表達(dá)的能力。
最后，我想蘋果的初衷是為了更好的用戶體驗(yàn)，消除一部分用戶對(duì)于挖孔屏的焦慮，如果能夠真正的站在用戶的角度、克制的去使用新的交互方式，會(huì)得到用戶的喜愛和市場的認(rèn)可。
我認(rèn)為靈動(dòng)島既是一種創(chuàng)新也是一種妥協(xié)，對(duì)于工業(yè)設(shè)計(jì)硬件創(chuàng)新乏力的妥協(xié)，更是對(duì)技術(shù)發(fā)展的妥協(xié)。我也相信，真正的全面屏?xí)r代終究會(huì)到來，期待那個(gè)時(shí)候蘋果再一次給我們帶來真正意義上的，里程碑式的，創(chuàng)新！
電影《再次出發(fā)之紐約遇見你》中有一個(gè)浪漫的場景，男主和女主通過一根耳機(jī)分線器一起聽著音樂，一起感受著當(dāng)下同一段旋律。通過這根分線器，他們分享著自己的歌單，分享著當(dāng)下的情緒，隔絕外界的紛擾，游蕩在大街小巷。
這種聽歌方式我也很喜歡，同樣的歌曲讓人產(chǎn)生了不一樣的感受。我想，可能是陪伴和共鳴賦予了這首歌新的生命力吧!
如今，無需分線器，網(wǎng)易云音樂一起聽可以讓你和那個(gè)TA隨時(shí)一起欣賞音樂、分享心情。前年7月份上線的這個(gè)功能獲得了用戶的一致好評(píng)，之后的數(shù)據(jù)表現(xiàn)也是遠(yuǎn)超預(yù)期。但是，在眾多的用戶反饋中，最多的一個(gè)痛點(diǎn)是：身邊沒有人陪我一起聽，能不能做個(gè)匹配功能，找陌生人一起聽？
站在業(yè)務(wù)的層面考慮，一起聽作為一個(gè)熟人聽歌的功能，在戀人和親密好友之間普及度非常高，但同時(shí)也要考慮當(dāng)這部分用戶數(shù)據(jù)增長到達(dá)瓶頸后，一起聽如何拓展新的用戶群。陌生人一起聽是一個(gè)很好的方向，能夠突破熟人社交的限制，擁抱更多社交關(guān)系拓展的可能性。
為了滿足這一部分用戶的需求，陌生人一起聽的項(xiàng)目在決策層的支持下進(jìn)入了探索階段。這一階段主要想要知道什么樣的產(chǎn)品形態(tài)適合陌生人一起聽，是在原有的熟人一起聽的框架內(nèi)進(jìn)行拓展，還是大膽顛覆更加讓人眼前一亮呢？每位小伙伴都描述著自己的構(gòu)想，朝著不同方向探索。經(jīng)過一輪輪的方案討論，最終我們選擇了“星球”作為框架，來承載陌生人一起聽的設(shè)計(jì)。大概的構(gòu)想是這樣的：當(dāng)我在聽一首歌，感覺孤單并希望有人陪伴時(shí)?？梢酝ㄟ^一個(gè)入口進(jìn)入到一個(gè)由光點(diǎn)組成的星球，每個(gè)光點(diǎn)代表一個(gè)當(dāng)前也在聽這首歌曲的用戶。我可以展示自己的狀態(tài)，和其他的用戶進(jìn)行互動(dòng)。當(dāng)我對(duì)一個(gè)用戶感興趣時(shí)，可以選擇“跟隨”TA，每當(dāng)TA去往另一個(gè)星球（也就是聽其他的歌時(shí)），我也會(huì)自動(dòng)移動(dòng)到那個(gè)星球，跟隨著TA一起聽。
根據(jù)上述設(shè)想，設(shè)計(jì)團(tuán)隊(duì)還產(chǎn)出了一些方案來還原大家心中的“星球”，下面是早期一個(gè)方案的動(dòng)態(tài)演示，黑膠上的封面變化為一個(gè)同色系的星球，每個(gè)光點(diǎn)代表一個(gè)正在聽這首歌的陌生人。
我們將這個(gè)大概構(gòu)想告知開發(fā)同學(xué)后，得知需要的人力和時(shí)間成本遠(yuǎn)超我們預(yù)期。由于決策層希望能夠在一起聽的熱度未退時(shí)盡快上線陌生人版，我們不得不把這個(gè)星球版的方案暫時(shí)擱置，重新構(gòu)想在原有框架內(nèi)的設(shè)計(jì)方案。
決定在原有框架內(nèi)進(jìn)行設(shè)計(jì)后，我們就需要收攏之前發(fā)散的想法。針對(duì)主要需求進(jìn)行設(shè)計(jì)，把有限的資源用到刀刃上。最終確定的產(chǎn)品形態(tài)似乎很簡單直接，點(diǎn)一下按鈕，匹配一個(gè)愿意和我一起聽歌的人，但是到了視覺設(shè)計(jì)階段，就需要考慮更多的問題。
從關(guān)系的角度講。熟人之間比較親密，陌生人之間要保持一定距離，慢慢了解對(duì)方。與熟人一起聽有著穩(wěn)定的預(yù)期，但是陌生人帶來的是不穩(wěn)定，這種不穩(wěn)定可能是緣分和驚喜，也可能是騷擾和驚嚇?？紤]到這種不同，做陌生人一起聽的功能就不能夠完全套用熟人的設(shè)計(jì)，而是要針對(duì)性地進(jìn)行重新思考。
首先，功能的入口能夠給用戶第一印象，我們用了一個(gè)動(dòng)畫表達(dá)兩個(gè)陌生人沉浸在音樂中的含義，兩個(gè)匿名小人安靜地呆在一起，音符環(huán)繞著它們運(yùn)動(dòng)，暗示他們正在一起聽歌。通過這種表達(dá)幫助用戶快速了解功能，同時(shí)渲染氛圍，吸引用戶使用。
在熟人一起聽歌過程中，為了表達(dá)親密，表現(xiàn)形式上采用了耳機(jī)共享，頭像疊放的表現(xiàn)形式。但在陌生人之間，為了避免過于親密，就去掉了耳機(jī)線。為了控制社交距離，頭像不再疊著放了。陌生人的頭像也模糊處理來保持神秘感。
為了保證沒有社交意愿的用戶不被打擾，同時(shí)為了避免社交過程過于快餐化，陌生人一起聽采用了一方申請(qǐng)，另一方同意才可以公開身份的規(guī)則。為了配合這個(gè)規(guī)則，我們?cè)O(shè)計(jì)了陌生人揭面機(jī)制來引導(dǎo)用戶和傳達(dá)信息。匹配成功后，雙方會(huì)先隱藏身份聽歌。以此來鼓勵(lì)用戶盡量關(guān)注音樂本身，而不是純粹為了交友而進(jìn)行一起聽。當(dāng)一起聽了5分鐘后，對(duì)方的面具會(huì)小幅度上下移動(dòng)，暗示用戶可以點(diǎn)擊。點(diǎn)擊對(duì)方的面具后會(huì)發(fā)出公開身份的申請(qǐng)，對(duì)方同意后才可以揭開面具。后續(xù)聽歌過程中，雙方就在身份公開的情況下一起聽歌。如果相處愉快，可以去對(duì)方主頁了解更多信息，甚至互關(guān)成為好友，下一次以熟人的身份邀請(qǐng)一起聽。
“于千萬人之中，遇見你所遇見的人”，這是我們想在匹配的過程中體現(xiàn)的緣分感。受限于開發(fā)成本，匹配動(dòng)畫只能在一個(gè)小小的圓形容器里去設(shè)計(jì)。下面四個(gè)方案是前期的探索稿，主要是把人抽象成一個(gè)個(gè)點(diǎn)，點(diǎn)可能代表一種顏色、一顆星星、一個(gè)光點(diǎn)，點(diǎn)的運(yùn)動(dòng)表達(dá)尋找的過程。
最后選用了第四個(gè)，進(jìn)行最終優(yōu)化后的呈現(xiàn)如下。通過雷達(dá)的轉(zhuǎn)動(dòng)表達(dá)尋找，浮動(dòng)的光點(diǎn)代表一個(gè)個(gè)陌生人，最終受到召喚的那個(gè)TA飛入雷達(dá)范圍，發(fā)出代表回應(yīng)的音波后，變大形成一個(gè)蒙面的頭像。（由于時(shí)間關(guān)系，此動(dòng)畫后半段僅在安卓端實(shí)現(xiàn)）
如果你仔細(xì)地用過一起聽，可能會(huì)發(fā)現(xiàn)雙紅心彩蛋，這份驚喜感也是我們希望讓雙方感受到的。當(dāng)你喜歡了一首對(duì)方也喜歡的歌曲，都會(huì)出現(xiàn)一個(gè)兩個(gè)愛心碰撞出音符的動(dòng)畫，在驚喜的同時(shí)也會(huì)體驗(yàn)到來自陌生人的認(rèn)同感。
至此，在這一版的一起聽中，我們希望用戶能夠獲得的感受是：“兩個(gè)陌生人雖然素不相識(shí)，不方便通過言語交流，但是彼此分享同一首歌曲，互相陪伴，產(chǎn)生共鳴，溫暖而美妙?！闭绻鲁堑脑姟堕T前》里的那句：“草在結(jié)它的種子，風(fēng)在搖它的葉子。我們站著，不說話，就十分美好”。
陌生人一起聽上線后一個(gè)月左右，我們和用研團(tuán)隊(duì)一起在杭州的幾個(gè)大學(xué)周邊進(jìn)行了用戶訪談，包括面訪和攔訪，在一線傾聽用戶的聲音。主要調(diào)研使用過一起聽用戶的使用情況、未使用過一起聽用戶對(duì)于一起聽的認(rèn)知情況，總結(jié)問題后為一起聽后續(xù)的功能迭代和運(yùn)營策略提供參考和建議。
根據(jù)調(diào)研結(jié)論，我們按照用戶使用一起聽前中后的順序?qū)栴}進(jìn)行排列，分析用戶的問題和痛點(diǎn)，確定了之后的優(yōu)化方向。
我們結(jié)合數(shù)據(jù)表現(xiàn)和用戶調(diào)研，計(jì)劃在接下來的迭代中實(shí)現(xiàn)更多有趣的玩兒法。首先亟待解決的是用戶聊天的需求。在熟人一起聽中，用戶一般使用微信作為聊天工具，一般不會(huì)考慮在云音樂里進(jìn)行聊天。當(dāng)陌生人一起聽上線后，能夠即時(shí)地與陌生人聊天就是一個(gè)最剛需的社交需求了。雖然云音樂已經(jīng)有私信功能可以供我們進(jìn)行復(fù)用，但是我們希望能夠?qū)⒁黄鹇爼r(shí)的聊天做得足夠輕量且能夠隨時(shí)觸達(dá)，以此來提高聊天功能的使用率。
設(shè)計(jì)過程中我們結(jié)合場景進(jìn)行思考和創(chuàng)新，經(jīng)過幾輪方案的篩選，最后大家對(duì)于一個(gè)問題產(chǎn)生爭論：是進(jìn)入聊天模式才可以收發(fā)消息呢？還是直接在播放頁展示消息，隨時(shí)聊天呢？
下圖中，方案1能夠減輕打擾，但是無法在播放頁第一時(shí)間看到對(duì)方發(fā)的消息。
方案2有一定的打擾，但是能夠第一時(shí)間看到消息，讓聽歌場景和聊天場景無縫銜接。
為了減少用戶的操作步驟，把功能做得輕量化，最終選擇了更加直接的方案2，同時(shí)為了避免打擾，每一方的消息氣泡的展示數(shù)量設(shè)置上限為2條，超過2條就會(huì)收起到記錄中。
下面的視頻是聊天的簡單演示，可以發(fā)現(xiàn)氣泡通過背景模糊來區(qū)分前后內(nèi)容，氣泡的出現(xiàn)和消失不改變黑膠頁的原有結(jié)構(gòu)。
很多人用社恐來自嘲，表達(dá)自己想與人社交，但是又存在邁出第一步的障礙。陌生人一起聽是一個(gè)匿名功能，很適合希望輕度社交的用戶。在匿名的基礎(chǔ)上，我們希望在聽歌過程中，能夠?yàn)橛脩魩砀噍p量的、無壓力的社交方式，幫助希望社交的用戶逐漸熟悉彼此，找到志同道合的朋友。
個(gè)人信息逐步展示就是基于上述的需求誕生的創(chuàng)新功能。隨著匿名一起聽的進(jìn)程，用戶可以逐步解鎖對(duì)方的信息，一部分是雙方的共同信息用以產(chǎn)生共鳴，另一部分是對(duì)方的特色信息用以展示自身特點(diǎn)。在聽歌的過程中逐漸了解對(duì)方，最后決定是否揭面進(jìn)行更深度的交流。
首先，在共同信息的提示方式的設(shè)計(jì)上，我們并沒有簡單地用一個(gè)紅點(diǎn)去提醒用戶。而是用頭像的發(fā)光來表示共鳴的含義，頭像四周飄散的粒子來隱喻共同信息。讓每一處的設(shè)計(jì)都能貼合一起聽的風(fēng)格。
共同信息在一個(gè)浮層上展示，我們把當(dāng)前展示的信息控制為一個(gè)，通過上下滑動(dòng)來切換。除了共同信息，用戶可以直觀地設(shè)置自己的狀態(tài)，讓自己更加像一個(gè)活生生的人。
當(dāng)完成一起聽后，會(huì)有一個(gè)結(jié)果頁來記錄聽歌過程中產(chǎn)生的各種數(shù)據(jù)。舊版的結(jié)果頁用戶反饋信息不夠豐富，分享欲望不強(qiáng)。
新的結(jié)果頁增加了雙方的相似度、聊天條數(shù)這些數(shù)據(jù)，并且根據(jù)這些數(shù)據(jù)不同，會(huì)生成一個(gè)表達(dá)關(guān)系的成語，顏色有對(duì)應(yīng)的變化。比如我們相似度很高，并且互發(fā)了很多條聊天消息的話，就會(huì)得到一拍即合的成語和紅色的結(jié)果頁。
與陌生人度過一段聽歌之旅很容易讓人產(chǎn)生分享欲，在社交媒體搜索一起聽可以發(fā)現(xiàn)很多用戶都用結(jié)果頁配圖發(fā)帖，并訴說自己與陌生人之間的互動(dòng)故事。
一起聽經(jīng)過這兩次比較大的更新后，獲得一些不錯(cuò)的成績。截止至2021年12月，周末的平均DAU數(shù)據(jù)從130W提升到了200萬，增量的70W中有大約30%來自于陌生人一起聽。在2021年3月的云音樂整體滿意度監(jiān)測中，22%的用戶表示自己經(jīng)常使用一起聽，滿意度得分4.66（滿分5分），在云音樂所有主要功能中居首位。
未來，我們會(huì)繼續(xù)一起聽的創(chuàng)新腳步，還有更多的可能性等待我們探索。希望未來能夠?yàn)橛脩魩砀嘣囊黄鹇狊w驗(yàn)。最后，我想用下面的這張圖來結(jié)尾，它是同樣主打與陌生人社交和陪伴的游戲《光遇》的一張美宣圖，是我最近無意間在它的官網(wǎng)發(fā)現(xiàn)的。當(dāng)時(shí)看到這張圖后突然發(fā)現(xiàn)它和陌生人一起聽的入口介紹圖表達(dá)方式竟然這么接近。在這個(gè)溫馨的畫面里，代表“光”的白鳥圍繞著你和我正如音樂環(huán)繞著你和我，彼此陪伴、傳遞溫暖、分享喜悅~
在產(chǎn)品設(shè)計(jì)中，當(dāng)有新上線的功能或隱藏功能時(shí)，我們通常會(huì)給予用戶提示。常見的有小紅點(diǎn)、角標(biāo)、黑色遮罩+文字提示等這類靜態(tài)提示。
而人類是視覺生物，相比于靜態(tài)內(nèi)容，我們的注意力更容易被動(dòng)態(tài)內(nèi)容吸引。
今天來聊一下頁面中常見的動(dòng)態(tài)引導(dǎo)。
當(dāng)你看到這個(gè)頁面時(shí)
我想你會(huì)先被色彩凸出的元素吸引，然后是面積占比大的元素，最后根據(jù)閱讀習(xí)慣從上到下，從左到右，依次查看其他內(nèi)容。（大致如下圖）
而當(dāng)頁面元素都賦予細(xì)節(jié)時(shí)
假如我想讓你關(guān)注到其中某個(gè)較小元素
其實(shí)只需要為它添加動(dòng)態(tài)，便能使其脫穎而出，這就是產(chǎn)品設(shè)計(jì)中的動(dòng)態(tài)引導(dǎo)。
▍新功能提示 ?
當(dāng)產(chǎn)品上線新功能時(shí)，設(shè)計(jì)師們都會(huì)根據(jù)功能重要程度，來決定使用什么形式讓入口元素和其他元素區(qū)分開來。常見的有小紅點(diǎn)、標(biāo)簽、氣泡這類靜態(tài)點(diǎn)綴元素（通常這類形式只出現(xiàn)一次，當(dāng)用戶點(diǎn)擊后就會(huì)消失）。當(dāng)然，也有將上述點(diǎn)綴元素動(dòng)態(tài)處理的。如果入口是圖標(biāo)，甚至可以為圖標(biāo)制作動(dòng)畫，這在很多電商產(chǎn)品的品類區(qū)經(jīng)?？梢钥吹?。
動(dòng)態(tài)處理的形式，比原本的靜態(tài)更容易引起用戶對(duì)元素的注意力（與動(dòng)態(tài)方式有關(guān)），甚至傳遞某種情緒。由于是循環(huán)播放的動(dòng)畫，因此可以持續(xù)吸引用戶注意力。
ps：據(jù)說，每當(dāng)頁面多出一個(gè)會(huì)動(dòng)的元素，后臺(tái)就會(huì)多出這樣一些留言，捅了開發(fā)窩了[Doge]。
▍誘導(dǎo)用戶操作 ?
動(dòng)態(tài)引導(dǎo)還常常被設(shè)計(jì)師用來強(qiáng)調(diào)重要內(nèi)容（有可能被產(chǎn)品、運(yùn)營拿刀架脖子），來達(dá)成某些數(shù)據(jù)指標(biāo)，通過利用動(dòng)態(tài)誘導(dǎo)用戶操作。
例如：在會(huì)員卡片中添加光效、在廣告中讓按鈕進(jìn)行縮放、為簽到入口圖標(biāo)設(shè)置動(dòng)畫。
這些都能充分引起用戶注意，甚至提升功能點(diǎn)擊率。
▍隱藏功能提示 ?
我們知道，在大屏上有更多空間可以展示信息。但在移動(dòng)端，受屏幕大小限制，設(shè)計(jì)師通常會(huì)折疊或隱藏不常用的功能，來保持頁面簡潔。
對(duì)于這些不可見的功能，在初次使用時(shí)需要進(jìn)行引導(dǎo)，才能被用戶感知與使用。
▍操作教學(xué)指引 ?
講到引導(dǎo)，還必須要提的是手勢(shì)引導(dǎo)，通過動(dòng)態(tài)直觀展示不同手勢(shì)的作用，提示用戶如何與產(chǎn)品進(jìn)行交互。
這在游戲教學(xué)中就常常使用，它可以幫助用戶快速理解游戲玩法。
回到視頻 App 中，你是否留意到，當(dāng)你第一打開視頻時(shí)， App 會(huì)提醒你雙擊屏幕可以點(diǎn)贊，上下滑動(dòng)可以切換視頻。
在產(chǎn)品交互設(shè)計(jì)中，如果使用到一些新穎的交互方式，這類引導(dǎo)可以大幅降低用戶學(xué)習(xí)成本，幫助用戶快速上手。
▍信息高效傳遞 ?
動(dòng)態(tài)敘述的直觀性，使得我們可以減少對(duì)復(fù)雜信息進(jìn)行大量文字描述。通過動(dòng)態(tài)設(shè)計(jì)，我們可以創(chuàng)建視覺故事，這有助于將復(fù)雜信息以更簡單、清晰的方式進(jìn)行傳遞，從而幫助用戶快速完成任務(wù)。
也因此，在一些含有復(fù)雜操作的彈窗中，漸漸開始應(yīng)用。
但是需要注意的是，上述這些大多都只在第一次使用時(shí)才會(huì)觸發(fā)。
當(dāng)然有特例，例如：
在 App Store 每次下載應(yīng)用進(jìn)行驗(yàn)證時(shí)（面容解鎖的情況下），系統(tǒng)會(huì)通過動(dòng)態(tài)提醒用戶電源鍵位置，并告知用戶需要雙擊進(jìn)行人臉識(shí)別。
在掃碼時(shí)，弱光場景下出現(xiàn)的手電筒，通過動(dòng)態(tài)引起用戶注意，指引用戶使用。
以及作為動(dòng)態(tài)演示，幫助用戶理解如何使用手掌滑動(dòng)截屏
如何進(jìn)行NFC感應(yīng)等等..
動(dòng)態(tài)引導(dǎo)像是設(shè)計(jì)師用來控制我們眼睛的法寶，有的人用它改善產(chǎn)品體驗(yàn)，有的人用它提升商業(yè)轉(zhuǎn)化。
但法寶雖好，我們只有理性使用，才能避免用戶迷失在這眼花繚亂的世界中。
作者：幺零三
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長學(xué)習(xí)，請(qǐng)加微信ban_lanlan，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~
希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系01063334945。
分享此文一切功德，皆悉回向給文章原作者及眾讀者. 免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計(jì)( www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.bouu.cn