超碰av在线|无码精品一区二区三区在线|伊人色色日韩一级片内射视频群批_欧美丰满少妇人妻HD高清在线_亚洲一区二区中文_亚洲无码动漫专区

首頁(yè)

172024-10

跨平臺(tái)手機(jī)界面設(shè)計(jì)怎么做

在當(dāng)今數(shù)字化的時(shí)代，手機(jī)應(yīng)用的使用場(chǎng)景日益豐富，用戶對(duì)于在不同平臺(tái)上都能獲得一致且優(yōu)質(zhì)的體驗(yàn)有著越來(lái)越高的期望。因此，跨平臺(tái)手機(jī)界面設(shè)計(jì)成為了開發(fā)者和設(shè)計(jì)師們面臨的重要挑戰(zhàn)。

要做好跨平臺(tái)手機(jī)界面設(shè)計(jì)，首先需要深入理解不同平臺(tái)的特點(diǎn)和用戶習(xí)慣。比如，iOS 系統(tǒng)和 Android 系統(tǒng)在操作邏輯、界面風(fēng)格和交互方式上都存在一定的差異。iOS 通常強(qiáng)調(diào)簡(jiǎn)潔、直觀和流暢的交互，而 Android 則更具開放性和多樣性。

保持一致性是關(guān)鍵。這包括視覺(jué)元素的一致性，如顏色、字體、圖標(biāo)等，讓用戶在不同平臺(tái)上都能迅速識(shí)別和熟悉應(yīng)用的品牌形象。同時(shí)，功能和操作流程也應(yīng)盡可能保持一致，減少用戶在切換平臺(tái)時(shí)的學(xué)習(xí)成本。

響應(yīng)式布局是跨平臺(tái)設(shè)計(jì)的核心技術(shù)之一。根據(jù)不同設(shè)備的屏幕尺寸和分辨率，自動(dòng)調(diào)整界面元素的布局和大小，確保內(nèi)容的可讀性和可用性。例如，在小屏幕設(shè)備上，可以采用簡(jiǎn)潔的單列布局，而在大屏幕設(shè)備上，則可以展示更多的信息和功能。

為了實(shí)現(xiàn)高效的跨平臺(tái)開發(fā)，選擇合適的框架和工具也非常重要。諸如 React Native、Flutter 等框架，能夠幫助開發(fā)者快速構(gòu)建跨平臺(tái)應(yīng)用，同時(shí)保持良好的性能和用戶體驗(yàn)。

優(yōu)化性能也是不容忽視的一點(diǎn)。不同平臺(tái)的硬件性能和網(wǎng)絡(luò)環(huán)境有所不同，需要針對(duì)這些差異進(jìn)行優(yōu)化，確保應(yīng)用在各種設(shè)備上都能流暢運(yùn)行，加載速度快，不出現(xiàn)卡頓和延遲。

此外，進(jìn)行充分的用戶測(cè)試是必不可少的環(huán)節(jié)。收集不同平臺(tái)用戶的反饋和意見(jiàn)，及時(shí)發(fā)現(xiàn)并解決可能存在的問(wèn)題，不斷優(yōu)化和改進(jìn)界面設(shè)計(jì)。

一個(gè)成功的跨平臺(tái)手機(jī)界面設(shè)計(jì)案例是某知名的社交媒體應(yīng)用。它在 iOS 和 Android 平臺(tái)上都保持了統(tǒng)一的品牌風(fēng)格，同時(shí)根據(jù)不同平臺(tái)的特點(diǎn)進(jìn)行了細(xì)微的調(diào)整，如導(dǎo)航欄的位置和操作方式。通過(guò)響應(yīng)式布局，無(wú)論是在大屏幕的平板電腦還是小屏幕的手機(jī)上，都能提供出色的用戶體驗(yàn)。

據(jù)相關(guān)數(shù)據(jù)顯示，采用優(yōu)秀跨平臺(tái)設(shè)計(jì)的應(yīng)用，其用戶活躍度和留存率都明顯高于僅針對(duì)單一平臺(tái)優(yōu)化的應(yīng)用。

總之，跨平臺(tái)手機(jī)界面設(shè)計(jì)需要綜合考慮多個(gè)因素，包括平臺(tái)特點(diǎn)、一致性、響應(yīng)式布局、性能優(yōu)化和用戶測(cè)試等。只有精心設(shè)計(jì)和不斷優(yōu)化，才能滿足用戶在不同平臺(tái)上的需求，提升應(yīng)用的競(jìng)爭(zhēng)力和用戶滿意度。在未來(lái)，隨著技術(shù)的不斷發(fā)展和新平臺(tái)的出現(xiàn)，跨平臺(tái)設(shè)計(jì)將繼續(xù)面臨新的挑戰(zhàn)和機(jī)遇，需要我們不斷探索和創(chuàng)新。

評(píng)論(0) 瀏覽(119)

172024-10

動(dòng)效設(shè)計(jì)在手機(jī)界面設(shè)計(jì)中的作用

藍(lán)藍(lán)設(shè)計(jì)的小編 seo優(yōu)化

在如今這個(gè)數(shù)字化的時(shí)代，手機(jī)界面的設(shè)計(jì)越來(lái)越精致和人性化，其中動(dòng)效設(shè)計(jì)扮演著不可或缺的角色。

評(píng)論(0) 瀏覽(91)

172024-10

無(wú)障礙設(shè)計(jì)原則在手機(jī)界面中的應(yīng)用

藍(lán)藍(lán)設(shè)計(jì)的小編 seo優(yōu)化

在當(dāng)今數(shù)字化的時(shí)代，手機(jī)已經(jīng)成為人們生活中不可或缺的工具。然而，對(duì)于一些特殊群體，如視障者、聽障者、老年人以及身體功能有障礙的人群，使用手機(jī)可能會(huì)面臨諸多挑戰(zhàn)。這時(shí)，無(wú)障礙設(shè)計(jì)原則在手機(jī)界面中的應(yīng)用就顯得尤為重要。

無(wú)障礙設(shè)計(jì)原則的核心是確保所有人，無(wú)論其身體狀況如何，都能夠平等、方便地使用產(chǎn)品和服務(wù)。在手機(jī)界面設(shè)計(jì)中，這意味著要從多個(gè)方面進(jìn)行考慮和優(yōu)化。

首先，對(duì)于視障者來(lái)說(shuō)，屏幕朗讀功能是至關(guān)重要的。通過(guò)語(yǔ)音輔助，手機(jī)能夠?qū)⑵聊簧系奈淖?、圖標(biāo)和操作提示轉(zhuǎn)化為聲音，幫助他們獲取信息。同時(shí)，高對(duì)比度的色彩搭配也能讓視障者更清晰地分辨界面元素。例如，使用黑白對(duì)比強(qiáng)烈的配色，或者為重要的按鈕和文字提供醒目的顏色標(biāo)識(shí)。

對(duì)于聽障者，可視化的提示和震動(dòng)反饋則是關(guān)鍵。當(dāng)有來(lái)電、短信或其他通知時(shí)，除了聲音提示，強(qiáng)烈的視覺(jué)閃爍和明顯的震動(dòng)能夠確保他們及時(shí)察覺(jué)。

對(duì)于老年人和操作不靈活的人群，大字體和簡(jiǎn)潔明了的界面布局能極大地提高可用性。增大圖標(biāo)和按鈕的尺寸，減少操作步驟，提供清晰易懂的圖標(biāo)和文字說(shuō)明，都能讓他們更輕松地使用手機(jī)。

此外，無(wú)障礙設(shè)計(jì)還應(yīng)考慮到認(rèn)知障礙人群的需求。避免復(fù)雜的操作流程和難以理解的術(shù)語(yǔ)，采用直觀、易懂的設(shè)計(jì)語(yǔ)言，降低使用門檻。

許多手機(jī)廠商已經(jīng)開始重視無(wú)障礙設(shè)計(jì)，并取得了顯著的成果。比如，蘋果的 VoiceOver 功能，讓視障用戶能夠通過(guò)觸摸和滑動(dòng)來(lái)操作手機(jī)，獲取各種信息。

據(jù)統(tǒng)計(jì)，全球有超過(guò) 10 億的人口存在某種形式的殘疾，而無(wú)障礙設(shè)計(jì)能夠讓這部分人群更好地融入數(shù)字社會(huì)，享受科技帶來(lái)的便利。

一個(gè)成功的無(wú)障礙手機(jī)界面設(shè)計(jì)案例是某款專門為老年人開發(fā)的手機(jī)應(yīng)用。它的界面簡(jiǎn)潔大方，字體超大，圖標(biāo)清晰，并且提供了詳細(xì)的操作指南和語(yǔ)音提示。老年人可以輕松地?fù)艽螂娫挕l(fā)送短信、查看天氣等，極大地提高了他們的生活質(zhì)量。

總之，無(wú)障礙設(shè)計(jì)原則在手機(jī)界面中的應(yīng)用不僅是一種社會(huì)責(zé)任，也是提升產(chǎn)品包容性和用戶滿意度的重要途徑。通過(guò)關(guān)注特殊群體的需求，我們能夠打造出更加人性化、溫暖且具有廣泛適用性的手機(jī)界面，讓科技真正惠及每一個(gè)人。在未來(lái)，隨著技術(shù)的不斷發(fā)展和社會(huì)意識(shí)的提高，相信無(wú)障礙設(shè)計(jì)將在手機(jī)領(lǐng)域發(fā)揮更大的作用，為更多的人創(chuàng)造更美好的數(shù)字生活體驗(yàn)。

評(píng)論(0) 瀏覽(77)

172024-10

手機(jī)界面設(shè)計(jì)風(fēng)格演變

藍(lán)藍(lán)設(shè)計(jì)的小編 seo優(yōu)化

在科技日新月異的今天，手機(jī)已經(jīng)成為我們生活中不可或缺的一部分，而手機(jī)界面設(shè)計(jì)風(fēng)格也經(jīng)歷了一系列引人注目的演變。

評(píng)論(0) 瀏覽(58)

172024-10

打動(dòng)用戶的關(guān)鍵：用戶體驗(yàn)地圖實(shí)戰(zhàn)攻略

ui設(shè)計(jì)分享達(dá)人交互設(shè)計(jì)及用戶體驗(yàn)

一、什么是用戶體驗(yàn)地圖？

二、為什么使用用戶體驗(yàn)地圖？

三、什么情況使用用戶體驗(yàn)地圖？

四、用戶體驗(yàn)地圖的組成？

五、用戶體驗(yàn)地圖的制作流程

六、用戶體驗(yàn)地圖案例展示

七、用戶體驗(yàn)地圖總結(jié)

一、什么是用戶體驗(yàn)地圖？

打動(dòng)用戶的關(guān)鍵：用戶體驗(yàn)地圖實(shí)戰(zhàn)攻略

用戶體驗(yàn)地圖（User Experience Map）是一種用于可視化展示用戶在與產(chǎn)品或服務(wù)互動(dòng)過(guò)程中所經(jīng)歷的各個(gè)接觸點(diǎn)和體驗(yàn)的工具。它幫助團(tuán)隊(duì)深入了解用戶的行為、情感和痛點(diǎn)，從而優(yōu)化用戶體驗(yàn)。

用戶體驗(yàn)地圖（User Experience Map）是產(chǎn)品設(shè)計(jì)前期——用戶研究中很重要的一部分，視角化和圖表的方式，從用戶的角度來(lái)表現(xiàn)其和產(chǎn)品/組織/服務(wù)交互的過(guò)程，是連續(xù)的視覺(jué)時(shí)間和完整故事的多個(gè)互動(dòng)點(diǎn)。

簡(jiǎn)單來(lái)說(shuō)，在用戶定義角色，搭配行為研究、表格調(diào)查和競(jìng)品分析等數(shù)據(jù)下，構(gòu)思出這個(gè)角色在某個(gè)角色故事下要完成特定目標(biāo)，以反應(yīng)用戶使用某個(gè)特定產(chǎn)品的真實(shí)特性，有助于我們?cè)u(píng)估現(xiàn)狀、找出用戶真正的痛點(diǎn)，與優(yōu)化整體的體驗(yàn)流程（創(chuàng)造和諧的互動(dòng)）。

二、為什么使用用戶體驗(yàn)地圖？

使用用戶體驗(yàn)地圖（User Experience Map）在項(xiàng)目中有很多重要的原因，能夠給團(tuán)隊(duì)帶來(lái)顯著的價(jià)值，例如：

1、全面理解用戶旅程

可視化用戶體驗(yàn)：用戶體驗(yàn)地圖通過(guò)圖形化的方式展示用戶在使用產(chǎn)品或服務(wù)過(guò)程中的所有步驟和接觸點(diǎn)，使團(tuán)隊(duì)能夠直觀地看到用戶的整個(gè)旅程。

識(shí)別關(guān)鍵時(shí)刻：幫助團(tuán)隊(duì)識(shí)別用戶旅程中的關(guān)鍵觸點(diǎn)和情感波動(dòng)，理解用戶在不同階段的需求和行為。

2、發(fā)現(xiàn)用戶痛點(diǎn)和改進(jìn)機(jī)會(huì)

識(shí)別痛點(diǎn)：用戶體驗(yàn)地圖能夠揭示用戶在使用過(guò)程中的痛點(diǎn)和挑戰(zhàn)，使團(tuán)隊(duì)可以針對(duì)這些問(wèn)題制定解決方案。

挖掘改進(jìn)機(jī)會(huì)：通過(guò)分析用戶行為和情感波動(dòng)，團(tuán)隊(duì)可以找到提升用戶體驗(yàn)的機(jī)會(huì)，從而優(yōu)化產(chǎn)品或服務(wù)。

3. 增強(qiáng)團(tuán)隊(duì)協(xié)作和溝通

統(tǒng)一理解：用戶體驗(yàn)地圖作為一種直觀的溝通工具，使跨職能團(tuán)隊(duì)（如產(chǎn)品經(jīng)理、設(shè)計(jì)師、開發(fā)人員和市場(chǎng)團(tuán)隊(duì)）能夠共享對(duì)用戶體驗(yàn)的統(tǒng)一理解。

促進(jìn)協(xié)作：通過(guò)共同創(chuàng)建和討論用戶體驗(yàn)地圖，團(tuán)隊(duì)成員可以更好地協(xié)作，提出建設(shè)性的意見(jiàn)和建議。

4. 驅(qū)動(dòng)以用戶為中心的設(shè)計(jì)

以用戶為中心：用戶體驗(yàn)地圖強(qiáng)調(diào)從用戶的角度出發(fā)，關(guān)注用戶的需求、情感和行為，推動(dòng)以用戶為中心的設(shè)計(jì)和開發(fā)。

提升用戶滿意度：通過(guò)優(yōu)化用戶旅程中的各個(gè)觸點(diǎn)和體驗(yàn)，團(tuán)隊(duì)可以提升用戶滿意度和忠誠(chéng)度。

5. 支持決策制定

數(shù)據(jù)驅(qū)動(dòng)決策：用戶體驗(yàn)地圖基于用戶研究和數(shù)據(jù)分析，為決策提供可靠的依據(jù)，減少主觀判斷和猜測(cè)。

優(yōu)先級(jí)管理：通過(guò)識(shí)別用戶體驗(yàn)中的關(guān)鍵問(wèn)題和機(jī)會(huì)，團(tuán)隊(duì)可以更好地確定優(yōu)先級(jí)，集中資源解決最重要的問(wèn)題。

6. 提高用戶體驗(yàn)設(shè)計(jì)的效率和效果

明確目標(biāo)和方向：用戶體驗(yàn)地圖幫助團(tuán)隊(duì)明確設(shè)計(jì)目標(biāo)和方向，減少反復(fù)修改和溝通成本，提高設(shè)計(jì)效率。

驗(yàn)證設(shè)計(jì)假設(shè)：通過(guò)用戶體驗(yàn)地圖，團(tuán)隊(duì)可以驗(yàn)證設(shè)計(jì)假設(shè)和概念，確保設(shè)計(jì)方案符合用戶需求和期望。

三、什么情況使用用戶體驗(yàn)地圖？

用戶體驗(yàn)地圖（User Experience Map）在多種情況下都可以使用，能夠幫助團(tuán)隊(duì)更好地理解和優(yōu)化用戶體驗(yàn)。例如：

1.產(chǎn)品或服務(wù)的初期開發(fā)階段

定義產(chǎn)品概念：在開發(fā)新產(chǎn)品或服務(wù)時(shí)，用戶體驗(yàn)地圖幫助團(tuán)隊(duì)理解用戶需求和期望，確保產(chǎn)品設(shè)計(jì)符合用戶需求。

設(shè)計(jì)用戶旅程：通過(guò)用戶體驗(yàn)地圖，團(tuán)隊(duì)可以詳細(xì)規(guī)劃用戶與產(chǎn)品互動(dòng)的每個(gè)步驟和觸點(diǎn)，確保用戶旅程流暢且無(wú)障礙。

示例：

一家創(chuàng)業(yè)公司在開發(fā)一款新的移動(dòng)應(yīng)用時(shí)，通過(guò)用戶體驗(yàn)地圖了解目標(biāo)用戶的需求和使用習(xí)慣，從而設(shè)計(jì)出更符合用戶期望的產(chǎn)品。

2.現(xiàn)有產(chǎn)品或服務(wù)的優(yōu)化

識(shí)別和解決問(wèn)題：當(dāng)現(xiàn)有產(chǎn)品或服務(wù)存在用戶體驗(yàn)問(wèn)題時(shí)，用戶體驗(yàn)地圖幫助團(tuán)隊(duì)識(shí)別痛點(diǎn)并制定改進(jìn)措施。

提升用戶滿意度：通過(guò)分析用戶在不同接觸點(diǎn)的情感和行為，團(tuán)隊(duì)可以找到提升用戶滿意度和忠誠(chéng)度的機(jī)會(huì)。

示例：

一家電商平臺(tái)通過(guò)用戶體驗(yàn)地圖發(fā)現(xiàn)用戶在結(jié)賬環(huán)節(jié)遇到的困難，優(yōu)化了結(jié)賬流程，顯著提高了用戶滿意度和轉(zhuǎn)化率。

3.跨職能團(tuán)隊(duì)的協(xié)作和溝通

建立共同理解：在涉及多個(gè)部門的項(xiàng)目中，用戶體驗(yàn)地圖幫助不同團(tuán)隊(duì)（如產(chǎn)品、設(shè)計(jì)、開發(fā)、市場(chǎng)）建立對(duì)用戶體驗(yàn)的共同理解。

促進(jìn)協(xié)作：通過(guò)可視化的用戶旅程，團(tuán)隊(duì)成員可以更有效地討論和協(xié)作，提出有建設(shè)性的改進(jìn)建議。

示例：

一家大型企業(yè)在推出一項(xiàng)新服務(wù)時(shí)，通過(guò)用戶體驗(yàn)地圖讓產(chǎn)品經(jīng)理、設(shè)計(jì)師和市場(chǎng)團(tuán)隊(duì)共同參與，確保各團(tuán)隊(duì)對(duì)用戶體驗(yàn)的理解一致，從而提高協(xié)作效率。

4.用戶研究和測(cè)試階段

記錄用戶反饋：在用戶研究和測(cè)試階段，用戶體驗(yàn)地圖幫助記錄和分析用戶反饋，發(fā)現(xiàn)用戶在使用產(chǎn)品過(guò)程中的實(shí)際體驗(yàn)。

驗(yàn)證設(shè)計(jì)假設(shè)：通過(guò)用戶體驗(yàn)地圖，團(tuán)隊(duì)可以驗(yàn)證設(shè)計(jì)假設(shè)，確保設(shè)計(jì)方案符合用戶需求和期望。

示例：

一家金融科技公司在測(cè)試新功能時(shí)，通過(guò)用戶體驗(yàn)地圖記錄用戶的使用體驗(yàn)和反饋，優(yōu)化了功能設(shè)計(jì)。

5.制定產(chǎn)品戰(zhàn)略和路線圖

戰(zhàn)略規(guī)劃：用戶體驗(yàn)地圖幫助團(tuán)隊(duì)從用戶角度出發(fā)，制定產(chǎn)品戰(zhàn)略和發(fā)展路線圖，確保產(chǎn)品的發(fā)展方向符合用戶需求。

優(yōu)先級(jí)管理：通過(guò)識(shí)別用戶體驗(yàn)中的關(guān)鍵問(wèn)題和機(jī)會(huì)，團(tuán)隊(duì)可以更好地確定改進(jìn)措施的優(yōu)先級(jí)。

示例：

一家健康科技公司在制定未來(lái)兩年的產(chǎn)品發(fā)展計(jì)劃時(shí)，通過(guò)用戶體驗(yàn)地圖分析用戶需求和市場(chǎng)趨勢(shì)，確定了重點(diǎn)開發(fā)的功能和服務(wù)。

6.營(yíng)銷和客戶支持

提升客戶支持效率：用戶體驗(yàn)地圖幫助識(shí)別用戶在尋求支持時(shí)的痛點(diǎn)，優(yōu)化客戶支持流程，提高用戶滿意度。

優(yōu)化營(yíng)銷策略：通過(guò)了解用戶在不同階段的情感和行為，團(tuán)隊(duì)可以制定更有針對(duì)性的營(yíng)銷策略，提升用戶轉(zhuǎn)化率。

示例：

一家SaaS公司通過(guò)用戶體驗(yàn)地圖發(fā)現(xiàn)用戶在使用過(guò)程中遇到的常見(jiàn)問(wèn)題，優(yōu)化了客戶支持流程，并根據(jù)用戶行為調(diào)整了營(yíng)銷策略，提高了客戶留存率。

四、用戶體驗(yàn)地圖的組成？

組成用戶體驗(yàn)地圖（User Experience Map）可以分為八個(gè)部分，分別是：用戶角色（Persona）、場(chǎng)景（Scenario）、階段（Stages）、觸點(diǎn)（Touchpoints）、用戶行為（Actions）、用戶情感（Emotions）、痛點(diǎn)（Pain Points）、機(jī)會(huì)（Opportunities）；組成部分整合到一張用戶體驗(yàn)地圖上，團(tuán)隊(duì)可以直觀地看到用戶旅程中的所有關(guān)鍵要素。幫助團(tuán)隊(duì)全面理解用戶在整個(gè)體驗(yàn)過(guò)程中的行為、情感和痛點(diǎn)，從而制定更有效的優(yōu)化策略，提升用戶滿意度。下面我們?cè)敿?xì)說(shuō)明這八個(gè)部分：

1. 用戶角色（Persona）

定義：用戶角色是目標(biāo)用戶的詳細(xì)描述，包括人口統(tǒng)計(jì)信息、行為模式、需求和痛點(diǎn)。

目的：幫助團(tuán)隊(duì)聚焦特定用戶群體的需求和體驗(yàn)，使設(shè)計(jì)和決策更有針對(duì)性。

示例：

年齡：25-35歲

職業(yè)：城市白領(lǐng)

興趣愛(ài)好：網(wǎng)上購(gòu)物

需求和痛點(diǎn)：需要便捷快速的購(gòu)物體驗(yàn)，不喜歡復(fù)雜的結(jié)賬流程

2. 場(chǎng)景（Scenario）

定義：場(chǎng)景是用戶在某一特定情境下與產(chǎn)品或服務(wù)互動(dòng)的全過(guò)程描述。

目的：幫助團(tuán)隊(duì)了解用戶的具體使用情境和目標(biāo)，確保設(shè)計(jì)滿足實(shí)際使用需求。

示例：用戶在下班回家的路上，通過(guò)移動(dòng)應(yīng)用購(gòu)買晚餐所需的食材。

3. 階段（Stages）

定義：用戶旅程的不同階段，從開始到結(jié)束，包括用戶在每個(gè)階段的主要活動(dòng)和目標(biāo)。

目的：展示用戶旅程的整體結(jié)構(gòu)，幫助團(tuán)隊(duì)識(shí)別每個(gè)階段的關(guān)鍵活動(dòng)和目標(biāo)。

示例：

發(fā)現(xiàn)（Discovery）、考慮（Consideration）、決策（Decision）、使用（Usage）、回訪（Return）

4. 觸點(diǎn)（Touchpoints）

定義：用戶在每個(gè)階段與產(chǎn)品或服務(wù)的具體接觸點(diǎn)，如網(wǎng)站、客服、實(shí)體店等。

目的：識(shí)別用戶與品牌互動(dòng)的關(guān)鍵時(shí)刻，確保每個(gè)接觸點(diǎn)的體驗(yàn)都得到優(yōu)化。

示例：網(wǎng)站首頁(yè)、產(chǎn)品頁(yè)面、購(gòu)物車、結(jié)賬頁(yè)面、客服

5. 用戶行為（Actions）

定義：用戶在每個(gè)觸點(diǎn)上的具體行為，如瀏覽網(wǎng)頁(yè)、咨詢客服、購(gòu)買產(chǎn)品等。

目的：展示用戶的具體操作過(guò)程，幫助團(tuán)隊(duì)理解用戶的實(shí)際使用方式。

示例：瀏覽產(chǎn)品、加入購(gòu)物車、填寫訂單信息、支付、聯(lián)系客服

6. 用戶情感（Emotions）

定義：用戶在每個(gè)觸點(diǎn)上的情感體驗(yàn)，包括積極和消極的情感波動(dòng)。

目的：幫助團(tuán)隊(duì)理解用戶的滿意度和痛點(diǎn)，確保在關(guān)鍵時(shí)刻提供積極的體驗(yàn)。

示例：

興奮（瀏覽產(chǎn)品時(shí)）、猶豫（選擇支付方式時(shí)）、沮喪（遇到支付問(wèn)題時(shí)）、滿意（收到產(chǎn)品時(shí)）

7. 痛點(diǎn)（Pain Points）

定義：用戶在整個(gè)體驗(yàn)過(guò)程中遇到的困難和挑戰(zhàn)。

目的：識(shí)別和解決用戶體驗(yàn)中的問(wèn)題，提升用戶滿意度。

示例：

結(jié)賬頁(yè)面加載慢、支付方式選擇不便、客服響應(yīng)慢

8. 機(jī)會(huì)（Opportunities）

定義：基于用戶行為、情感和痛點(diǎn)，識(shí)別出改善用戶體驗(yàn)的潛在機(jī)會(huì)。

目的：為團(tuán)隊(duì)提供改進(jìn)用戶體驗(yàn)的方向和具體措施，推動(dòng)持續(xù)優(yōu)化。

示例：

優(yōu)化結(jié)賬頁(yè)面性能、增加支付方式、提升客服響應(yīng)速度

五、用戶體驗(yàn)地圖的制作流程

制作一份完整的用戶體驗(yàn)地圖（User Experience Map）需要多個(gè)步驟，使用的方法也有很多，不用擔(dān)心，下面我們進(jìn)行詳細(xì)步驟拆解：

1.定義目標(biāo)

目的：明確制作用戶體驗(yàn)地圖的目標(biāo)和用途，比如改善特定功能的用戶體驗(yàn)、優(yōu)化整體用戶旅程等。

示例：

一家電商平臺(tái)希望通過(guò)用戶體驗(yàn)地圖識(shí)別用戶在結(jié)賬過(guò)程中的痛點(diǎn)，并制定改進(jìn)措施。

2.收集用戶數(shù)據(jù)

方法：

用戶訪談：直接與用戶對(duì)話，了解他們的需求、行為和情感。

問(wèn)卷調(diào)查：通過(guò)問(wèn)卷收集大規(guī)模用戶數(shù)據(jù)。

用戶觀察：觀察用戶在實(shí)際使用產(chǎn)品或服務(wù)時(shí)的行為和反應(yīng)。

可用性測(cè)試：測(cè)試用戶在特定任務(wù)中的表現(xiàn)，發(fā)現(xiàn)使用障礙和痛點(diǎn)。

數(shù)據(jù)分析：分析網(wǎng)站或應(yīng)用的使用數(shù)據(jù)，了解用戶行為模式。

示例：

電商平臺(tái)通過(guò)用戶訪談和問(wèn)卷調(diào)查收集用戶在結(jié)賬過(guò)程中的體驗(yàn)和反饋。

3.定義用戶角色（Persona）

步驟：

基于收集的數(shù)據(jù)，定義主要的用戶角色，描述其特征、需求和痛點(diǎn)。

示例：

用戶角色A：25-35歲，城市白領(lǐng)，喜歡網(wǎng)上購(gòu)物，重視便捷和快速的購(gòu)物體驗(yàn)。

4.描繪用戶旅程

步驟：

劃分用戶旅程的不同階段，從開始到結(jié)束，包括用戶在每個(gè)階段的主要活動(dòng)和目標(biāo)。

示例：

發(fā)現(xiàn)階段：用戶在網(wǎng)上搜索和瀏覽商品。

考慮階段：用戶比較不同商品的特點(diǎn)和價(jià)格。

決策階段：用戶決定購(gòu)買某件商品。

使用階段：用戶完成購(gòu)買并等待商品送達(dá)。

回訪階段：用戶收到商品后可能會(huì)再次訪問(wèn)網(wǎng)站。

5.識(shí)別觸點(diǎn)和用戶行為

步驟：列出用戶在每個(gè)階段的具體觸點(diǎn)和行為，展示用戶的操作過(guò)程。

示例：

觸點(diǎn)：網(wǎng)站首頁(yè)、產(chǎn)品頁(yè)面、購(gòu)物車、結(jié)賬頁(yè)面、客服。

用戶行為：瀏覽產(chǎn)品、加入購(gòu)物車、填寫訂單信息、支付、聯(lián)系客服。

6.記錄用戶情感

步驟：描述用戶在每個(gè)觸點(diǎn)上的情感體驗(yàn)，包括積極和消極的情感波動(dòng)。

示例：

用戶在瀏覽產(chǎn)品時(shí)感到興奮，但在結(jié)賬時(shí)因頁(yè)面加載慢而感到沮喪。

7.識(shí)別痛點(diǎn)和機(jī)會(huì)

步驟：基于用戶行為和情感，識(shí)別用戶在每個(gè)階段的痛點(diǎn)，并找出改善用戶體驗(yàn)的機(jī)會(huì)。

示例：

痛點(diǎn)：結(jié)賬頁(yè)面加載慢、支付方式選擇不便、客服響應(yīng)慢。

機(jī)會(huì)：優(yōu)化結(jié)賬頁(yè)面性能、增加支付方式、提升客服響應(yīng)速度。

8.創(chuàng)建可視化地圖

步驟：將所有信息整合到一張可視化的用戶體驗(yàn)地圖上，使團(tuán)隊(duì)能夠直觀地了解用戶的完整體驗(yàn)過(guò)程。

工具：

手繪草圖：用紙和筆繪制用戶體驗(yàn)地圖。

數(shù)字工具：使用工具如Miro、Lucidchart、UXPressia等創(chuàng)建數(shù)字用戶體驗(yàn)地圖。

9.討論和驗(yàn)證

步驟：

與團(tuán)隊(duì)成員共同討論用戶體驗(yàn)地圖，驗(yàn)證其準(zhǔn)確性和全面性。

基于討論結(jié)果進(jìn)行必要的修改和調(diào)整。

示例：

團(tuán)隊(duì)成員共同審查用戶體驗(yàn)地圖，確認(rèn)所有觸點(diǎn)和用戶行為是否準(zhǔn)確，討論發(fā)現(xiàn)的痛點(diǎn)和改進(jìn)機(jī)會(huì)。

10.制定改進(jìn)措施

步驟：根據(jù)用戶體驗(yàn)地圖識(shí)別的痛點(diǎn)和機(jī)會(huì)，制定具體的改進(jìn)措施和實(shí)施計(jì)劃。

示例：

優(yōu)化結(jié)賬頁(yè)面加載速度，增加多種支付方式，提升客服響應(yīng)效率。

11.實(shí)施和跟蹤改進(jìn)

步驟：實(shí)施制定的改進(jìn)措施，并持續(xù)跟蹤用戶反饋和數(shù)據(jù)，評(píng)估改進(jìn)效果。

示例：

電商平臺(tái)實(shí)施優(yōu)化結(jié)賬頁(yè)面的改進(jìn)措施，并通過(guò)用戶反饋和數(shù)據(jù)分析評(píng)估效果，確保用戶體驗(yàn)得到提升。

六、用戶體驗(yàn)地圖案例展示

通過(guò)上面的介紹，相信你已經(jīng)對(duì)用戶體驗(yàn)地圖（User Experience Map）有了一定了解，是不是已經(jīng)想自己動(dòng)手開始制作了，下面我們看幾個(gè)案例：

案例 1：電商平臺(tái)優(yōu)化

背景：一家電商平臺(tái)希望通過(guò)用戶體驗(yàn)地圖識(shí)別用戶在結(jié)賬過(guò)程中的痛點(diǎn)，并制定改進(jìn)措施，以提升用戶滿意度和轉(zhuǎn)化率。

用戶角色（Persona）

姓名：張女士

年齡：30歲

職業(yè)：城市白領(lǐng)

興趣：喜歡網(wǎng)上購(gòu)物

需求：需要便捷快速的購(gòu)物體驗(yàn)

痛點(diǎn)：不喜歡復(fù)雜的結(jié)賬流程

觸點(diǎn)和用戶行為

1. 發(fā)現(xiàn)（Discovery）：通過(guò)搜索引擎和社交媒體廣告發(fā)現(xiàn)平臺(tái)

2. 考慮（Consideration）：瀏覽產(chǎn)品詳情，查看用戶評(píng)論

3. 決策（Decision）：將商品加入購(gòu)物車

4. 購(gòu)買（Purchase）：填寫訂單信息并支付

5. 回訪（Return）：查看訂單狀態(tài)，聯(lián)系客戶服務(wù)

用戶情感

發(fā)現(xiàn)：興奮和好奇

考慮：謹(jǐn)慎和比較

決策：確定和期待

購(gòu)買：焦慮和滿足

回訪：滿意和信任

痛點(diǎn)和機(jī)會(huì)

痛點(diǎn)：結(jié)賬頁(yè)面加載慢，支付方式選擇不便，客服響應(yīng)慢

機(jī)會(huì)：優(yōu)化結(jié)賬頁(yè)面性能，增加支付方式，提升客服響應(yīng)速度

案例 2：健身App優(yōu)化

背景：一家健身App希望提高用戶的使用頻率和忠誠(chéng)度。

用戶角色（Persona）

姓名：李先生

年齡：25歲

職業(yè)：程序員

興趣：健身

需求：需要個(gè)性化的健身計(jì)劃

痛點(diǎn)：課程選擇不夠個(gè)性化，計(jì)劃制定過(guò)程復(fù)雜

觸點(diǎn)和用戶行為

1. 發(fā)現(xiàn)（Discovery）：通過(guò)朋友推薦和廣告發(fā)現(xiàn)App下載并安裝App

2. 考慮（Consideration）：瀏覽課程詳情，查看評(píng)價(jià)

3. 決策（Decision）：選擇并購(gòu)買課程

4. 使用（Usage）：開始使用課程進(jìn)行鍛煉

5. 回訪（Return）：查看鍛煉記錄，調(diào)整計(jì)劃

用戶情感

發(fā)現(xiàn)：好奇和期待

考慮：審慎和比較

決策：確定和信心

使用：滿足和成就

回訪：滿意和忠誠(chéng)

痛點(diǎn)和機(jī)會(huì)

痛點(diǎn)：課程選擇不夠個(gè)性化，計(jì)劃制定復(fù)雜

機(jī)會(huì)：增加個(gè)性化推薦功能，簡(jiǎn)化計(jì)劃制定過(guò)程

案例 3：銀行在線服務(wù)優(yōu)化

背景：一家銀行希望優(yōu)化其在線服務(wù)平臺(tái)，以提高用戶的操作體驗(yàn)和滿意度。

用戶角色（Persona）

姓名：王女士

年齡：45歲

職業(yè)：教師

興趣：理財(cái)

需求：需要簡(jiǎn)單易用的在線銀行服務(wù)

痛點(diǎn)：在線服務(wù)平臺(tái)操作復(fù)雜，轉(zhuǎn)賬流程繁瑣

觸點(diǎn)和用戶行為

1. 發(fā)現(xiàn)（Discovery）：訪問(wèn)銀行官網(wǎng)，注冊(cè)賬戶

2. 考慮（Consideration）：瀏覽平臺(tái)功能和用戶評(píng)價(jià)

3. 決策（Decision）：決定使用在線服務(wù)

4. 使用（Usage）：進(jìn)行賬戶管理和轉(zhuǎn)賬操作

5. 回訪（Return）：查看交易記錄，繼續(xù)使用服務(wù)

用戶情感

發(fā)現(xiàn)：好奇和懷疑

考慮：審慎和信任

決策：確定和信心

使用：滿足和便捷

回訪：滿意和忠誠(chéng)

痛點(diǎn)和機(jī)會(huì)

痛點(diǎn)：操作復(fù)雜，轉(zhuǎn)賬流程繁瑣

機(jī)會(huì)：簡(jiǎn)化操作流程，優(yōu)化用戶界面設(shè)計(jì)

七、用戶體驗(yàn)地圖的總結(jié)

用戶體驗(yàn)地圖（User Experience Map）作為一種強(qiáng)大的工具，在理解和優(yōu)化用戶體驗(yàn)方面具有顯著優(yōu)勢(shì)。然而，制作和維護(hù)用戶體驗(yàn)地圖也存在資源密集、復(fù)雜性和動(dòng)態(tài)變化等挑戰(zhàn)。團(tuán)隊(duì)在使用用戶體驗(yàn)地圖時(shí)，需要平衡其優(yōu)劣勢(shì)，合理分配資源，確保地圖的準(zhǔn)確性和實(shí)用性，從而真正提升用戶體驗(yàn)和產(chǎn)品成功率。

優(yōu)勢(shì)

1. 全景視角

優(yōu)點(diǎn)：用戶體驗(yàn)地圖提供了用戶體驗(yàn)的全景視角，涵蓋了用戶與產(chǎn)品或服務(wù)互動(dòng)的各個(gè)階段。這種全景視角有助于團(tuán)隊(duì)全面了解用戶旅程中的各個(gè)觸點(diǎn)和行為。

案例：電商平臺(tái)可以通過(guò)用戶體驗(yàn)地圖了解用戶從瀏覽商品到完成購(gòu)買的全過(guò)程，識(shí)別出所有關(guān)鍵的用戶觸點(diǎn)。

2. 用戶共情

優(yōu)點(diǎn)：通過(guò)記錄用戶在每個(gè)階段的情感體驗(yàn)，團(tuán)隊(duì)可以更好地理解用戶的需求和痛點(diǎn)，增強(qiáng)用戶共情。

案例：健身App可以通過(guò)用戶體驗(yàn)地圖了解用戶在制定和執(zhí)行健身計(jì)劃時(shí)的情感變化，從而設(shè)計(jì)出更具吸引力的個(gè)性化健身計(jì)劃。

3. 識(shí)別痛點(diǎn)

優(yōu)點(diǎn)：用戶體驗(yàn)地圖有助于識(shí)別用戶在使用產(chǎn)品或服務(wù)過(guò)程中的痛點(diǎn)和障礙，幫助團(tuán)隊(duì)找到改進(jìn)的機(jī)會(huì)。

案例：銀行在線服務(wù)平臺(tái)可以通過(guò)用戶體驗(yàn)地圖識(shí)別出用戶在進(jìn)行轉(zhuǎn)賬操作時(shí)遇到的困難，進(jìn)而優(yōu)化轉(zhuǎn)賬流程。

4. 跨團(tuán)隊(duì)協(xié)作

優(yōu)點(diǎn)：用戶體驗(yàn)地圖作為一個(gè)可視化工具，可以促進(jìn)跨團(tuán)隊(duì)協(xié)作，使不同部門（如產(chǎn)品、設(shè)計(jì)、開發(fā)和市場(chǎng)）能夠共同參與討論和改進(jìn)用戶體驗(yàn)。

案例：電商平臺(tái)可以通過(guò)用戶體驗(yàn)地圖匯集市場(chǎng)、設(shè)計(jì)和技術(shù)團(tuán)隊(duì)的意見(jiàn)，共同制定優(yōu)化措施。

5. 數(shù)據(jù)驅(qū)動(dòng)決策

優(yōu)點(diǎn)：用戶體驗(yàn)地圖基于用戶研究和數(shù)據(jù)分析，使決策更加數(shù)據(jù)驅(qū)動(dòng)，有助于制定科學(xué)合理的改進(jìn)策略。

案例：健身App可以通過(guò)用戶體驗(yàn)地圖中的用戶數(shù)據(jù)分析，調(diào)整課程推薦策略，提高用戶滿意度和使用頻率。

劣勢(shì)

1. 資源密集

缺點(diǎn)：制作用戶體驗(yàn)地圖需要大量的時(shí)間和資源，包括用戶研究、數(shù)據(jù)分析和團(tuán)隊(duì)協(xié)作。

案例：中小型企業(yè)可能難以投入足夠的資源來(lái)全面制作和維護(hù)用戶體驗(yàn)地圖。

2. 復(fù)雜性

缺點(diǎn)：用戶體驗(yàn)地圖可能變得非常復(fù)雜，特別是當(dāng)用戶旅程涉及多個(gè)觸點(diǎn)和渠道時(shí)，可能難以全面和準(zhǔn)確地記錄所有細(xì)節(jié)。

案例：大型電商平臺(tái)的用戶旅程可能涉及網(wǎng)站、移動(dòng)應(yīng)用、社交媒體等多個(gè)渠道，制作一個(gè)全面的用戶體驗(yàn)地圖可能需要大量的精力。

3. 動(dòng)態(tài)變化

缺點(diǎn)：用戶行為和市場(chǎng)環(huán)境是動(dòng)態(tài)變化的，用戶體驗(yàn)地圖需要不斷更新和維護(hù)，以保持其有效性和準(zhǔn)確性。

案例：健身App的用戶需求和市場(chǎng)趨勢(shì)可能隨時(shí)變化，需要定期更新用戶體驗(yàn)地圖以保持相關(guān)性。

4. 主觀偏差

缺點(diǎn)：盡管用戶體驗(yàn)地圖基于用戶數(shù)據(jù)和研究，但在數(shù)據(jù)解讀和情感記錄上可能存在主觀偏差，影響決策的準(zhǔn)確性。

案例：銀行在線服務(wù)平臺(tái)在記錄用戶情感時(shí)，可能會(huì)受到研究者的主觀影響，從而無(wú)法完全準(zhǔn)確地反映用戶真實(shí)感受。

5. 過(guò)于理想化

缺點(diǎn)：用戶體驗(yàn)地圖有時(shí)可能過(guò)于理想化，忽略了現(xiàn)實(shí)中存在的限制和障礙，導(dǎo)致制定的改進(jìn)措施難以實(shí)施。

案例：電商平臺(tái)在識(shí)別改進(jìn)機(jī)會(huì)時(shí)，可能忽略了技術(shù)實(shí)現(xiàn)上的困難，導(dǎo)致優(yōu)化方案無(wú)法落地。

參考文獻(xiàn)：

https://medium.com/@michaeljiager/user-experience-maps-6184f4044e48

https://liviayang-ms.medium.com/%E4%B8%80%E5%88%86%E9%90%98%E8%AE%93%E4%BD%A0%E4%BA%86%E8%A7%A3%E7%94%A8%E6%88%B6%E9%AB%94%E9%A9%97%E6%AD%B7%E7%A8%8B%E5%9C%96-user-experience-map-e28a1b8817c0https://uxmastery.com/how-to-create-a-customer-journey-map/https://medium.com/art-marketing/incorporating-customer-and-user-experience-data-into-holistic-journey-maps-502ae12072ac

https://uxplanet.org/empathy-map-user-persona-and-user-flow-5299ada245c8https://medium.com/@myskill.id/persona-user-journey-map-ebd84c15ae2f?

作者：CANAAN8
鏈接：https://www.zcool.com.cn/article/ZMTYzMDA4MA==.html
來(lái)源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

藍(lán)藍(lán)設(shè)計(jì)(www.miumiuwan.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制、用戶體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì)，以及相關(guān)的軟件開發(fā)服務(wù)，咨詢電話：01063334945。我們建立了一個(gè)微信群，每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì)，有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng)，咨詢及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

評(píng)論(0) 瀏覽(211)

172024-10

清晰展現(xiàn)關(guān)鍵信息，助力高效決策——數(shù)據(jù)圖表

ui設(shè)計(jì)分享達(dá)人設(shè)計(jì)思維

合理使用數(shù)據(jù)圖表可以幫助用戶更好地理解復(fù)雜的數(shù)據(jù)，提高用戶體驗(yàn)和數(shù)據(jù)的可讀性。選擇合適的圖表類型并遵循最佳設(shè)計(jì)實(shí)踐是確保圖表有效傳達(dá)信息的關(guān)鍵。

數(shù)據(jù)圖表是一種非常重要的可視化工具，它能夠

幫助用戶更直觀地理解和分析數(shù)據(jù)。

借助于圖形化的手段，清晰、快捷有效的傳達(dá)與溝通信息。從用戶的角度，數(shù)據(jù)可視化可以讓用戶快速抓住要點(diǎn)信息，讓關(guān)鍵的數(shù)據(jù)點(diǎn)從人類的眼睛快速通往心靈深處。數(shù)據(jù)可視化一般會(huì)具備以下幾個(gè)特點(diǎn)：準(zhǔn)確性、創(chuàng)新性、簡(jiǎn)潔性。

清晰展現(xiàn)關(guān)鍵信息，助力高效決策——數(shù)據(jù)圖表

作者：Miao_C
鏈接：https://www.zcool.com.cn/article/ZMTYzMjk4NA==.html
來(lái)源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

評(píng)論(0) 瀏覽(68)

172024-10

Web端設(shè)計(jì)語(yǔ)言庫(kù)——數(shù)據(jù)可視化

ui設(shè)計(jì)分享達(dá)人 B端ui設(shè)計(jì)文章及欣賞

一、可視化原則

數(shù)據(jù)可視化是把相對(duì)復(fù)雜、抽象的數(shù)據(jù)通過(guò)可視化手段，表達(dá)數(shù)據(jù)內(nèi)在的信息和規(guī)律，促進(jìn)數(shù)據(jù)信息的傳播和應(yīng)用。

Dreawer Design 團(tuán)隊(duì)總結(jié)了以下四個(gè)可視化原則，供設(shè)計(jì)者參考及使用：

1. 準(zhǔn)確

數(shù)據(jù)圖表需精準(zhǔn)、如實(shí)地反應(yīng)數(shù)據(jù)信息的變化特征。

Web端設(shè)計(jì)語(yǔ)言庫(kù)——數(shù)據(jù)可視化

2. 清晰

讓設(shè)計(jì)服務(wù)于數(shù)據(jù)內(nèi)容，給用戶以最為清晰、明確、迅捷的數(shù)據(jù)展示。用戶看到可視化圖表時(shí)，應(yīng)能在 5 秒內(nèi)了解到它的用途，而不是花幾分鐘都不能理解各個(gè)數(shù)據(jù)的含義。

3. 簡(jiǎn)單

可視化結(jié)果應(yīng)該是一看就懂，不需要思考和過(guò)度理解，因而選定圖表時(shí)要理性，避免為了視覺(jué)上的效果而選擇一些對(duì)用戶不太友好的圖形。

下面為圖標(biāo)類型與認(rèn)知成本對(duì)比：

4. 美觀

優(yōu)秀的數(shù)據(jù)可視化界面，會(huì)有一套非常嚴(yán)謹(jǐn)一致的版面。這里的一致性需要考慮到布局、結(jié)構(gòu)和內(nèi)容。

二、圖表解構(gòu)

1. 構(gòu)成元素

我們從標(biāo)題、坐標(biāo)軸、圖例、標(biāo)簽、提示信息、數(shù)據(jù)圖形這 6 個(gè)大類，對(duì)數(shù)據(jù)圖表進(jìn)行進(jìn)一步元素拆解及闡述。設(shè)計(jì)過(guò)程中，需遵循可視化原則來(lái)精簡(jiǎn)數(shù)據(jù)圖表，讓用戶快速獲取圖表中的關(guān)鍵信息，完成任務(wù)。

圖表構(gòu)成 6 大類，元素細(xì)分：

1. 標(biāo)題：圖表標(biāo)題；

2. 坐標(biāo)軸：X/Y軸線、刻度線、網(wǎng)格線、X/Y軸標(biāo)題、X/Y軸標(biāo)簽；

3. 標(biāo)簽：數(shù)據(jù)點(diǎn)、引導(dǎo)線、（文本）數(shù)據(jù)值；

4. 提示信息；

5. 圖例；

6. 數(shù)據(jù)圖形：線、矩形、扇形、環(huán)形等。

下面為數(shù)據(jù)圖表的基本構(gòu)成元素示例（為了便于觀察，某些字母做了大寫處理）：

除了以上的常規(guī)元素，還有常用于餅圖、環(huán)形圖中的“引導(dǎo)線”：

2. 標(biāo)題

標(biāo)題是概括圖表主題的說(shuō)明文字，一個(gè)明確、精簡(jiǎn)的標(biāo)題可以迅速讓讀者理解圖表要表達(dá)的內(nèi)容。

2.1 位置

一般位于數(shù)據(jù)圖表卡片的左上方。

2.2 使用建議

標(biāo)題需言簡(jiǎn)意賅、符合圖表主題；盡量控制在 20 個(gè)字以內(nèi)，標(biāo)題寬度盡量不要超過(guò)卡片寬度。

2.3超長(zhǎng)處理

當(dāng)標(biāo)題超過(guò)長(zhǎng)出卡片寬度時(shí)，省略標(biāo)題中間的文字，保住首尾，如“我是...標(biāo)題”。

3. 坐標(biāo)軸

3.1 坐標(biāo)系

坐標(biāo)軸包含在坐標(biāo)系的概念里，因此，我們需要先了解坐標(biāo)系。坐標(biāo)系是能夠使每個(gè)數(shù)組在維度空間內(nèi)找到映射關(guān)系的定位系統(tǒng)，更偏向數(shù)學(xué)/物理概念。

數(shù)據(jù)可視化中，最常用的二維坐標(biāo)系有兩種：

笛卡爾坐標(biāo)系：即直角坐標(biāo)系，是由相互垂直的兩條軸線構(gòu)成。常用于柱狀圖、條形圖、折線圖、面積圖等。

極坐標(biāo)系：由極點(diǎn)、極軸組成，坐標(biāo)系內(nèi)任何一個(gè)點(diǎn)都可以用極徑 r 和夾角 θ（逆時(shí)針為正）表示。常用于餅圖、圓環(huán)圖、雷達(dá)圖等。

補(bǔ)充說(shuō)明：

1. 坐標(biāo)軸由定義域軸（X 軸）和值域軸（Y 軸）組成。條形圖中，定義域軸為 Y 軸，值域軸為 X 軸。

2. X軸為水平方向的橫軸，Y 軸為垂直方向的豎軸。以下主要針對(duì)笛卡爾坐標(biāo)系的坐標(biāo)軸構(gòu)成進(jìn)行分析：

3.2 坐標(biāo)軸

定義：坐標(biāo)軸指二維空間中統(tǒng)計(jì)圖表中的軸，是坐標(biāo)系的構(gòu)成部分，它用來(lái)定義坐標(biāo)系中數(shù)據(jù)在方向和值之間的映射關(guān)系。

構(gòu)成元素細(xì)分：X/Y 軸線、刻度線、網(wǎng)格線、X/Y 軸標(biāo)題、X/Y 軸標(biāo)簽。

3.3 軸類型

根據(jù)對(duì)應(yīng)變量是連續(xù)數(shù)據(jù)還是離散數(shù)據(jù)，可以把坐標(biāo)軸分為：分類軸、時(shí)間軸、連續(xù)軸三大類。

3.4 X/Y 軸線

顏色層級(jí)：X/Y軸線要比網(wǎng)格線層級(jí)高、顏色深，這樣能讓圖表有主次區(qū)分。

使用建議：有網(wǎng)格線時(shí)，柱狀圖/折線圖會(huì)隱藏 Y 軸線，條形圖則是隱藏 X 軸線，以達(dá)到信息降噪、突出重點(diǎn)的目的。

3.5 刻度線

軸刻度線是軸線上的小線段，用于指示數(shù)值標(biāo)簽在坐標(biāo)軸上的具體位置。軸刻度線有 3 種放置方式：置內(nèi)、置中（即交叉方式）、置外。

位置建議：刻度線置中/置內(nèi)時(shí)，可能會(huì)和網(wǎng)格線、數(shù)據(jù)圖形重疊，所以建議將刻度線置于數(shù)值坐標(biāo)軸外側(cè)，以呈現(xiàn)最佳顯示效果。

顯示建議：

折線圖：刻度線、X/Y 軸標(biāo)簽、數(shù)據(jù)點(diǎn)需要保持在同一垂直線上；

柱狀圖/條形圖：由于單個(gè)柱子有很強(qiáng)的對(duì)應(yīng)關(guān)系，此時(shí)可以隱藏刻度線；

3.6 網(wǎng)格線

定義：網(wǎng)格線是用來(lái)輔助圖表優(yōu)化映射關(guān)系的，我們需要弱化網(wǎng)格線的視覺(jué)效果，來(lái)增加數(shù)據(jù)的可閱讀性。

作用：1. 延伸數(shù)值刻度至可視化對(duì)象中，以便觀察數(shù)據(jù)值的大??；2. 增加可視化對(duì)象之間的對(duì)比觀察度。

使用建議 1 ：使用網(wǎng)格線時(shí)，需遵從主次原則，以軸線為主、網(wǎng)格線為輔；樣式上可采用實(shí)線或虛線；避免顏色過(guò)重、使用純黑/純白色。

使用建議 2 ：網(wǎng)格線一般跟隨值域軸的位置單向顯示，柱狀圖、折線圖等采用水平網(wǎng)格，條形圖采用垂直網(wǎng)格。

3.7 X/Y 軸標(biāo)題

軸標(biāo)題主要用于說(shuō)明坐標(biāo)軸數(shù)據(jù)組的含義，也可理解為“軸單位”。當(dāng)可視化圖表標(biāo)題、圖例、軸標(biāo)簽等已能充分表達(dá)數(shù)據(jù)含義時(shí)，可隱藏軸標(biāo)題。

這樣處理體現(xiàn)了奧卡姆剃刀定律：如無(wú)必要，勿增實(shí)體。

3.8 X/Y 軸標(biāo)簽

軸標(biāo)簽是對(duì)當(dāng)前某一組數(shù)據(jù)的內(nèi)容標(biāo)注，用于提高數(shù)據(jù)的可讀性。

以下從 X 軸標(biāo)簽、Y軸標(biāo)簽兩方面進(jìn)行分析：

a. X 軸標(biāo)簽

X 軸標(biāo)簽的設(shè)計(jì)重點(diǎn)在顯示規(guī)則上?？ㄆ瑢挾冗^(guò)窄、標(biāo)簽過(guò)多、名稱過(guò)長(zhǎng)時(shí)，X 軸標(biāo)簽便會(huì)出現(xiàn)顯示問(wèn)題（如標(biāo)簽重疊等）。

為了解決顯示問(wèn)題，我們從連續(xù)/時(shí)間軸標(biāo)簽（數(shù)值類）、分類軸標(biāo)簽（文本類）兩方面進(jìn)行分析：

連續(xù)/時(shí)間軸標(biāo)簽

顯示規(guī)則：建議等分抽樣顯示、旋轉(zhuǎn)；不尾部省略。

建議等分抽樣：連續(xù)/時(shí)間軸，通常由一組等差數(shù)列組成，具有規(guī)律性，缺失的數(shù)據(jù)用戶會(huì)在腦海中自動(dòng)補(bǔ)全。所以建議用等分抽樣來(lái)避免標(biāo)簽的重疊問(wèn)題。

注意：等分抽樣盡量保留首尾數(shù)據(jù)標(biāo)簽；隨機(jī)抽樣沒(méi)有規(guī)律，會(huì)影響用戶的判斷及辨認(rèn)，不建議采取隨機(jī)抽樣顯示。

連續(xù)/時(shí)間軸標(biāo)簽是由“關(guān)鍵數(shù)值”組成的標(biāo)注點(diǎn)，一般都明確精簡(jiǎn)，尾部省略會(huì)影響用戶對(duì)關(guān)鍵數(shù)值的辨認(rèn)。

為了保證標(biāo)簽的辨識(shí)度，我們可以將標(biāo)簽旋轉(zhuǎn) 45°、 90° 。極端情況下（圖表寬度極窄），可以同時(shí)進(jìn)行旋轉(zhuǎn)+抽樣。

分類軸標(biāo)簽

顯示規(guī)則：建議旋轉(zhuǎn)顯示；不建議抽樣顯示。

分類軸由幾個(gè)離散數(shù)據(jù)標(biāo)簽組成，標(biāo)簽之間獨(dú)立存在，無(wú)緊密邏輯關(guān)系，用戶無(wú)法自動(dòng)補(bǔ)全缺失信息。因此，不能采取抽樣顯示，應(yīng)盡量展示全部標(biāo)簽的全部文本。

若標(biāo)簽橫向展示空間不夠（文字重疊），我們可以將標(biāo)簽旋轉(zhuǎn) 45°、 90° 來(lái)達(dá)到預(yù)期顯示效果。若通過(guò)旋轉(zhuǎn)無(wú)法滿足需求，可使用條形圖，將分類軸放在Y軸。

旋轉(zhuǎn)方向說(shuō)明：通常情況下，用戶的閱讀視線為從左至右、從上到下。因此，標(biāo)簽順時(shí)針旋轉(zhuǎn) 45° 更符合用戶的瀏覽習(xí)慣。

b. Y 軸標(biāo)簽

Y 軸標(biāo)簽的設(shè)計(jì)重點(diǎn)在標(biāo)簽數(shù)量、取值范圍和數(shù)據(jù)格式上。標(biāo)簽顯示區(qū)域一般根據(jù)最長(zhǎng)標(biāo)簽寬度進(jìn)行自適應(yīng)縮放。

軸標(biāo)簽的數(shù)量

使用建議：根據(jù)米勒定律（7±2 法則），Y 軸標(biāo)簽數(shù)量應(yīng)控制在 5-9 個(gè)的范圍內(nèi)；Web頁(yè)面中，Y 軸常用標(biāo)簽數(shù)為：6 或 7（含標(biāo)簽0）。

軸標(biāo)簽的數(shù)量越多，橫向網(wǎng)格線就會(huì)越多。過(guò)多的軸標(biāo)簽及網(wǎng)格線會(huì)造成元素冗余，違背了清晰、準(zhǔn)確的可視化原則，也不利于圖表信息的表達(dá)及閱讀。

對(duì)齊方式：右對(duì)齊

軸標(biāo)簽的取值范圍

基準(zhǔn)線： Y 軸標(biāo)簽取值應(yīng)從 0 基線開始，以反映數(shù)據(jù)的真實(shí)性。如果展示被截?cái)嗟?Y 軸數(shù)據(jù)，會(huì)導(dǎo)致用戶做出錯(cuò)誤的判斷。

軸標(biāo)簽的數(shù)據(jù)格式

使用建議 1：標(biāo)簽保留的小數(shù)位數(shù)保持統(tǒng)一。

4. 數(shù)據(jù)標(biāo)簽

數(shù)據(jù)標(biāo)簽是對(duì)數(shù)據(jù)點(diǎn)對(duì)應(yīng)數(shù)值的標(biāo)注，用于直接觀察每個(gè)數(shù)據(jù)點(diǎn)的具體數(shù)值。

若圖表主要是用來(lái)看趨勢(shì)變化、占比大小等，則不需要顯示數(shù)據(jù)標(biāo)簽。若想精確了解每組數(shù)據(jù)的具體數(shù)值，則可以顯示數(shù)據(jù)標(biāo)簽。

4.1 位置

數(shù)據(jù)標(biāo)簽位于數(shù)據(jù)點(diǎn)的上方。

4.2 顯示規(guī)則

在不同類型的圖表中，數(shù)據(jù)標(biāo)簽的顯示規(guī)則不同。我們可以根據(jù)數(shù)據(jù)圖形、數(shù)據(jù)值的特性，選擇合適的顯示方式，提高圖表的準(zhǔn)確性。

a. 柱狀圖

基礎(chǔ)柱狀圖

：數(shù)據(jù)標(biāo)簽可顯示在數(shù)據(jù)圖形內(nèi)部、外部。

數(shù)據(jù)標(biāo)簽在圖形內(nèi)部的顯示規(guī)則：正常情況下，橫向顯示；數(shù)據(jù)標(biāo)簽超長(zhǎng)時(shí)，旋轉(zhuǎn) 90°；圖形高度 < 數(shù)據(jù)標(biāo)簽高度時(shí)，不顯示數(shù)據(jù)標(biāo)簽。

分組柱狀圖

：數(shù)據(jù)標(biāo)簽可顯示在數(shù)據(jù)圖形內(nèi)部、外部。顯示在內(nèi)部的數(shù)據(jù)標(biāo)簽顯示寬度不夠時(shí)，解決方案同上。

堆疊柱狀圖

：數(shù)據(jù)標(biāo)簽顯示在數(shù)據(jù)圖形內(nèi)部。

b. 條形圖

數(shù)據(jù)標(biāo)簽在圖形內(nèi)部的顯示規(guī)則：正常情況下，橫向顯示；圖形寬度 < 數(shù)據(jù)標(biāo)簽高度時(shí)，不顯示數(shù)據(jù)標(biāo)簽；條形圖高度需 >= 數(shù)據(jù)標(biāo)簽高度。

基礎(chǔ)、分組條形圖的數(shù)據(jù)標(biāo)簽也可以顯示在圖形外部：

c. 折線圖

數(shù)據(jù)標(biāo)簽顯示在數(shù)據(jù)點(diǎn)的上方。

圖表寬度過(guò)窄，數(shù)據(jù)點(diǎn)多且密時(shí)，相鄰的數(shù)據(jù)標(biāo)簽會(huì)出現(xiàn)重疊的問(wèn)題。此時(shí)，我們會(huì)采用抽樣的方式顯示數(shù)據(jù)標(biāo)簽。鼠標(biāo)懸停數(shù)據(jù)點(diǎn)，顯示隱藏的數(shù)據(jù)標(biāo)簽。

d. 餅圖、環(huán)形圖

數(shù)據(jù)標(biāo)簽顯示在圖形內(nèi)部、外部均可。

由于扇形有角度，且形狀相對(duì)不規(guī)則，對(duì)數(shù)據(jù)標(biāo)簽的文本長(zhǎng)度包容度較低，環(huán)形更是如此。所以，當(dāng)扇/環(huán)形分割過(guò)多、面積較小時(shí)，建議將數(shù)據(jù)標(biāo)簽顯示在圖形外部。

當(dāng)然，我們也可以內(nèi)外部結(jié)合使用：

e. 數(shù)據(jù)標(biāo)簽顏色

數(shù)據(jù)標(biāo)簽顯示在圖形內(nèi)部時(shí)，圖形為背景，數(shù)據(jù)標(biāo)簽為前景。此時(shí)，數(shù)據(jù)圖形作為背景色，會(huì)影響到數(shù)據(jù)標(biāo)簽的顯色度及易讀性。

為了確保良好的可讀性，我們通過(guò)對(duì)圖形顏色 HS 值的判斷，來(lái)決定文字的顏色。這樣對(duì)比度就在可控范圍內(nèi)，不會(huì)出現(xiàn)可讀性低的問(wèn)題。

由于篇幅問(wèn)題，剩余內(nèi)容接下一篇文章展示

作者：布魯星人
鏈接：https://www.zcool.com.cn/article/ZMTYzNzI0NA==.html
來(lái)源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

評(píng)論(0) 瀏覽(71)

172024-10

從對(duì)話到嵌入：多元場(chǎng)景AI形態(tài)淺析

ui設(shè)計(jì)分享達(dá)人行業(yè)趨勢(shì)

前言

當(dāng)我們一次次被AI技術(shù)帶來(lái)的變革所驚艷，當(dāng)ChatGPT一次次宣布其能力已經(jīng)突破了人類的想象，你是否注意到現(xiàn)有產(chǎn)品與AI融合的新趨勢(shì)？值得注意的是，新技術(shù)的出現(xiàn)也一定帶來(lái)了新的交互體驗(yàn)。本文將以多種產(chǎn)品場(chǎng)景為例，梳理PC端多種主流的AI融合形態(tài)，希望能給大家?guī)?lái)啟發(fā)。

多元場(chǎng)景下的主流AI形態(tài)

目前主流AI產(chǎn)品有如下3種主要形態(tài)，分別為沉浸式的AI智能體(Agent)、伴隨式的AI副駕駛(Co-pilot)、嵌入式的AI場(chǎng)景化嵌入(Embedding)。這3種形態(tài)在能力、界面、操作體驗(yàn)和適用場(chǎng)景都上存在顯著差異。

一、沉浸式形態(tài)

AI智能體(Agent)—功能強(qiáng)大的AI伙伴

一個(gè)富有主動(dòng)性的獨(dú)立伙伴，輸出的結(jié)果不完全依賴用戶的輸入，啟動(dòng)AI問(wèn)詢后有2種主流的形態(tài)：

①「對(duì)話智能體」以對(duì)話流的形式展示信息，用戶通過(guò)在當(dāng)前語(yǔ)境下進(jìn)行追問(wèn)獲取最終結(jié)果；

②「目標(biāo)智能體」用戶輸入指令后，一次性給予用戶“靠譜”的結(jié)果，配有側(cè)邊欄可進(jìn)行多種輔助操作。

1.對(duì)話智能體示例—Gemini

以谷歌Gemini產(chǎn)品為例，其作為對(duì)話流的智能體，為滿足搜索場(chǎng)景，具有以下特征：

1）冷啟頁(yè)P(yáng)rompt形象化

相較于2023年初Gemini冷啟時(shí)的樣式，最近改版中冷啟的Prompt卡片變得形象化，當(dāng)然我們也在其他Agent產(chǎn)品中觀察到了這一變化。

2）多模態(tài)內(nèi)容

理解用戶的文字意圖，依據(jù)要求自主生成多模態(tài)卡片是對(duì)話智能體的主要特征之一，該功能可以極大地豐富AI反饋的多樣性，并能提高信息傳達(dá)的效率。

3）信息索引的顯示

信息索引的展示是提升AI回答權(quán)威性和透明度的關(guān)鍵因素。然而，直接在閱讀內(nèi)容中嵌入索引標(biāo)簽，可能在某些情況下影響用戶的閱讀連貫性。以Gemini為例，當(dāng)前的設(shè)計(jì)允許用戶在卡片下方手動(dòng)啟用索引信息，這種靈活性平衡了信息的可信度和閱讀體驗(yàn)，適合多數(shù)日常場(chǎng)景。

當(dāng)然，從設(shè)計(jì)角度考慮，某些情況下默認(rèn)收起索引并非最佳選擇。在用戶高度依賴信息準(zhǔn)確性的場(chǎng)景中，如金融或醫(yī)學(xué)領(lǐng)域，索引的可見(jiàn)性將會(huì)直接影響信任感。對(duì)于深入研究或延展閱讀需求較高的用戶，即時(shí)查看索引能更高效地獲取信息來(lái)源。

與之類似，在涉及多方信息傳播的業(yè)務(wù)分發(fā)場(chǎng)景，清晰可見(jiàn)的索引有助于減少誤解，提高效率。在這些情況下，索引的默認(rèn)展開不僅強(qiáng)化了內(nèi)容的可靠性，也更好地支持了用戶的深入需求。

2.目標(biāo)智能體示例—Perplexity

Perplexity作為最近廣受好評(píng)的AI搜索工具，相較于Gemini，它更注重給予用戶最精準(zhǔn)的答案。基于RAG技術(shù)的Perplexity為用戶提供了一種新的“確定性”，而鑒于這種特征，Perplexity擁有雙面板的形態(tài)，可以對(duì)當(dāng)前確定性的信息進(jìn)行深化處理。

1 ）輸入即結(jié)果

相較于Gemini等對(duì)話智能體產(chǎn)品，AI Agent用戶需要反復(fù)追問(wèn)結(jié)果，而在體驗(yàn)Perplexity時(shí)的無(wú)對(duì)話場(chǎng)景感，更傾向于一次性給予用戶“靠譜”的答案。

2）側(cè)分欄—信息補(bǔ)充

因?yàn)镻erplexity一次就可以給予用戶最“準(zhǔn)確”的信息，用戶可能沒(méi)有追問(wèn)的必要，但可能會(huì)有對(duì)于當(dāng)前問(wèn)答進(jìn)行深度搜索的需求，這時(shí)會(huì)有右側(cè)GUI分欄的出現(xiàn)，以便用戶進(jìn)行輔助搜索。

3.思考：給予用戶最佳答案的AI形態(tài)

在使用體驗(yàn)上，Gemini與Perplexity雖然走向兩個(gè)不同的流派，但目的都是為了給用戶呈現(xiàn)最佳的搜索結(jié)果。Gemini就像一位富有想象力的對(duì)話者，用戶在對(duì)話中通過(guò)不斷地追問(wèn)來(lái)獲得最佳的結(jié)果，而Perplexity更像一個(gè)AI版的知乎，它堅(jiān)持“用戶不會(huì)犯錯(cuò)”原則，冷靜客觀地為用戶提供最精準(zhǔn)的答案。

二、伴隨式形態(tài)

AI副駕駛(Copilot)—被動(dòng)性的AI助手

這種形態(tài)下的AI更多扮演“副駕駛”的角色，為用戶提供建議和幫助，依賴用戶精準(zhǔn)的指令對(duì)當(dāng)前內(nèi)容窗口進(jìn)行操作，一般以側(cè)邊欄形式展示，目前的Office文檔類產(chǎn)品多采用此類形態(tài)。

1.AI副駕駛產(chǎn)品示例-Office

在近年的開發(fā)者大會(huì)中，微軟提到最多的詞就是“Copilot”，力推將AI技術(shù)快速融入到旗下應(yīng)用中。其中，Office軟件就融入了AI副駕駛的理念，該形態(tài)下的AI主要為用戶提供產(chǎn)品的創(chuàng)作輔助、信息的查詢總結(jié)等功能。

1）當(dāng)前場(chǎng)景下的AI助手

AI的能力默認(rèn)被限定在當(dāng)前場(chǎng)景下，滿足用戶問(wèn)詢、信息檢索、創(chuàng)作輔助等操作。

2）被動(dòng)性AI助手

Copilot無(wú)法自動(dòng)執(zhí)行操作去修改當(dāng)前頁(yè)面內(nèi)容，需要用戶確認(rèn)后才可執(zhí)行，用戶執(zhí)行操作后會(huì)在側(cè)邊欄內(nèi)顯示操作記錄與撤銷操作的入口。

3）輔助Prompt

由于AI副駕駛的特性，常常需要準(zhǔn)確的Prompt才能執(zhí)行符合預(yù)期的操作，這對(duì)大部分用戶來(lái)說(shuō)門檻較高，因此在使用時(shí)需要及時(shí)給予用戶合理的聯(lián)想Prompt，輔助用戶決策。

2.思考：提高用戶工作效率的AI助手

作為被動(dòng)性AI助手，用戶即使不使用也不會(huì)影響其在整體頁(yè)面中的操作，AI更多承擔(dān)的是提升用戶工作效率過(guò)程中的輔助角色。

三、嵌入式形態(tài)

AI場(chǎng)景化嵌入(Embedding)

嵌入式AI主要聚焦特定場(chǎng)景的AI輔助，如AI即時(shí)性地生成對(duì)當(dāng)前評(píng)論的回復(fù)，此類交互無(wú)固定形態(tài)，AI會(huì)在用戶進(jìn)行高頻重要操作時(shí)即時(shí)觸發(fā)。

在多元化場(chǎng)景中，嵌入式AI的設(shè)計(jì)相較于前兩類更加靈活和輕量，通常以LGUI(輕量化用戶界面)為核心，強(qiáng)調(diào)用戶與AI之間的無(wú)縫銜接與高效互動(dòng)。

與對(duì)話式或結(jié)構(gòu)化阿拉丁模式相比，嵌入式AI的設(shè)計(jì)思路更加通暢，摒棄了復(fù)雜的交互流程，更注重場(chǎng)景中的引導(dǎo)性和即時(shí)反饋，幫助用戶在合適的時(shí)機(jī)獲取所需信息。

1.嵌入式AI示例—One Drive

以微軟One Drive為例，嵌入式AI不僅會(huì)在用戶整理文件時(shí)提供智能建議，還能在用戶分享文件時(shí)根據(jù)歷史記錄和內(nèi)容精準(zhǔn)推薦分享對(duì)象。這種場(chǎng)景化的嵌入，展現(xiàn)了如何通過(guò)LGUI設(shè)計(jì)最大化提高效率，而非依賴傳統(tǒng)對(duì)話或復(fù)雜交互。

場(chǎng)景一: 文件整理AI建議

在AI為相關(guān)文件創(chuàng)建新文件夾的情境中，執(zhí)行完成后，它會(huì)主動(dòng)詢問(wèn)用戶是否需要將其他可能相關(guān)的文件一并移入到新建的文件夾中，以幫助用戶進(jìn)一步整理文件。AI能夠基于文件內(nèi)容的上下文，敏銳地判斷出哪些文件可能屬于同一類別，進(jìn)而為用戶提供便捷的一鍵整理服務(wù)。

場(chǎng)景二: 智能分享建議

當(dāng)用戶準(zhǔn)備在One Drive中分享文件時(shí)，AI助手會(huì)根據(jù)文件內(nèi)容和用戶的歷史分享記錄，預(yù)測(cè)出最可能需要分享的對(duì)象名單，為用戶精準(zhǔn)推薦受眾人員。智能分享建議可以極大地節(jié)省用戶挑選分享對(duì)象的時(shí)間。

基于上述2個(gè)例子，我們可以對(duì)嵌入式AI有進(jìn)一步的思考：

合理的嵌入式AI操作只在用戶進(jìn)行重要操作時(shí)被“激活”，能夠在當(dāng)前場(chǎng)景下即時(shí)給予用戶建議；

嵌入式AI一般情況下點(diǎn)擊大于錄入，方便用戶快速做出決定；

設(shè)計(jì)此類交互時(shí)，需要深度理解用戶使用場(chǎng)景，AI的喚起不應(yīng)干擾用戶對(duì)于主流程的操作體驗(yàn)。

2.思考：效率導(dǎo)向的AI嵌入設(shè)計(jì)

對(duì)于普通設(shè)計(jì)師來(lái)說(shuō)，容易在純對(duì)話交互和結(jié)構(gòu)化設(shè)計(jì)兩端搖擺，可能忽視了效率也是設(shè)計(jì)的重要原則。嵌入式AI的設(shè)計(jì)啟示在于“什么合適用什么”，既不過(guò)度依賴復(fù)雜的對(duì)話式設(shè)計(jì)，也不拘泥于結(jié)構(gòu)化方案。關(guān)鍵在于聚焦場(chǎng)景需求，以最簡(jiǎn)便和有效的方式幫助用戶完成任務(wù)。因此，在嵌入式AI的設(shè)計(jì)中，保持界面的簡(jiǎn)潔與流暢，同時(shí)結(jié)合輕量化的LGUI原則，才是提升用戶體驗(yàn)的關(guān)鍵。最終目標(biāo)始終是“效率”，無(wú)論采用何種形式，選擇最適合當(dāng)前場(chǎng)景的交互模式才是設(shè)計(jì)的核心。

未來(lái)的AI設(shè)計(jì)

多樣化形態(tài)下的平衡與共生

隨著AI技術(shù)的迅速發(fā)展，各種AI形態(tài)在不同場(chǎng)景中不斷涌現(xiàn)，如上述討論的沉浸式、伴隨式、嵌入式等設(shè)計(jì)形態(tài)。無(wú)論是主動(dòng)性強(qiáng)的智能體、輔助型的副駕駛，還是輕量化的嵌入式方案，每一種設(shè)計(jì)都展現(xiàn)出其獨(dú)特的價(jià)值。

然而，在這些多樣化的形態(tài)背后，我們?nèi)孕杌貧w一個(gè)核心問(wèn)題：什么樣的AI設(shè)計(jì)才是理想的？

首先，沒(méi)有一種AI形態(tài)能夠完美適用所有場(chǎng)景，真正成功的AI設(shè)計(jì)應(yīng)始終圍繞需求展開。在效率為先的原則下，設(shè)計(jì)師需要深刻理解用戶在不同情境下的核心需求，并選擇最適合的交互形態(tài)。復(fù)雜的對(duì)話式和高度結(jié)構(gòu)化的設(shè)計(jì)并非萬(wàn)能，嵌入式AI的靈活性和輕量化設(shè)計(jì)則為平衡提供了啟發(fā)—服務(wù)于效率與體驗(yàn)，簡(jiǎn)化不必要的交互，專注于解決用戶的實(shí)際問(wèn)題。

其次，AI設(shè)計(jì)的多樣性并不意味著割裂，而是指向共生與融合。未來(lái)，AI技術(shù)將進(jìn)一步打破不同形態(tài)之間的界限，形成更加靈活、動(dòng)態(tài)的交互模式。這種融合不僅依賴更智能的技術(shù)，還要求設(shè)計(jì)師在實(shí)際應(yīng)用中敏銳捕捉用戶需求，提供真正有價(jià)值的解決方案。

最后，設(shè)計(jì)的核心原則是以用戶為中心，強(qiáng)調(diào)合適性，而非追求炫技。無(wú)論是大型智能體的復(fù)雜場(chǎng)景處理，還是嵌入式AI的場(chǎng)景化介入，優(yōu)秀的設(shè)計(jì)應(yīng)始終聚焦用戶需求，在不同場(chǎng)景中找到最優(yōu)平衡點(diǎn)。隨著技術(shù)的進(jìn)化，設(shè)計(jì)師需要更加專注于如何將AI技術(shù)自然、無(wú)縫地融入用戶的工作與生活，使每一次交互都變得更加高效和愉快。

在未來(lái)，AI的形態(tài)將會(huì)更加多元，但不變的仍是設(shè)計(jì)師對(duì)效率、用戶價(jià)值和場(chǎng)景適配的持續(xù)探索。希望設(shè)計(jì)師在面對(duì)AI設(shè)計(jì)時(shí)，始終尋求既符合用戶需求又能提升效率的最佳方案。

作者：百度MEUX
鏈接：https://www.zcool.com.cn/article/ZMTYzMzkxNg==.html
來(lái)源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

評(píng)論(0) 瀏覽(79)

172024-10

用戶體驗(yàn)一致性思考

ui設(shè)計(jì)分享達(dá)人交互設(shè)計(jì)及用戶體驗(yàn)

前言

在團(tuán)隊(duì)內(nèi)部，我們已確立了一套設(shè)計(jì)規(guī)范，在日常項(xiàng)目中使用設(shè)計(jì)規(guī)范輸出變的高效、統(tǒng)一。然而，在實(shí)際操作中，不可避免地會(huì)遇到一些特殊情況：某些客戶提出的個(gè)性化需求并不完全契合既定的設(shè)計(jì)規(guī)范,這些促使我們不得不在保持設(shè)計(jì)一致性的基礎(chǔ)上進(jìn)行靈活調(diào)整。因此，深入反思并優(yōu)化一致性原則的應(yīng)用策略顯得尤為重要。我們需要探索如何在堅(jiān)守設(shè)計(jì)規(guī)范核心精神的同時(shí)，靈活應(yīng)對(duì)多變的需求，確保設(shè)計(jì)既保持統(tǒng)一和諧，又能滿足特定場(chǎng)景下的獨(dú)特需求，從而實(shí)現(xiàn)用戶體驗(yàn)與品牌價(jià)值的雙重提升。

在UI/UX設(shè)計(jì)中，雅各布·尼爾森的十條可用性原則中，一致性（Consistency and standards）位列第四。這一原則強(qiáng)調(diào)在界面和交互設(shè)計(jì)上需要遵循既定的規(guī)則，無(wú)論是在應(yīng)用內(nèi)部還是跨平臺(tái)之間。

背后的心理學(xué)原理——重復(fù)定律，強(qiáng)調(diào)了信息重復(fù)對(duì)于鞏固記憶的重要性。正如赫爾曼·艾賓浩斯通過(guò)“遺忘曲線”所揭示的，信息的有效保留離不開重復(fù)接觸。一致性的應(yīng)用正是這一原理的生動(dòng)實(shí)踐，通過(guò)不斷重復(fù)統(tǒng)一的設(shè)計(jì)元素與模式，強(qiáng)化用戶對(duì)產(chǎn)品的認(rèn)知與記憶，從而提升整體的用戶滿意度與忠誠(chéng)度。

艾賓浩斯遺忘曲線

用戶側(cè)

1、用戶學(xué)習(xí)曲線：

一致的UI/UX設(shè)計(jì)可以降低用戶的學(xué)習(xí)曲線。當(dāng)用戶在應(yīng)用程序或網(wǎng)站中遇到一致的元素、布局和交互方式時(shí)，他們可以快速理解并準(zhǔn)確預(yù)測(cè)如何與界面進(jìn)行交互。這減少了用戶的混淆和困惑，提高了他們的效率和滿意度。

2、提升可用性：

一致性使用戶界面更加易于使用。當(dāng)用戶在不同的頁(yè)面或功能之間找到相似的設(shè)計(jì)元素和交互模式時(shí)，他們可以輕松地將已有的知識(shí)和經(jīng)驗(yàn)應(yīng)用于新的情境中。這種一致性幫助用戶快速完成任務(wù)，減少錯(cuò)誤和迷失，提供更好的導(dǎo)航和流暢的體驗(yàn)。

3、品牌認(rèn)可度：

一致的UI/UX設(shè)計(jì)有助于樹立品牌形象和增強(qiáng)品牌認(rèn)可度。通過(guò)在不同的渠道和平臺(tái)上保持一致的設(shè)計(jì)元素、標(biāo)識(shí)和視覺(jué)風(fēng)格，品牌可以建立起獨(dú)特而可識(shí)別的形象。用戶在不同的觸點(diǎn)上都能感受到品牌的一致性，從而增加品牌的信任和忠誠(chéng)度。

4、用戶滿意度：

一致性直接影響用戶的滿意度。當(dāng)用戶在使用應(yīng)用程序或網(wǎng)站時(shí)感受到一致的設(shè)計(jì)和交互方式時(shí)，他們會(huì)感到更加舒適和自信。一致性傳遞了專業(yè)和質(zhì)量的信號(hào)，讓用戶感到被關(guān)注和重視。這種積極的用戶體驗(yàn)有助于提升用戶滿意度，并促使他們持續(xù)使用和推薦你的產(chǎn)品或服務(wù)。

產(chǎn)研側(cè)

1. 降低設(shè)計(jì)成本，提高開發(fā)效率

無(wú)論是設(shè)計(jì)還是開發(fā)，復(fù)用已有的組件資源，保持界面的一致性可以有效地減少設(shè)計(jì)的投入，避免不必要的設(shè)計(jì)分歧點(diǎn)。

而在開發(fā)階段，可以避免重復(fù)造輪子，提高開發(fā)的效率，保證落地效果，也可以減少上線前設(shè)計(jì)走查、測(cè)試的工作量。

2. 形成一致的設(shè)計(jì)風(fēng)格

根據(jù)原子設(shè)計(jì)理論，通過(guò)原子組件的一致性，可以構(gòu)建出統(tǒng)一的界面框架、布局，形成統(tǒng)一風(fēng)格和用戶交互認(rèn)知，從而更好地保證用戶體驗(yàn)質(zhì)量。

色彩

色彩作為一種兼具物理屬性與感官享受的復(fù)雜現(xiàn)象，其本質(zhì)在于光波在人體視網(wǎng)膜上的特定波長(zhǎng)被反射或吸收后，所引發(fā)的視覺(jué)感知結(jié)果。在設(shè)計(jì)領(lǐng)域，色彩的選擇與運(yùn)用不僅是視覺(jué)藝術(shù)的展現(xiàn)，更是品牌身份與個(gè)性的直接體現(xiàn)。諸如餓了么標(biāo)志性的藍(lán)色、美團(tuán)鮮明的黃色、以及京東熱情的紅色等，這些品牌專屬色彩不僅構(gòu)成了品牌識(shí)別系統(tǒng)的重要組成部分，還通過(guò)其高度的一致性，在視覺(jué)層面上構(gòu)建起強(qiáng)烈的品牌認(rèn)知，營(yíng)造出統(tǒng)一和諧的視覺(jué)體驗(yàn)。

色彩的一致性策略在品牌塑造中發(fā)揮著不可估量的作用，它能夠有效增強(qiáng)品牌的記憶度與辨識(shí)度，深化品牌形象在消費(fèi)者心中的烙印，進(jìn)而提升產(chǎn)品的市場(chǎng)吸引力和用戶忠誠(chéng)度。同時(shí)，這種策略還促進(jìn)了設(shè)計(jì)元素間的和諧共存，包括按鈕、圖標(biāo)、字體、標(biāo)簽、背景、以及關(guān)鍵視覺(jué)元素如Banner等，均能在統(tǒng)一的色彩體系下實(shí)現(xiàn)視覺(jué)上的連貫與流暢，極大地提升了產(chǎn)品的可用性、無(wú)障礙性，以及用戶在使用過(guò)程中的整體滿意度與交互體驗(yàn)。

字體

字體作為設(shè)計(jì)中不可或缺的核心要素，其獨(dú)特性在于能夠精準(zhǔn)地塑造文字的視覺(jué)形象，涵蓋形狀、尺寸、粗細(xì)、字間距等多維度特征。這些特征共同構(gòu)建了一種獨(dú)特的文字風(fēng)格，不僅承載著信息的傳遞功能，更在無(wú)形中引導(dǎo)著用戶的視覺(jué)流程，影響著信息的接收與理解深度。因此，在設(shè)計(jì)過(guò)程中，合理選擇與應(yīng)用字體顯得尤為關(guān)鍵。

字體類型的多樣性，如有襯線字體與無(wú)襯線字體的對(duì)比，不僅體現(xiàn)了風(fēng)格上的差異，還隱含了不同的閱讀體驗(yàn)與情感表達(dá)。字體的粗細(xì)變化（如細(xì)體、常規(guī)、粗體等）更是能夠強(qiáng)調(diào)文本的重要性層級(jí)，增強(qiáng)信息的層次感與可讀性。此外，字重的調(diào)整也是塑造視覺(jué)焦點(diǎn)、引導(dǎo)視線流動(dòng)的有效手段，對(duì)于提升設(shè)計(jì)的整體美觀度和信息傳達(dá)效率具有不可小覷的作用。

然而，在實(shí)際的開發(fā)與實(shí)現(xiàn)過(guò)程中，若不加節(jié)制地使用多種字體，不僅會(huì)顯著增加頁(yè)面的加載時(shí)間，影響用戶體驗(yàn)的流暢性，還可能因風(fēng)格不統(tǒng)一而導(dǎo)致頁(yè)面顯得雜亂無(wú)章，破壞整體設(shè)計(jì)的和諧感。因此，制定一套統(tǒng)一、規(guī)范的字體使用策略顯得尤為重要。這不僅有助于提升開發(fā)效率，減少后期更新迭代的復(fù)雜度，還能有效避免資源浪費(fèi)，確保設(shè)計(jì)作品在視覺(jué)上的一致性與專業(yè)性。

圖標(biāo)

圖標(biāo)作為用戶界面設(shè)計(jì)中至關(guān)重要的元素，風(fēng)格直接影響到用戶的使用體驗(yàn)與對(duì)產(chǎn)品的整體印象。圖標(biāo)以其簡(jiǎn)潔、直觀且富有表現(xiàn)力的特點(diǎn)，在快速傳達(dá)信息、引導(dǎo)用戶操作方面發(fā)揮著不可替代的作用。在設(shè)計(jì)中，圖標(biāo)的設(shè)計(jì)與應(yīng)用更是需要精心考量，以確保其既能夠準(zhǔn)確傳達(dá)信息，又能夠與整體設(shè)計(jì)風(fēng)格保持一致，從而營(yíng)造出專業(yè)、和諧且易于使用的界面環(huán)境。

設(shè)計(jì)中視覺(jué)上保持統(tǒng)一包括圖標(biāo)的大小、形狀、色彩以及設(shè)計(jì)風(fēng)格等多個(gè)方面，能夠增強(qiáng)用戶的認(rèn)知連貫性，降低學(xué)習(xí)成本，提升使用效率。相反，如果圖標(biāo)風(fēng)格混雜，不僅會(huì)讓界面顯得雜亂無(wú)章，還會(huì)給用戶帶來(lái)困惑和不安，進(jìn)而影響其對(duì)產(chǎn)品專業(yè)性和安全性的信任。

按鈕

按鈕設(shè)計(jì)應(yīng)統(tǒng)一于項(xiàng)目風(fēng)格，無(wú)論是圓形、矩形、圓角矩形還是特定形狀，保持一致性是關(guān)鍵。統(tǒng)一的按鈕樣式不僅彰顯專業(yè)性，還能增強(qiáng)用戶信任，確保體驗(yàn)連貫。過(guò)多變化的按鈕樣式會(huì)擾亂用戶界面，降低操作直觀性，甚至讓用戶誤以為自己已離開應(yīng)用環(huán)境。因此，精心設(shè)計(jì)的統(tǒng)一按鈕樣式對(duì)提升用戶體驗(yàn)至關(guān)重要。

排版

設(shè)計(jì)中的排版一致性對(duì)于構(gòu)建高效、用戶友好的界面至關(guān)重要。一致的排版不僅能夠讓用戶快速適應(yīng)和理解界面的整體結(jié)構(gòu)，大幅降低學(xué)習(xí)成本，還能在用戶心中激發(fā)強(qiáng)烈的歸屬感和安全感。這種熟悉感使得內(nèi)容更加易讀，用戶能夠自然地依照既定的視覺(jué)動(dòng)線流暢地瀏覽頁(yè)面，迅速定位并獲取所需信息，從而顯著提升信息獲取的效率。因此，在設(shè)計(jì)過(guò)程中，注重并維護(hù)排版的一致性，是提升用戶體驗(yàn)和界面有效性的重要策略之一。

操作流程的一致性

標(biāo)準(zhǔn)化流程

：確保用戶在執(zhí)行相似任務(wù)時(shí)，如購(gòu)買商品、搜索信息或提交表單等，能夠遵循相同的操作流程。這有助于用戶快速適應(yīng)并高效完成任務(wù)。

邏輯清晰

：操作流程的每一步都應(yīng)符合用戶的認(rèn)知習(xí)慣和行為邏輯，避免讓用戶感到困惑或不知所措。

交互元素的一致性

按鈕和控件

：確保按鈕、輸入框、下拉菜單等交互元素的樣式、位置和操作方式在整個(gè)應(yīng)用或網(wǎng)站中保持一致。例如，所有按鈕都應(yīng)具有相同的視覺(jué)風(fēng)格和觸發(fā)機(jī)制。

導(dǎo)航和菜單

：導(dǎo)航欄和菜單的設(shè)計(jì)也應(yīng)保持一致，使用戶能夠輕松地在不同頁(yè)面或功能之間切換。

反饋機(jī)制的一致性

操作反饋

：當(dāng)用戶執(zhí)行某個(gè)操作時(shí)，應(yīng)用或網(wǎng)站應(yīng)提供一致且及時(shí)的反饋，如加載動(dòng)畫、成功提示或錯(cuò)誤消息等。這有助于用戶了解操作結(jié)果并采取相應(yīng)的行動(dòng)。

狀態(tài)提示

：對(duì)于長(zhǎng)時(shí)間運(yùn)行的操作或需要用戶等待的場(chǎng)景，應(yīng)提供明確的狀態(tài)提示（如進(jìn)度條），以減輕用戶的不確定感和焦慮感。

在任何維度上，一致性不應(yīng)成為設(shè)計(jì)的唯一導(dǎo)向。設(shè)計(jì)，這一融合了藝術(shù)與科學(xué)的復(fù)雜領(lǐng)域，要求我們?cè)谟脩趔w驗(yàn)的細(xì)膩雕琢、功能需求的精準(zhǔn)滿足、美學(xué)價(jià)值的深刻體現(xiàn)及技術(shù)可行性的嚴(yán)格考量間游走。

“一致性”作為設(shè)計(jì)策略，其核心使命在于優(yōu)化用戶路徑，降低認(rèn)知門檻，確保用戶在多元界面中穿梭時(shí)仍能感受到連貫與和諧。當(dāng)我們?cè)谂c設(shè)計(jì)團(tuán)隊(duì)（包括工程師、產(chǎn)品經(jīng)理等）溝通時(shí)，僅僅提及“一致性”可能并不足以說(shuō)明其必要性和價(jià)值。我們需要更深入地闡述為什么需要保持一致性，以及它如何具體幫助減少用戶困惑、提高用戶滿意度和忠誠(chéng)度。

同時(shí)，我們應(yīng)清醒認(rèn)識(shí)到，“一致性”并不是萬(wàn)能的。在某些情況下，為了追求極致的用戶體驗(yàn)或解決特定的設(shè)計(jì)問(wèn)題，可能需要打破傳統(tǒng)的一致性規(guī)則。因此，設(shè)計(jì)師需要在保持一致性和創(chuàng)新之間找到平衡點(diǎn)，根據(jù)具體情況靈活調(diào)整設(shè)計(jì)方案。

實(shí)際落地執(zhí)行時(shí)，要根據(jù)產(chǎn)品定位、用戶場(chǎng)景，結(jié)合業(yè)務(wù)功能來(lái)確定設(shè)計(jì)方案，不能為了一致而一致。

當(dāng)我們遇到一致性問(wèn)題時(shí)，還是需要從以下3個(gè)方面深入思考，做出準(zhǔn)確合理的設(shè)計(jì)決策。

真實(shí)項(xiàng)目

在SaaS產(chǎn)品設(shè)計(jì)中，特別是面向B/G端（企業(yè)用戶）時(shí)，滿足不同用戶角色（如普通用戶與高權(quán)限領(lǐng)導(dǎo)）的需求是至關(guān)重要的。

管理端布局設(shè)計(jì)

普通簡(jiǎn)潔明了

：為普通用戶設(shè)計(jì)的管理界面應(yīng)簡(jiǎn)潔直觀，聚焦于日常操作，如數(shù)據(jù)查看、統(tǒng)計(jì)和下載。

功能分區(qū)

：通過(guò)清晰的導(dǎo)航欄或側(cè)邊欄將功能區(qū)域劃分開，如“數(shù)據(jù)概覽”、“報(bào)表下載”、“任務(wù)管理”等，便于用戶快速定位所需功能。

操作便捷

：確保常用操作（如搜索、篩選、排序）易于觸達(dá)，減少用戶點(diǎn)擊次數(shù)和頁(yè)面跳轉(zhuǎn)。

首頁(yè)版心定寬設(shè)計(jì)

固定寬度

：為首頁(yè)設(shè)定一個(gè)合適的固定寬度（如1200px、1440px等），以保證內(nèi)容在大多數(shù)屏幕上都能保持一致的閱讀體驗(yàn)。

信息模塊化

：將首頁(yè)內(nèi)容劃分為多個(gè)卡片，每個(gè)卡片承載一個(gè)獨(dú)立的信息單元（如數(shù)據(jù)報(bào)表、通知公告、項(xiàng)目進(jìn)展等）。

視覺(jué)層次

：通過(guò)顏色、大小、陰影等設(shè)計(jì)元素區(qū)分卡片的重要性，引導(dǎo)用戶視線，提高信息獲取效率。

交互性

：為卡片添加交互元素，如點(diǎn)擊展開、滑動(dòng)查看更多等，增加用戶參與度和頁(yè)面活躍度。

位置差異性分析

根據(jù)「認(rèn)知負(fù)荷>視覺(jué)負(fù)荷>動(dòng)作負(fù)荷」理論，在頁(yè)面中我們首先要讓用戶能夠找到按鈕，然后完成操作。

相對(duì)于彈窗，頁(yè)面的空間更大，邊界感偏弱，用戶的視覺(jué)重心更容易停留在左側(cè)表單內(nèi)容區(qū)域。所以按鈕應(yīng)該緊隨搜索條件，便于用戶快速發(fā)現(xiàn)按鈕。

區(qū)域用戶已經(jīng)形成下意識(shí)操作習(xí)慣,雖然區(qū)別于規(guī)范,只能打破,遵循客戶需求

一致性是規(guī)則

“一致性”作為規(guī)則或手段，服務(wù)于提升用戶體驗(yàn)的原則。規(guī)則與原則一致時(shí)，促進(jìn)業(yè)務(wù)共識(shí)與用戶價(jià)值；沖突時(shí)，原則優(yōu)先。用戶體驗(yàn)原則指導(dǎo)下的一致性，要超越表面控件統(tǒng)一，更在于產(chǎn)品決策與價(jià)值取向的一致。必要時(shí)，為更好的用戶體驗(yàn)，可在規(guī)則上讓步以實(shí)現(xiàn)原則統(tǒng)一。打破規(guī)則需慎重權(quán)衡，確保用戶便利足以彌補(bǔ)理解成本，需長(zhǎng)期全局考量。規(guī)則非僵化教條，而是引導(dǎo)我們謹(jǐn)慎創(chuàng)新的框架。

一致性的底線

無(wú)論從哪個(gè)角度，一致性存在的必要性都是毋庸置疑的。

對(duì)于關(guān)鍵的設(shè)計(jì)元素，如專有名詞和顏色體系，保持一致性至關(guān)重要。這不僅有助于維護(hù)品牌形象，還能減少用戶的困惑。

特定設(shè)計(jì)語(yǔ)言在特定場(chǎng)景下的變體應(yīng)用，雖然可能帶來(lái)一定的視覺(jué)新鮮感或針對(duì)性優(yōu)化，但往往需要謹(jǐn)慎評(píng)估其潛在風(fēng)險(xiǎn)。一旦變體打破了整體設(shè)計(jì)的一致性，可能會(huì)破壞用戶對(duì)品牌的熟悉感和信任感，甚至引發(fā)誤解。因此，在追求設(shè)計(jì)創(chuàng)新的同時(shí)，必須確保這種創(chuàng)新是基于一致性的原則之上，以維持品牌的整體性和用戶的良好體驗(yàn)。

擁抱復(fù)雜性

一致性確實(shí)不應(yīng)成為設(shè)計(jì)師的避風(fēng)港或限制創(chuàng)新的枷鎖，而應(yīng)是基于對(duì)業(yè)務(wù)深刻理解和多樣化設(shè)計(jì)能力之上的價(jià)值選擇。設(shè)計(jì)師的核心任務(wù)始終是滿足用戶的多樣化需求和偏好，這需要他們細(xì)致入微地觀察、理解并解決每個(gè)用戶的獨(dú)特問(wèn)題。

在追求一致性的同時(shí)，設(shè)計(jì)師應(yīng)保持“第一性思考”的能力，即回歸問(wèn)題的本質(zhì)，從用戶需求出發(fā)進(jìn)行創(chuàng)新設(shè)計(jì)。多樣性頁(yè)面的產(chǎn)出，不僅體現(xiàn)了設(shè)計(jì)師的創(chuàng)造力和靈活性，也是提升用戶體驗(yàn)、增強(qiáng)產(chǎn)品吸引力的關(guān)鍵。

一致性與創(chuàng)新設(shè)計(jì)并非相互排斥，而是相輔相成的關(guān)系。真正的一致性不應(yīng)導(dǎo)致單調(diào)或拒絕創(chuàng)新，而應(yīng)是在遵循品牌或產(chǎn)品核心價(jià)值的前提下，鼓勵(lì)設(shè)計(jì)師在細(xì)節(jié)和體驗(yàn)上不斷探索和突破。當(dāng)設(shè)計(jì)師感到被既定規(guī)則束縛時(shí)，應(yīng)勇于質(zhì)疑并重新評(píng)估當(dāng)前的規(guī)范，確保所謂的“一致性”不是刻板的偽命題，而是真正符合用戶需求和品牌發(fā)展的價(jià)值導(dǎo)向。

因此，設(shè)計(jì)師應(yīng)時(shí)刻保持開放的心態(tài)和敏銳的洞察力，不斷探索和嘗試新的設(shè)計(jì)方法和理念，以更加靈活和創(chuàng)新的方式實(shí)現(xiàn)一致性與用戶需求的完美融合。

重要的設(shè)計(jì)原則

「一致性」作為設(shè)計(jì)領(lǐng)域中的一項(xiàng)基礎(chǔ)性原則，其重要性不言而喻。它不僅為設(shè)計(jì)過(guò)程提供了穩(wěn)固的基石，還顯著促進(jìn)了開發(fā)效率與產(chǎn)品體驗(yàn)的全面升級(jí)。在設(shè)計(jì)實(shí)踐中，一致性確保了界面元素的統(tǒng)一性和連貫性，使得用戶能夠迅速熟悉并掌握產(chǎn)品的使用方式，降低了學(xué)習(xí)成本，增強(qiáng)了操作的直觀性和便捷性。

靈活變通使用

一致性原則并非一成不變的強(qiáng)制規(guī)定，而是需要根據(jù)產(chǎn)品的具體定位和市場(chǎng)環(huán)境進(jìn)行靈活變通的應(yīng)用。不同的產(chǎn)品可能面向不同的用戶群體，擁有獨(dú)特的品牌調(diào)性和功能需求，因此在追求一致性的同時(shí)，也需充分考慮這些因素，確保設(shè)計(jì)既符合品牌特色，又能滿足用戶的實(shí)際需求。

提升用戶體驗(yàn)是價(jià)值所在

一致性的真正價(jià)值在于其能夠顯著提升用戶體驗(yàn)。通過(guò)遵循用戶的認(rèn)知和習(xí)慣，設(shè)計(jì)師能夠創(chuàng)造出更加自然、流暢的操作流程，使用戶在享受產(chǎn)品功能的同時(shí)，也能感受到品牌所傳遞的舒適與和諧。因此，在追求設(shè)計(jì)一致性的過(guò)程中，我們始終應(yīng)以人為本，將用戶的體驗(yàn)和感受放在首位。建設(shè)有兼容性和長(zhǎng)期價(jià)值的的一致性框架，在一致性中做到有用戶價(jià)值的設(shè)計(jì)，是設(shè)計(jì)師應(yīng)該不斷探索的命題。

作者：cheny米魚
鏈接：https://www.zcool.com.cn/article/ZMTYzNTAzNg==.html
來(lái)源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

評(píng)論(0) 瀏覽(81)

172024-10

打動(dòng)人心的直覺(jué)設(shè)計(jì)

ui設(shè)計(jì)分享達(dá)人

前言

之所以對(duì)“直覺(jué)設(shè)計(jì)”產(chǎn)生興趣還要源于我們每次的設(shè)計(jì)評(píng)審，在跟其他設(shè)計(jì)師還有我們的業(yè)務(wù)方溝通時(shí)，大家常常會(huì)問(wèn)到的且令人印象深刻的問(wèn)題是：

“用戶怎么知道點(diǎn)哪里？”、“這符合用戶直覺(jué)嗎？”

類似的靈魂拷問(wèn)涉及到用戶使用工具產(chǎn)品行為流程的每一步操作。作為設(shè)計(jì)師大家有時(shí)也會(huì)心生質(zhì)疑，“這么明顯用戶注意不到嗎？這么簡(jiǎn)單用戶不可能不會(huì)操作吧...”。

但是隨著我們的”新手體驗(yàn)官活動(dòng)“的逐步進(jìn)行，當(dāng)親自站在用戶面前觀察用戶是如何操作和理解工具時(shí)，我們漸漸意識(shí)到小白用戶

接觸-認(rèn)知-使用工具

的每一環(huán)都是至關(guān)重要的，即便是一個(gè)交互細(xì)節(jié)的設(shè)計(jì)都有可能帶來(lái)認(rèn)知和操作層面受阻，從而勸退用戶。

因此，我們想去了解什么樣的設(shè)計(jì)是符合用戶直覺(jué)的，是易用的，同時(shí)也想去了解主流3D建模軟件的核心建模邏輯（SU、Revit為代表）--于是開始了“直覺(jué)設(shè)計(jì)”的研究以及“建模課程”的學(xué)習(xí)。

1、什么是直覺(jué)設(shè)計(jì)？

首先來(lái)看什么是直覺(jué)設(shè)計(jì)，直覺(jué)設(shè)計(jì)是指用戶無(wú)需進(jìn)行有意識(shí)的思考就可以立即理解并知道如何去使用產(chǎn)品。國(guó)外有不少的用戶研究機(jī)構(gòu)也專門定義過(guò)直覺(jué)設(shè)計(jì)：

“在特定任務(wù)的背景下，技術(shù)系統(tǒng)可以直觀地使用，而特定用戶能夠有效地交互，而不是有意識(shí)地使用先前的知識(shí)。”– 用戶界面的直觀使用 (IUUI) 研究小組。一個(gè)由跨學(xué)科研究人員組成的團(tuán)隊(duì)，致力于探索如何定義直觀的使用和界面。

為了方便大家更好的理解直覺(jué)設(shè)計(jì)，我們先來(lái)看幾個(gè)例子：

案例1-玩具收納：小朋友在玩完玩具以后，把玩具擺的到處都是，如果發(fā)號(hào)施令告訴小朋友“去把玩具收拾起來(lái)”，小朋友通常不會(huì)去收拾。如果將收納設(shè)計(jì)成為一種小游戲，小朋友會(huì)自然而然的參與其中并且會(huì)覺(jué)得非常有趣。

案例2-公共環(huán)境衛(wèi)生：保持小便池的清潔，張貼告示語(yǔ)“注意保持清潔”大多是沒(méi)有用的。荷蘭的設(shè)計(jì)師在公共的男士小便池里設(shè)計(jì)了一個(gè)“蒼蠅”，利用人們的嫌惡心理會(huì)發(fā)現(xiàn)小便時(shí)會(huì)不由自主的對(duì)準(zhǔn)中心的位置，從而減少尿液四濺，維護(hù)公共環(huán)境衛(wèi)生。

案例3-公共設(shè)施：設(shè)有傳感器和揚(yáng)聲器的臺(tái)階，人們只要踩上去就能聽到音樂(lè)聲，從而達(dá)到鼓勵(lì)人們爬樓梯的目標(biāo)。

案例4-工業(yè)產(chǎn)品設(shè)計(jì)：很多耳熟能詳?shù)墓I(yè)產(chǎn)品中也運(yùn)用了直覺(jué)設(shè)計(jì)，例如深澤直人的CD播放器，Apple的Vision OS系統(tǒng)等等。

案例5-游戲設(shè)計(jì)：游戲中非常多的運(yùn)用了直覺(jué)設(shè)計(jì)，比如超級(jí)馬里奧，塞爾達(dá)，想必大家都深有感受。

通過(guò)上述案例我們發(fā)現(xiàn)其實(shí)直覺(jué)設(shè)計(jì)傳達(dá)出來(lái)是信息包含兩方面：用戶看到就能夠理解是什么，且能夠不由自主地產(chǎn)生行動(dòng)。

看到這里，大家可能會(huì)好奇為什么會(huì)產(chǎn)生這種”直覺(jué)設(shè)計(jì)“？接下來(lái)讓我們一起來(lái)看看直覺(jué)設(shè)計(jì)是如何產(chǎn)生的。

2、直覺(jué)設(shè)計(jì)如何產(chǎn)生？

人的直覺(jué)設(shè)計(jì)是怎么來(lái)的？是天生的嗎？帶著這樣的疑惑，我們閱讀了相關(guān)書籍和文章。

先天視覺(jué)和經(jīng)驗(yàn)直覺(jué)

先天直覺(jué)，也可以說(shuō)是”本我“，是最原始的”心理現(xiàn)實(shí)“，在個(gè)體從外部世界獲得經(jīng)驗(yàn)之前就存在的內(nèi)部世界，不需要經(jīng)過(guò)學(xué)習(xí)或訓(xùn)練。比如嬰兒時(shí)期的特征，希望立刻得到滿足、躲避痛苦、強(qiáng)大的求生意愿等。

經(jīng)驗(yàn)直覺(jué)，巴普洛夫的實(shí)驗(yàn)想必大家都知道。有機(jī)體能夠把已有的經(jīng)驗(yàn)遷移到新的學(xué)習(xí)環(huán)境中去，從而擴(kuò)大學(xué)習(xí)范圍。

先天直覺(jué)一般對(duì)應(yīng)于人類的第一信號(hào)系統(tǒng)，是建立在人的直接感覺(jué)上的，通過(guò)人的感覺(jué)（視覺(jué)、聽覺(jué)、觸覺(jué)等）而進(jìn)行的一種思維活動(dòng)；經(jīng)驗(yàn)直覺(jué)（邏輯性直覺(jué)直覺(jué)）思維雖然利用了人類的感性認(rèn)識(shí)（感覺(jué)、知覺(jué)、表象等）形式，但它絕不是僅僅停留在這一步上，而是超越了邏輯思維形式達(dá)到了更高一個(gè)層次上的思維。

從表面上看，邏輯性直覺(jué)的結(jié)果是以直觀的形式表現(xiàn)出來(lái)的，實(shí)際上它已經(jīng)在頭腦中進(jìn)行了邏輯程序的高度壓縮，迅速地越過(guò)了“理性認(rèn)識(shí)階段”，是簡(jiǎn)縮了整個(gè)邏輯思維過(guò)程的一種思維形式。

所以，邏輯性直覺(jué)既源于感性認(rèn)識(shí)，又高于感性認(rèn)識(shí)，是一種常常能在極短的時(shí)間內(nèi)完成，并能夠?qū)?wèn)題迅速作出回答的一種無(wú)意識(shí)的、躍進(jìn)式的直覺(jué)形式。

構(gòu)建直覺(jué)，現(xiàn)有研究指出，分析加工和直覺(jué)加工兩者可能處于不斷的相互轉(zhuǎn)換之中。一方面，分析加工可以通過(guò)熟練化形成經(jīng)驗(yàn)圖式，從而減少認(rèn)知資源的消耗，并由此轉(zhuǎn)化為直覺(jué)加工；另一方面，當(dāng)直覺(jué)加工無(wú)法通過(guò)已有經(jīng)驗(yàn)解決新的問(wèn)題情境時(shí)，又需要調(diào)動(dòng)更多的認(rèn)知資源并轉(zhuǎn)向分析加工，直到形成新的經(jīng)驗(yàn)圖式。

先天直覺(jué)大家都容易理解，接下來(lái)我們重點(diǎn)看一下經(jīng)驗(yàn)直覺(jué)是如何產(chǎn)生的？

經(jīng)驗(yàn)直覺(jué)的產(chǎn)生與人生存的環(huán)境密切相關(guān)，所以這里包含兩個(gè)關(guān)鍵點(diǎn)：物理世界（環(huán)境）和生活環(huán)境。

來(lái)自物理環(huán)境的經(jīng)驗(yàn)

物理環(huán)境主要包括我們生存的自然環(huán)境，以及我們與物理環(huán)境的互動(dòng)所形成的感官運(yùn)動(dòng)。人類在嬰兒時(shí)期就開始體驗(yàn)和實(shí)驗(yàn)物理環(huán)境。這種體驗(yàn)建立在我們第一次拿著一個(gè)物體、第一次把它扔到地板上、第一次學(xué)會(huì)爬到我們最喜歡的玩具等時(shí)學(xué)到的基本感覺(jué)運(yùn)動(dòng)技能上。我們對(duì)物理世界的體驗(yàn)它已成為日常生活的一部分。經(jīng)過(guò)物理環(huán)境互動(dòng)所形成的直覺(jué)是跨越國(guó)界、且不會(huì)被遺忘的。

來(lái)自文化環(huán)境的經(jīng)驗(yàn)

通俗的講指社會(huì)文化環(huán)境。它包括人類通過(guò)其獲得的知識(shí)和技術(shù)開發(fā)的所有物質(zhì)文化元素。例如，房屋、村莊、城鎮(zhèn)、公路和鐵路網(wǎng)絡(luò)、交通方式、工業(yè)單位、田野、醫(yī)院、體育場(chǎng)館、娛樂(lè)設(shè)施、市場(chǎng)、港口以及日常和特殊用途的物品。除此之外還包括價(jià)值觀念、道德信仰、語(yǔ)言、符號(hào)、審美觀念、風(fēng)俗習(xí)慣等各種規(guī)范。

例如播放圖標(biāo)“?”是許多文化中的人們?cè)谀贻p時(shí)學(xué)習(xí)符號(hào)的一個(gè)很好的例子。在任何可以使用媒體播放器的文化中，人們都知道 ? 圖標(biāo)的含義。它的直觀性幾乎與物理世界中的對(duì)象行為一致。

因此，在媒體播放器中，人們理所當(dāng)然的希望可以延續(xù)“?”符號(hào)的含義。來(lái)自文化環(huán)境的知識(shí)也可以變得很直觀，但是由于沒(méi)有來(lái)自物理世界的持續(xù)提醒之后，很容易被遺忘。

因此在提供直覺(jué)設(shè)計(jì)時(shí)，應(yīng)盡量符合用戶從物理世界中獲得的經(jīng)驗(yàn)與技能。但如果我們的用戶群體是具有相同文化背景下的人群，符合文化環(huán)境的知識(shí)與經(jīng)驗(yàn)也可以作為直觀設(shè)計(jì)的決策依據(jù)。

3、為什么要符合直覺(jué)設(shè)計(jì)？

給用戶留下良好的第一印象，助力產(chǎn)品贏得并且留下用戶。

當(dāng)我們開始使用某款產(chǎn)品時(shí)，用戶往往在幾秒內(nèi)就會(huì)產(chǎn)生第一印象并且往往會(huì)保持不變，少則幾分鐘多則十幾分鐘用戶就可感受到產(chǎn)品的價(jià)值。

渥太華卡雷頓大學(xué)的Gitte·Lindgaard和她的研究小組發(fā)現(xiàn)：人類對(duì)事物的初始印象在50毫秒內(nèi)就會(huì)形成。研究小組準(zhǔn)備了一批要么極易入眼要么混亂不堪的網(wǎng)頁(yè)，讓一批志愿者在快速變換中投票。雖然這些網(wǎng)頁(yè)以50毫秒每張的速度一閃而過(guò)，但是研究發(fā)現(xiàn)他們的評(píng)價(jià)與長(zhǎng)時(shí)間觀察后的結(jié)果基本無(wú)異。

這就說(shuō)明了用戶的第一印象非常明確且重要，幫助用戶判斷出這是否是一個(gè)設(shè)計(jì)合理的網(wǎng)站。如果用戶停留時(shí)間再長(zhǎng)一點(diǎn)，那么用戶足以判斷出網(wǎng)站上的信息是否是滿足自己需要的信息，從而影響用戶是否繼續(xù)停留下來(lái)去使用該網(wǎng)站。

更容易讓用戶達(dá)到心流狀態(tài)、沉浸式的使用產(chǎn)品，并且持續(xù)吸引用戶使用產(chǎn)品。

符合用戶直覺(jué)的、熟悉的操作模式，作為用戶直觀使用的基礎(chǔ)，更容易產(chǎn)生積極的審美評(píng)價(jià)。相反，如果用戶的認(rèn)知流暢性受阻，則不太會(huì)產(chǎn)生正面積極的評(píng)價(jià)。簡(jiǎn)潔有力的設(shè)計(jì)會(huì)促使用戶再次使用產(chǎn)品，是保持產(chǎn)品吸引力的最佳方式。

4、如何使設(shè)計(jì)符合用戶直覺(jué)？

因?yàn)楣ぷ髦猩婕暗?D建模軟件的設(shè)計(jì)，所以這部分將結(jié)合3D建模軟件來(lái)探討。

如果您接觸過(guò)3D建模軟件，一定用過(guò)SU、Rhino吧，我們?cè)谑褂煤蟛痪茫湍芮逦母惺艿剿鼈兊暮诵倪壿?，比如SU的推拉，Rhino的曲面建模等，進(jìn)而能夠舉一反三的學(xué)會(huì)相關(guān)功能，使軟件的學(xué)習(xí)變得更簡(jiǎn)單更直覺(jué)。那么怎樣的功能設(shè)計(jì)才能打造出軟件的核心邏輯，讓其在使用時(shí)更加符合用戶的直覺(jué)？

為了得到以上問(wèn)題的答案，我們進(jìn)行了SU和Revit這兩款建筑領(lǐng)域主流軟件的使用，感受兩款軟件在直覺(jué)設(shè)計(jì)方面的表現(xiàn)，進(jìn)而找到了一些設(shè)計(jì)原則指導(dǎo)我們?cè)趯?shí)際業(yè)務(wù)中應(yīng)用。

充分了解你的用戶

每個(gè)人在自己生活的世界里，都會(huì)形成自己的一些認(rèn)知，這個(gè)前面也已經(jīng)介紹過(guò)。所以要充分了解用戶的知識(shí)、技能、經(jīng)驗(yàn)，盡可能減少用戶當(dāng)前具備知識(shí)與完成目標(biāo)所需具備的知識(shí)之間的Gap。當(dāng)用戶已具備的知識(shí)和完成目標(biāo)需要的知識(shí)之間的差距越小，越符合用戶的直覺(jué)，越容易實(shí)現(xiàn)目標(biāo)。

SU和Revit都是充分了解自己的用戶，基于用戶群體的知識(shí)、技能、經(jīng)驗(yàn)等特點(diǎn)，去打造自己軟件的核心邏輯，符合目標(biāo)用戶群體的使用直覺(jué)。

▽

SU的Slogan 是“3D for Everyone“，人人可用。他的用戶群體非常廣泛，所以它是一個(gè)業(yè)務(wù)屬性較弱的工具，界面設(shè)計(jì)和操作使用上更簡(jiǎn)單，普適性和靈活性更強(qiáng)。使用面作為基本單元建模，推拉面成體，推推拉拉就可以快速完成建模。對(duì)于小白來(lái)說(shuō)很容易上手。

Revit

▽

Revit的用戶主要是專業(yè)的建筑師，場(chǎng)景聚焦在建筑相關(guān)領(lǐng)域，所以它是一個(gè)業(yè)務(wù)屬性較強(qiáng)的工具，將更多的業(yè)務(wù)場(chǎng)景包含在里面。比如標(biāo)高、工作平面以及模塊化的構(gòu)件等，這樣的設(shè)定對(duì)于建筑背景的用戶來(lái)說(shuō)，可以更符合他們的已有認(rèn)知。

將從物理世界和文化環(huán)

前面反復(fù)提到過(guò)過(guò)，用戶總是利用她在物理和文化環(huán)境中的經(jīng)驗(yàn)來(lái)了解她通過(guò)界面可以采取哪些行動(dòng)。因此我們需要熟知用戶已有的這些經(jīng)驗(yàn)，并考慮到設(shè)計(jì)中。

通過(guò)聯(lián)想或類比，將物理世界的經(jīng)驗(yàn)運(yùn)用到數(shù)字產(chǎn)品設(shè)計(jì)中，使得全新的事物變得熟悉。

▽

SU的圖標(biāo)非常直觀好懂，比如畫筆、橡皮擦、油漆桶、量尺、放大鏡、材質(zhì)刷、垃圾桶等等，圖標(biāo)的語(yǔ)意和其在物理世界的功能是相符的，哪怕是第一次接觸建模軟件的人，只看圖標(biāo)也能大概猜出對(duì)應(yīng)的功能。

Revit

▽

Revit將物理世界中房子映射到設(shè)計(jì)中。比如像墻、門、窗、柱、屋頂?shù)?，這是作為一個(gè)房子基本組成結(jié)構(gòu)，對(duì)于建筑師來(lái)言，非常熟悉。所以在軟件設(shè)計(jì)中，功能也是基于這種具象的構(gòu)件分類的，在用戶使用之前，內(nèi)心已經(jīng)有了房子的認(rèn)知，從而也能在產(chǎn)品中找到對(duì)應(yīng)的功能，理解成本很低。

結(jié)合用戶在已有的文化環(huán)境中獲得的認(rèn)知與經(jīng)驗(yàn)：比如在類似產(chǎn)品中或你的產(chǎn)品所教給他的一些知識(shí)、經(jīng)驗(yàn)，并保持這些經(jīng)驗(yàn)的一致性。

▽

很好的匹配用戶已經(jīng)存在的認(rèn)知。提及SU就會(huì)想到它的推拉交互，推拉面成體。一方面它底層的點(diǎn)線面邏輯是我們學(xué)習(xí)數(shù)學(xué)或繪畫最基礎(chǔ)的知識(shí)，幾乎人人都知道；另一方面推拉的操作也是和我們已有的推敲形體的過(guò)程體驗(yàn)是一致的，我們?cè)诶L制草圖時(shí)，會(huì)在紙上勾勾畫畫，涂涂抹抹，這跟在SU上推推拉拉有異曲同工之妙，我們使在用它時(shí)能夠享受手繪一般的樂(lè)趣，很難忘記這個(gè)操作。

Revit

▽

同為Autodesk公司產(chǎn)品，Revit的用戶與Autocad有著大量的重疊，因此在交互上也延用了不少CAD的固有邏輯，將用戶在CAD獲得的認(rèn)知與經(jīng)驗(yàn)沿用在這里。與AutoCAD一樣，Revit快捷鍵

也

是該命令英文單詞的第1個(gè)或前面2個(gè)字母，這使得用戶無(wú)需再學(xué)習(xí)。

以及為了讓用戶切換軟件成本最小，Revit中還支持一個(gè)指令可以設(shè)置多個(gè)快捷鍵，這樣可以兼容喜歡自定義快捷鍵的高階用戶的習(xí)慣。例如在AutoCAD里習(xí)慣用Ctrl+1 呼出屬性面板，而如果按 Revit 快捷鍵的邏輯則應(yīng)該是"屬性"英文取用 PP，對(duì)于已熟悉AutoCAD操作的用戶來(lái)說(shuō)，這么高頻的指令改變會(huì)造成極大的不適應(yīng)，默認(rèn)兼容多個(gè)快捷鍵就是非常優(yōu)雅的解法。

用戶認(rèn)知和行為要足夠簡(jiǎn)單

關(guān)于1+1=？，大家看到后會(huì)自然而然的想到答案；28×4=？，稍加思索也能給出答案；那么3927÷23=？，看到這個(gè)問(wèn)題，可能幾乎沒(méi)有人想要解開了。有些問(wèn)題無(wú)意識(shí)的解開了，有些問(wèn)題看到就想放棄解答。由此可見(jiàn)改變?nèi)藗冃袨榉绞降耐ǔＪ悄芊褡銐蚝?jiǎn)單和容易，當(dāng)眼前的問(wèn)題復(fù)雜時(shí)，人們不會(huì)試圖解決它。

▽

吸附非常的自然。當(dāng)我想移動(dòng)到某個(gè)位置的時(shí)候，很自然將鼠標(biāo)靠近目標(biāo)對(duì)象，就會(huì)幫我精準(zhǔn)的吸附到對(duì)應(yīng)的位置

補(bǔ)面非常簡(jiǎn)單。當(dāng)形體發(fā)生破面的時(shí)候，自然的想要繪制線去補(bǔ)全，當(dāng)我沿著要補(bǔ)全的路徑繪制兩個(gè)點(diǎn)的時(shí)候，整個(gè)面被補(bǔ)好了。

5、實(shí)戰(zhàn)：應(yīng)用最佳設(shè)計(jì)原則

將我們?cè)诮＼浖袑W(xué)習(xí)到的有助于直覺(jué)設(shè)計(jì)的內(nèi)容進(jìn)行總結(jié)，得出幾條原則，并將這些設(shè)計(jì)原則應(yīng)用到實(shí)踐當(dāng)中，指導(dǎo)我們進(jìn)行設(shè)計(jì)。

心理學(xué)中也提到，人的大腦處理不同的信息時(shí)所消耗的腦力資源是不同的，他們的排序是認(rèn)知>視覺(jué)>行動(dòng)。用戶花費(fèi)的腦力資源要多于點(diǎn)擊按鈕或移動(dòng)鼠標(biāo)時(shí)（動(dòng)作負(fù)荷）。所以我們?cè)谠O(shè)計(jì)的時(shí)候，首先要從認(rèn)知上降低用戶的認(rèn)知負(fù)擔(dān)，其次在行為上確保操作絲滑順暢。

認(rèn)知上，降低認(rèn)知負(fù)擔(dān)

提升信息的識(shí)別性。

比如位置、信息分組的邏輯、顏色、比例等的使用等。作為別墅設(shè)計(jì)軟件，在進(jìn)行功能分類時(shí)，要以用戶使用的流程、場(chǎng)景，識(shí)別的效率等為依據(jù)進(jìn)行合理分組。

提高和用戶已有認(rèn)知的匹配。

作為別墅設(shè)計(jì)軟件，設(shè)計(jì)要與用戶已有的對(duì)別墅對(duì)房子的認(rèn)知相匹配。比如檐口線、浮雕、墻裙等構(gòu)件，人們?cè)诂F(xiàn)實(shí)中的房子中都會(huì)見(jiàn)到，只是不熟知這些叫法。因此我們采用建造一個(gè)真實(shí)小房子的做法，當(dāng)用戶點(diǎn)擊某個(gè)構(gòu)件，對(duì)應(yīng)的構(gòu)件就會(huì)在房子上高亮，用戶瞬間就會(huì)明白，哦原來(lái)是它，跟已有的認(rèn)知匹配上了，會(huì)有一種恍然大悟的感覺(jué)。同時(shí)也讓用戶大概知道這個(gè)構(gòu)件位于房子的哪個(gè)位置，對(duì)后續(xù)的操作有預(yù)期，知道要擺在哪個(gè)位置。

保持醫(yī)學(xué)認(rèn)知的一致性。

任何產(chǎn)品都很難做到匹配用戶已有的所有認(rèn)知，總會(huì)有一些內(nèi)容是需要重新學(xué)習(xí)獲得的，那么就要保證我們教給他的這些認(rèn)知邏輯始終一致，讓用戶能做到舉一反三。作為別墅設(shè)計(jì)軟件，用戶要完成一個(gè)完整房子的建造，需要用到20+的構(gòu)件模塊，我們希望用戶學(xué)會(huì)使用一個(gè)構(gòu)件之后，就不需要再學(xué)習(xí)，能觸類旁通的使用同類構(gòu)件。因此歸納出通用操作流程，找到相對(duì)統(tǒng)一的方式，串聯(lián)起我們用戶的心智。

行為上，讓操作絲滑順暢

提供場(chǎng)景化的行為設(shè)計(jì)，并將操作聚焦在手邊。

在我們的別墅設(shè)計(jì)軟件中，當(dāng)用戶要修改老虎窗和飄窗的時(shí)候，如果看到這個(gè)窗戶的樣式不是自己想要的，可能會(huì)想去繪制。按照我們現(xiàn)有的流程，用戶要先去左側(cè)面板找到自由繪窗入口，然后再選擇要在哪個(gè)面上繪制，操作流程是有點(diǎn)繞的。后面我們就想，用戶要修改這個(gè)窗子的時(shí)候，直覺(jué)上會(huì)去點(diǎn)擊它，那么在選中這個(gè)對(duì)象的時(shí)候，在手邊提供自由繪窗的入口，讓他能夠快速的綁定這個(gè)對(duì)象去繪制窗戶，操作上順暢了很多。

一次只聚焦做一件事情，減少其他干擾。

我們現(xiàn)在的大部分操作，都是是激活命令后，左側(cè)面板還在。觀察到很多新用戶在激活了功能后，不知道下一步需要干什么。因?yàn)榻缑嫔闲枰P(guān)注的事情太多了。所以，我們嘗試用戶在激活功能后，將當(dāng)前步驟中不需要他關(guān)注的面板隱藏，聚焦到他當(dāng)前需要做的事情上面去。

操作要足夠簡(jiǎn)單，簡(jiǎn)單到不需要有太多思考，是一個(gè)自然而然的行為。

以下介紹的是我們的照片還原功能，對(duì)于外墻漆、門窗等用戶，他們可以現(xiàn)場(chǎng)拍好房子照片，導(dǎo)入后基于照片還原出別墅方案，再進(jìn)行后續(xù)的外立面和門窗設(shè)計(jì)。最初，我們需要用戶手動(dòng)擺放兩組消逝線去確定透視角度、然后調(diào)整比例尺、在尺子上選取點(diǎn)劃分樓層、拖拽點(diǎn)調(diào)整邊界、通過(guò)輸入開間數(shù)量確定開間。整個(gè)過(guò)程比較復(fù)雜，也涉及很多專業(yè)的概念，用戶不知道該如何操作。

后面優(yōu)化后，我們結(jié)合算法識(shí)別出照片中的房子，默認(rèn)給一個(gè)box,用戶通過(guò)拖動(dòng)box上的角點(diǎn)和邊線去調(diào)整整個(gè)形體。因?yàn)橛脩魧?duì)box的概念是熟悉的，拖拽box去擬合背后的照片就變得容易的多。樓層和開間的劃分也采用這種切豆腐塊的方式，用戶一下一下去切就好。不用再去輸入數(shù)字，想象會(huì)是什么樣子。而比例尺只需要用戶輸入他想要的1樓的高度即可確定。優(yōu)化后，生成方案的轉(zhuǎn)化率提升了將近20%。

6、小結(jié)

直覺(jué)設(shè)計(jì)需要用戶看到產(chǎn)品時(shí)產(chǎn)生一種熟悉感，但是這種熟悉感判斷起來(lái)并不簡(jiǎn)單，其中一部分人熟悉并不代表所有人都熟悉。所以設(shè)計(jì)師需要充分了解他們的用戶，了解產(chǎn)品的市場(chǎng)，并充分獲取用戶熟悉內(nèi)容的信息才有助于作出符合直覺(jué)設(shè)計(jì)的決策。

做出符合直覺(jué)的設(shè)計(jì)是困難的，需要充分考慮用戶在物理世界和文化環(huán)境中獲得的知識(shí)和經(jīng)驗(yàn)，并將其應(yīng)用到具體的設(shè)計(jì)實(shí)踐中，也就是用戶的心智模型和產(chǎn)品概念模型達(dá)到基本吻合甚至去塑造與產(chǎn)品概念模型一致的用戶心智模型。

蘋果公司創(chuàng)始人兼前首席執(zhí)行官史蒂夫·喬布斯解釋說(shuō)：“我們?cè)O(shè)計(jì)中最重要的是，必須讓事情直觀明顯。

建議每一位設(shè)計(jì)師同學(xué)也多去感受和認(rèn)識(shí)自己的知道，尤其是首次打開某個(gè)網(wǎng)站時(shí)，要更加關(guān)注自己的視覺(jué)動(dòng)線和心理感受、無(wú)意識(shí)產(chǎn)生的操作行為等。同時(shí)也不要讓競(jìng)品變成你的直覺(jué)，始終去思索有沒(méi)有體驗(yàn)更加友好、創(chuàng)新的交互方式。

當(dāng)然，連續(xù)的直覺(jué)操作也可能會(huì)讓用戶覺(jué)得疲倦，可以適時(shí)考慮引入驚喜設(shè)計(jì)，為用戶打造Amazing的感受。

去認(rèn)識(shí)和感受自己的直覺(jué)
不要讓競(jìng)品的設(shè)計(jì)變成你的直覺(jué)
連續(xù)的直覺(jué)設(shè)計(jì)也可能也可能會(huì)給用戶帶來(lái)疲勞和厭倦，需要考慮在適當(dāng)?shù)臅r(shí)候給用戶進(jìn)喜設(shè)計(jì)。

本文在以下書籍和文章中予以引用，同時(shí)也推薦大家閱讀，想必大家對(duì)直覺(jué)設(shè)計(jì)會(huì)有更加深刻的認(rèn)知和理解。

注意：文中數(shù)據(jù)皆為演示數(shù)據(jù)，非業(yè)務(wù)真實(shí)數(shù)據(jù)

參考書籍：

《創(chuàng)意選擇》
《福格行為模型》
《一目了然-Web軟件顯性設(shè)計(jì)之路》
《峰值體驗(yàn)-影響用戶決策的關(guān)鍵時(shí)刻》
《任天堂的體驗(yàn)設(shè)計(jì)-創(chuàng)造不知不覺(jué)打動(dòng)人心的體驗(yàn)》
《玄機(jī)設(shè)計(jì)學(xué)：改變?nèi)藗冃袨榈膭?chuàng)意構(gòu)思法》

參考文章：

Intuitive UX design an approach beyond usability
https://uxdesign.cc/the-power-of-intuition-designing-beyond-usability-2899cb37f98a
https://www.interaction-design.org/literature/topics/intuitive-design
Intuitive Web Design: How to Make Your Website Intuitive to Use

作者：藍(lán)胖、瑤一

作者：群核科技MCUX
鏈接：https://www.zcool.com.cn/article/ZMTYyNTkwMA==.html
來(lái)源：站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

評(píng)論(0) 瀏覽(74)

« 1 ... 3 4 5 ... 11 »

日歷

鏈接

個(gè)人資料

藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.miumiuwan.com

首頁(yè)

分類

日歷

鏈接

個(gè)人資料

存檔