免费A级毛片无码A_99久久国产综合精品SWAG_亚洲国产天堂久久综合_夜夜爽一区二区三区精品 欧美日韩无套内射另类_婷婷五月俺也去人妻_日产精品久久久久久久性色_天堂大香蕉在线视频

首頁

跨平臺手機界面設(shè)計怎么做

藍藍設(shè)計的小編

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

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

手機界面設(shè)計

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

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

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

手機界面設(shè)計

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

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

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

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

手機界面設(shè)計

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

動效設(shè)計在手機界面設(shè)計中的作用

藍藍設(shè)計的小編

在如今這個數(shù)字化的時代,手機界面的設(shè)計越來越精致和人性化,其中動效設(shè)計扮演著不可或缺的角色。

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

藍藍設(shè)計的小編

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

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

移動app設(shè)計 (8).png

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

對于聽障者,可視化的提示和震動反饋則是關(guān)鍵。當有來電、短信或其他通知時,除了聲音提示,強烈的視覺閃爍和明顯的震動能夠確保他們及時察覺。

對于老年人和操作不靈活的人群,大字體和簡潔明了的界面布局能極大地提高可用性。增大圖標和按鈕的尺寸,減少操作步驟,提供清晰易懂的圖標和文字說明,都能讓他們更輕松地使用手機。

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

移動app設(shè)計 (6).png

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

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

一個成功的無障礙手機界面設(shè)計案例是某款專門為老年人開發(fā)的手機應(yīng)用。它的界面簡潔大方,字體超大,圖標清晰,并且提供了詳細的操作指南和語音提示。老年人可以輕松地撥打電話、發(fā)送短信、查看天氣等,極大地提高了他們的生活質(zhì)量。

移動APP設(shè)計 (3).png

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

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

藍藍設(shè)計的小編

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

打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略

鶴鶴

目錄
一、  什么是用戶體驗地圖?
二、  為什么使用用戶體驗地圖?
三、  什么情況使用用戶體驗地圖?
四、  用戶體驗地圖的組成?
五、  用戶體驗地圖的制作流程
六、  用戶體驗地圖案例展示
七、  用戶體驗地圖總結(jié)
一、  什么是用戶體驗地圖?
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
用戶體驗地圖(User Experience Map)是一種用于可視化展示用戶在與產(chǎn)品或服務(wù)互動過程中所經(jīng)歷的各個接觸點和體驗的工具。它幫助團隊深入了解用戶的行為、情感和痛點,從而優(yōu)化用戶體驗。
用戶體驗地圖(User Experience Map)是產(chǎn)品設(shè)計前期——用戶研究中很重要的一部分,視角化和圖表的方式,從用戶的角度來表現(xiàn)其和產(chǎn)品/組織/服務(wù)交互的過程,是連續(xù)的視覺時間和完整故事的多個互動點。
簡單來說,在用戶定義角色,搭配行為研究、表格調(diào)查和競品分析等數(shù)據(jù)下,構(gòu)思出這個角色在某個角色故事下要完成特定目標,以反應(yīng)用戶使用某個特定產(chǎn)品的真實特性,有助于我們評估現(xiàn)狀、找出用戶真正的痛點,與優(yōu)化整體的體驗流程(創(chuàng)造和諧的互動)。
二、  為什么使用用戶體驗地圖?
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
使用用戶體驗地圖(User Experience Map)在項目中有很多重要的原因,能夠給團隊帶來顯著的價值,例如:
1、全面理解用戶旅程
可視化用戶體驗:用戶體驗地圖通過圖形化的方式展示用戶在使用產(chǎn)品或服務(wù)過程中的所有步驟和接觸點,使團隊能夠直觀地看到用戶的整個旅程。
識別關(guān)鍵時刻:幫助團隊識別用戶旅程中的關(guān)鍵觸點和情感波動,理解用戶在不同階段的需求和行為。
2、發(fā)現(xiàn)用戶痛點和改進機會
識別痛點:用戶體驗地圖能夠揭示用戶在使用過程中的痛點和挑戰(zhàn),使團隊可以針對這些問題制定解決方案。
挖掘改進機會:通過分析用戶行為和情感波動,團隊可以找到提升用戶體驗的機會,從而優(yōu)化產(chǎn)品或服務(wù)。
3. 增強團隊協(xié)作和溝通
統(tǒng)一理解:用戶體驗地圖作為一種直觀的溝通工具,使跨職能團隊(如產(chǎn)品經(jīng)理、設(shè)計師、開發(fā)人員和市場團隊)能夠共享對用戶體驗的統(tǒng)一理解。
促進協(xié)作:通過共同創(chuàng)建和討論用戶體驗地圖,團隊成員可以更好地協(xié)作,提出建設(shè)性的意見和建議。
4. 驅(qū)動以用戶為中心的設(shè)計
以用戶為中心:用戶體驗地圖強調(diào)從用戶的角度出發(fā),關(guān)注用戶的需求、情感和行為,推動以用戶為中心的設(shè)計和開發(fā)。
提升用戶滿意度:通過優(yōu)化用戶旅程中的各個觸點和體驗,團隊可以提升用戶滿意度和忠誠度。
5. 支持決策制定
數(shù)據(jù)驅(qū)動決策:用戶體驗地圖基于用戶研究和數(shù)據(jù)分析,為決策提供可靠的依據(jù),減少主觀判斷和猜測。
優(yōu)先級管理:通過識別用戶體驗中的關(guān)鍵問題和機會,團隊可以更好地確定優(yōu)先級,集中資源解決最重要的問題。
6. 提高用戶體驗設(shè)計的效率和效果
明確目標和方向:用戶體驗地圖幫助團隊明確設(shè)計目標和方向,減少反復(fù)修改和溝通成本,提高設(shè)計效率。
驗證設(shè)計假設(shè):通過用戶體驗地圖,團隊可以驗證設(shè)計假設(shè)和概念,確保設(shè)計方案符合用戶需求和期望。
三、什么情況使用用戶體驗地圖?
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
用戶體驗地圖(User Experience Map)在多種情況下都可以使用,能夠幫助團隊更好地理解和優(yōu)化用戶體驗。例如:
1.產(chǎn)品或服務(wù)的初期開發(fā)階段
定義產(chǎn)品概念:在開發(fā)新產(chǎn)品或服務(wù)時,用戶體驗地圖幫助團隊理解用戶需求和期望,確保產(chǎn)品設(shè)計符合用戶需求。
設(shè)計用戶旅程:通過用戶體驗地圖,團隊可以詳細規(guī)劃用戶與產(chǎn)品互動的每個步驟和觸點,確保用戶旅程流暢且無障礙。
示例:
一家創(chuàng)業(yè)公司在開發(fā)一款新的移動應(yīng)用時,通過用戶體驗地圖了解目標用戶的需求和使用習(xí)慣,從而設(shè)計出更符合用戶期望的產(chǎn)品。
2.現(xiàn)有產(chǎn)品或服務(wù)的優(yōu)化
識別和解決問題:當現(xiàn)有產(chǎn)品或服務(wù)存在用戶體驗問題時,用戶體驗地圖幫助團隊識別痛點并制定改進措施。
提升用戶滿意度:通過分析用戶在不同接觸點的情感和行為,團隊可以找到提升用戶滿意度和忠誠度的機會。
示例:
一家電商平臺通過用戶體驗地圖發(fā)現(xiàn)用戶在結(jié)賬環(huán)節(jié)遇到的困難,優(yōu)化了結(jié)賬流程,顯著提高了用戶滿意度和轉(zhuǎn)化率。
3.跨職能團隊的協(xié)作和溝通
建立共同理解:在涉及多個部門的項目中,用戶體驗地圖幫助不同團隊(如產(chǎn)品、設(shè)計、開發(fā)、市場)建立對用戶體驗的共同理解。
促進協(xié)作:通過可視化的用戶旅程,團隊成員可以更有效地討論和協(xié)作,提出有建設(shè)性的改進建議。
示例:
一家大型企業(yè)在推出一項新服務(wù)時,通過用戶體驗地圖讓產(chǎn)品經(jīng)理、設(shè)計師和市場團隊共同參與,確保各團隊對用戶體驗的理解一致,從而提高協(xié)作效率。
4.用戶研究和測試階段
記錄用戶反饋:在用戶研究和測試階段,用戶體驗地圖幫助記錄和分析用戶反饋,發(fā)現(xiàn)用戶在使用產(chǎn)品過程中的實際體驗。
驗證設(shè)計假設(shè):通過用戶體驗地圖,團隊可以驗證設(shè)計假設(shè),確保設(shè)計方案符合用戶需求和期望。
示例:
一家金融科技公司在測試新功能時,通過用戶體驗地圖記錄用戶的使用體驗和反饋,優(yōu)化了功能設(shè)計。
5.制定產(chǎn)品戰(zhàn)略和路線圖
戰(zhàn)略規(guī)劃:用戶體驗地圖幫助團隊從用戶角度出發(fā),制定產(chǎn)品戰(zhàn)略和發(fā)展路線圖,確保產(chǎn)品的發(fā)展方向符合用戶需求。
優(yōu)先級管理:通過識別用戶體驗中的關(guān)鍵問題和機會,團隊可以更好地確定改進措施的優(yōu)先級。
示例:
一家健康科技公司在制定未來兩年的產(chǎn)品發(fā)展計劃時,通過用戶體驗地圖分析用戶需求和市場趨勢,確定了重點開發(fā)的功能和服務(wù)。
6.營銷和客戶支持
提升客戶支持效率:用戶體驗地圖幫助識別用戶在尋求支持時的痛點,優(yōu)化客戶支持流程,提高用戶滿意度。
優(yōu)化營銷策略:通過了解用戶在不同階段的情感和行為,團隊可以制定更有針對性的營銷策略,提升用戶轉(zhuǎn)化率。
示例:
一家SaaS公司通過用戶體驗地圖發(fā)現(xiàn)用戶在使用過程中遇到的常見問題,優(yōu)化了客戶支持流程,并根據(jù)用戶行為調(diào)整了營銷策略,提高了客戶留存率。
四、  用戶體驗地圖的組成?
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
組成用戶體驗地圖(User Experience Map)可以分為八個部分,分別是:用戶角色(Persona)、場景(Scenario)、階段(Stages)、觸點(Touchpoints)、用戶行為(Actions)、用戶情感(Emotions)、痛點(Pain Points)、機會(Opportunities);組成部分整合到一張用戶體驗地圖上,團隊可以直觀地看到用戶旅程中的所有關(guān)鍵要素。幫助團隊全面理解用戶在整個體驗過程中的行為、情感和痛點,從而制定更有效的優(yōu)化策略,提升用戶滿意度。下面我們詳細說明這八個部分:
1. 用戶角色(Persona)
定義:用戶角色是目標用戶的詳細描述,包括人口統(tǒng)計信息、行為模式、需求和痛點。
目的:幫助團隊聚焦特定用戶群體的需求和體驗,使設(shè)計和決策更有針對性。
示例:
年齡:25-35歲
職業(yè):城市白領(lǐng)
興趣愛好:網(wǎng)上購物
需求和痛點:需要便捷快速的購物體驗,不喜歡復(fù)雜的結(jié)賬流程
2. 場景(Scenario)
定義:場景是用戶在某一特定情境下與產(chǎn)品或服務(wù)互動的全過程描述。
目的:幫助團隊了解用戶的具體使用情境和目標,確保設(shè)計滿足實際使用需求。
示例:用戶在下班回家的路上,通過移動應(yīng)用購買晚餐所需的食材。
3. 階段(Stages)
定義:用戶旅程的不同階段,從開始到結(jié)束,包括用戶在每個階段的主要活動和目標。
目的:展示用戶旅程的整體結(jié)構(gòu),幫助團隊識別每個階段的關(guān)鍵活動和目標。
示例:
發(fā)現(xiàn)(Discovery)、考慮(Consideration)、決策(Decision)、使用(Usage)、回訪(Return)
4. 觸點(Touchpoints)
定義:用戶在每個階段與產(chǎn)品或服務(wù)的具體接觸點,如網(wǎng)站、客服、實體店等。
目的:識別用戶與品牌互動的關(guān)鍵時刻,確保每個接觸點的體驗都得到優(yōu)化。
示例:網(wǎng)站首頁、產(chǎn)品頁面、購物車、結(jié)賬頁面、客服
5. 用戶行為(Actions)
定義:用戶在每個觸點上的具體行為,如瀏覽網(wǎng)頁、咨詢客服、購買產(chǎn)品等。
目的:展示用戶的具體操作過程,幫助團隊理解用戶的實際使用方式。
示例:瀏覽產(chǎn)品、加入購物車、填寫訂單信息、支付、聯(lián)系客服
6. 用戶情感(Emotions)
定義:用戶在每個觸點上的情感體驗,包括積極和消極的情感波動。
目的:幫助團隊理解用戶的滿意度和痛點,確保在關(guān)鍵時刻提供積極的體驗。
示例:
興奮(瀏覽產(chǎn)品時)、猶豫(選擇支付方式時)、沮喪(遇到支付問題時)、滿意(收到產(chǎn)品時)
7. 痛點(Pain Points)
定義:用戶在整個體驗過程中遇到的困難和挑戰(zhàn)。
目的:識別和解決用戶體驗中的問題,提升用戶滿意度。
示例:
結(jié)賬頁面加載慢、支付方式選擇不便、客服響應(yīng)慢
8. 機會(Opportunities)
定義:基于用戶行為、情感和痛點,識別出改善用戶體驗的潛在機會。
目的:為團隊提供改進用戶體驗的方向和具體措施,推動持續(xù)優(yōu)化。
示例:
優(yōu)化結(jié)賬頁面性能、增加支付方式、提升客服響應(yīng)速度
五、  用戶體驗地圖的制作流程
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
制作一份完整的用戶體驗地圖(User Experience Map)需要多個步驟,使用的方法也有很多,不用擔(dān)心,下面我們進行詳細步驟拆解:
1.定義目標
目的:明確制作用戶體驗地圖的目標和用途,比如改善特定功能的用戶體驗、優(yōu)化整體用戶旅程等。
示例:
一家電商平臺希望通過用戶體驗地圖識別用戶在結(jié)賬過程中的痛點,并制定改進措施。
2.收集用戶數(shù)據(jù)
方法:
用戶訪談:直接與用戶對話,了解他們的需求、行為和情感。
問卷調(diào)查:通過問卷收集大規(guī)模用戶數(shù)據(jù)。
用戶觀察:觀察用戶在實際使用產(chǎn)品或服務(wù)時的行為和反應(yīng)。
可用性測試:測試用戶在特定任務(wù)中的表現(xiàn),發(fā)現(xiàn)使用障礙和痛點。
數(shù)據(jù)分析:分析網(wǎng)站或應(yīng)用的使用數(shù)據(jù),了解用戶行為模式。
示例:
電商平臺通過用戶訪談和問卷調(diào)查收集用戶在結(jié)賬過程中的體驗和反饋。
3.定義用戶角色(Persona)
步驟:
基于收集的數(shù)據(jù),定義主要的用戶角色,描述其特征、需求和痛點。
示例:
用戶角色A:25-35歲,城市白領(lǐng),喜歡網(wǎng)上購物,重視便捷和快速的購物體驗。
4.描繪用戶旅程
步驟:
劃分用戶旅程的不同階段,從開始到結(jié)束,包括用戶在每個階段的主要活動和目標。
示例:
發(fā)現(xiàn)階段:用戶在網(wǎng)上搜索和瀏覽商品。
考慮階段:用戶比較不同商品的特點和價格。
決策階段:用戶決定購買某件商品。
使用階段:用戶完成購買并等待商品送達。
回訪階段:用戶收到商品后可能會再次訪問網(wǎng)站。
5.識別觸點和用戶行為
步驟:列出用戶在每個階段的具體觸點和行為,展示用戶的操作過程。
示例:
觸點:網(wǎng)站首頁、產(chǎn)品頁面、購物車、結(jié)賬頁面、客服。
用戶行為:瀏覽產(chǎn)品、加入購物車、填寫訂單信息、支付、聯(lián)系客服。
6.記錄用戶情感
步驟:描述用戶在每個觸點上的情感體驗,包括積極和消極的情感波動。
示例:
用戶在瀏覽產(chǎn)品時感到興奮,但在結(jié)賬時因頁面加載慢而感到沮喪。
7.識別痛點和機會
步驟:基于用戶行為和情感,識別用戶在每個階段的痛點,并找出改善用戶體驗的機會。
示例:
痛點:結(jié)賬頁面加載慢、支付方式選擇不便、客服響應(yīng)慢。
機會:優(yōu)化結(jié)賬頁面性能、增加支付方式、提升客服響應(yīng)速度。
8.創(chuàng)建可視化地圖
步驟:將所有信息整合到一張可視化的用戶體驗地圖上,使團隊能夠直觀地了解用戶的完整體驗過程。
工具:
手繪草圖:用紙和筆繪制用戶體驗地圖。
數(shù)字工具:使用工具如Miro、Lucidchart、UXPressia等創(chuàng)建數(shù)字用戶體驗地圖。
9.討論和驗證
步驟:
與團隊成員共同討論用戶體驗地圖,驗證其準確性和全面性。
基于討論結(jié)果進行必要的修改和調(diào)整。
示例:
團隊成員共同審查用戶體驗地圖,確認所有觸點和用戶行為是否準確,討論發(fā)現(xiàn)的痛點和改進機會。
10.制定改進措施
步驟:根據(jù)用戶體驗地圖識別的痛點和機會,制定具體的改進措施和實施計劃。
示例:
優(yōu)化結(jié)賬頁面加載速度,增加多種支付方式,提升客服響應(yīng)效率。
11.實施和跟蹤改進
步驟:實施制定的改進措施,并持續(xù)跟蹤用戶反饋和數(shù)據(jù),評估改進效果。
示例:
電商平臺實施優(yōu)化結(jié)賬頁面的改進措施,并通過用戶反饋和數(shù)據(jù)分析評估效果,確保用戶體驗得到提升。
六、  用戶體驗地圖案例展示
通過上面的介紹,相信你已經(jīng)對用戶體驗地圖(User Experience Map)有了一定了解,是不是已經(jīng)想自己動手開始制作了,下面我們看幾個案例:
案例 1:電商平臺優(yōu)化
背景:一家電商平臺希望通過用戶體驗地圖識別用戶在結(jié)賬過程中的痛點,并制定改進措施,以提升用戶滿意度和轉(zhuǎn)化率。
 
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
用戶角色(Persona)
姓名:張女士
年齡:30歲
職業(yè):城市白領(lǐng)
興趣:喜歡網(wǎng)上購物
需求:需要便捷快速的購物體驗
痛點:不喜歡復(fù)雜的結(jié)賬流程
觸點和用戶行為
 
1.  發(fā)現(xiàn)(Discovery):通過搜索引擎和社交媒體廣告發(fā)現(xiàn)平臺
2.  考慮(Consideration):瀏覽產(chǎn)品詳情,查看用戶評論
3.  決策(Decision):將商品加入購物車
4.  購買(Purchase):填寫訂單信息并支付
5.  回訪(Return):查看訂單狀態(tài),聯(lián)系客戶服務(wù)
用戶情感
發(fā)現(xiàn):興奮和好奇
考慮:謹慎和比較
決策:確定和期待
購買:焦慮和滿足
回訪:滿意和信任
痛點和機會
痛點:結(jié)賬頁面加載慢,支付方式選擇不便,客服響應(yīng)慢
機會:優(yōu)化結(jié)賬頁面性能,增加支付方式,提升客服響應(yīng)速度
案例 2:健身App優(yōu)化
背景:一家健身App希望提高用戶的使用頻率和忠誠度。
 
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
用戶角色(Persona)
姓名:李先生
年齡:25歲
職業(yè):程序員
興趣:健身
需求:需要個性化的健身計劃
痛點:課程選擇不夠個性化,計劃制定過程復(fù)雜
觸點和用戶行為
 
1.  發(fā)現(xiàn)(Discovery):通過朋友推薦和廣告發(fā)現(xiàn)App下載并安裝App
2.  考慮(Consideration):瀏覽課程詳情,查看評價
3.  決策(Decision):選擇并購買課程
4.  使用(Usage):開始使用課程進行鍛煉
5.  回訪(Return):查看鍛煉記錄,調(diào)整計劃
用戶情感
發(fā)現(xiàn):好奇和期待
考慮:審慎和比較
決策:確定和信心
使用:滿足和成就
回訪:滿意和忠誠
痛點和機會
痛點:課程選擇不夠個性化,計劃制定復(fù)雜
機會:增加個性化推薦功能,簡化計劃制定過程
案例 3:銀行在線服務(wù)優(yōu)化
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
背景:一家銀行希望優(yōu)化其在線服務(wù)平臺,以提高用戶的操作體驗和滿意度。
用戶角色(Persona)
姓名:王女士
年齡:45歲
職業(yè):教師
興趣:理財
需求:需要簡單易用的在線銀行服務(wù)
痛點:在線服務(wù)平臺操作復(fù)雜,轉(zhuǎn)賬流程繁瑣
觸點和用戶行為
 
1.  發(fā)現(xiàn)(Discovery):訪問銀行官網(wǎng),注冊賬戶
2.  考慮(Consideration):瀏覽平臺功能和用戶評價
3.  決策(Decision):決定使用在線服務(wù)
4.  使用(Usage):進行賬戶管理和轉(zhuǎn)賬操作
5.  回訪(Return):查看交易記錄,繼續(xù)使用服務(wù)
用戶情感
發(fā)現(xiàn):好奇和懷疑
考慮:審慎和信任
決策:確定和信心
使用:滿足和便捷
回訪:滿意和忠誠
痛點和機會
痛點:操作復(fù)雜,轉(zhuǎn)賬流程繁瑣
機會:簡化操作流程,優(yōu)化用戶界面設(shè)計
 
七、  用戶體驗地圖的總結(jié)
用戶體驗地圖(User Experience Map)作為一種強大的工具,在理解和優(yōu)化用戶體驗方面具有顯著優(yōu)勢。然而,制作和維護用戶體驗地圖也存在資源密集、復(fù)雜性和動態(tài)變化等挑戰(zhàn)。團隊在使用用戶體驗地圖時,需要平衡其優(yōu)劣勢,合理分配資源,確保地圖的準確性和實用性,從而真正提升用戶體驗和產(chǎn)品成功率。
優(yōu)勢
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
 
1.  全景視角
優(yōu)點:用戶體驗地圖提供了用戶體驗的全景視角,涵蓋了用戶與產(chǎn)品或服務(wù)互動的各個階段。這種全景視角有助于團隊全面了解用戶旅程中的各個觸點和行為。
案例:電商平臺可以通過用戶體驗地圖了解用戶從瀏覽商品到完成購買的全過程,識別出所有關(guān)鍵的用戶觸點。
2.  用戶共情
優(yōu)點:通過記錄用戶在每個階段的情感體驗,團隊可以更好地理解用戶的需求和痛點,增強用戶共情。
案例:健身App可以通過用戶體驗地圖了解用戶在制定和執(zhí)行健身計劃時的情感變化,從而設(shè)計出更具吸引力的個性化健身計劃。
3.  識別痛點
優(yōu)點:用戶體驗地圖有助于識別用戶在使用產(chǎn)品或服務(wù)過程中的痛點和障礙,幫助團隊找到改進的機會。
案例:銀行在線服務(wù)平臺可以通過用戶體驗地圖識別出用戶在進行轉(zhuǎn)賬操作時遇到的困難,進而優(yōu)化轉(zhuǎn)賬流程。
4.  跨團隊協(xié)作
優(yōu)點:用戶體驗地圖作為一個可視化工具,可以促進跨團隊協(xié)作,使不同部門(如產(chǎn)品、設(shè)計、開發(fā)和市場)能夠共同參與討論和改進用戶體驗。
案例:電商平臺可以通過用戶體驗地圖匯集市場、設(shè)計和技術(shù)團隊的意見,共同制定優(yōu)化措施。
5.  數(shù)據(jù)驅(qū)動決策
優(yōu)點:用戶體驗地圖基于用戶研究和數(shù)據(jù)分析,使決策更加數(shù)據(jù)驅(qū)動,有助于制定科學(xué)合理的改進策略。
案例:健身App可以通過用戶體驗地圖中的用戶數(shù)據(jù)分析,調(diào)整課程推薦策略,提高用戶滿意度和使用頻率。
劣勢
打動用戶的關(guān)鍵:用戶體驗地圖實戰(zhàn)攻略
 
 
1.  資源密集
缺點:制作用戶體驗地圖需要大量的時間和資源,包括用戶研究、數(shù)據(jù)分析和團隊協(xié)作。
案例:中小型企業(yè)可能難以投入足夠的資源來全面制作和維護用戶體驗地圖。
2.  復(fù)雜性
缺點:用戶體驗地圖可能變得非常復(fù)雜,特別是當用戶旅程涉及多個觸點和渠道時,可能難以全面和準確地記錄所有細節(jié)。
案例:大型電商平臺的用戶旅程可能涉及網(wǎng)站、移動應(yīng)用、社交媒體等多個渠道,制作一個全面的用戶體驗地圖可能需要大量的精力。
3.  動態(tài)變化
缺點:用戶行為和市場環(huán)境是動態(tài)變化的,用戶體驗地圖需要不斷更新和維護,以保持其有效性和準確性。
案例:健身App的用戶需求和市場趨勢可能隨時變化,需要定期更新用戶體驗地圖以保持相關(guān)性。
4.  主觀偏差
缺點:盡管用戶體驗地圖基于用戶數(shù)據(jù)和研究,但在數(shù)據(jù)解讀和情感記錄上可能存在主觀偏差,影響決策的準確性。
案例:銀行在線服務(wù)平臺在記錄用戶情感時,可能會受到研究者的主觀影響,從而無法完全準確地反映用戶真實感受。
5.  過于理想化
缺點:用戶體驗地圖有時可能過于理想化,忽略了現(xiàn)實中存在的限制和障礙,導(dǎo)致制定的改進措施難以實施。
案例:電商平臺在識別改進機會時,可能忽略了技術(shù)實現(xiàn)上的困難,導(dǎo)致優(yōu)化方案無法落地。
參考文獻:
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?
U
 


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

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢、UI設(shè)計服務(wù)公司、軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司UI交互設(shè)計公司、數(shù)據(jù)可視化設(shè)計公司、用戶體驗公司、高端網(wǎng)站設(shè)計公司、銀行金融軟件UI界面設(shè)計、能源及監(jiān)控軟件UI界面設(shè)計、氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計、企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)、軟件wpf開發(fā)軟件vue開發(fā)

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

鶴鶴

合理使用數(shù)據(jù)圖表可以幫助用戶更好地理解復(fù)雜的數(shù)據(jù),提高用戶體驗和數(shù)據(jù)的可讀性。選擇合適的圖表類型并遵循最佳設(shè)計實踐是確保圖表有效傳達信息的關(guān)鍵。
數(shù)據(jù)圖表是一種非常重要的可視化工具,它能夠
幫助用戶更直觀地理解和分析數(shù)據(jù)。
借助于圖形化的手段,清晰、快捷有效的傳達與溝通信息。從用戶的角度,數(shù)據(jù)可視化可以讓用戶快速抓住要點信息,讓關(guān)鍵的數(shù)據(jù)點從人類的眼睛快速通往心靈深處。數(shù)據(jù)可視化一般會具備以下幾個特點:準確性、創(chuàng)新性、簡潔性。
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 
清晰展現(xiàn)關(guān)鍵信息,助力高效決策——數(shù)據(jù)圖表
 
 

 


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

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢、UI設(shè)計服務(wù)公司、軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司、UI交互設(shè)計公司、數(shù)據(jù)可視化設(shè)計公司、用戶體驗公司高端網(wǎng)站設(shè)計公司、銀行金融軟件UI界面設(shè)計、能源及監(jiān)控軟件UI界面設(shè)計氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計、醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)軟件wpf開發(fā)、軟件vue開發(fā)

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

鶴鶴

一、可視化原則
數(shù)據(jù)可視化是把相對復(fù)雜、抽象的數(shù)據(jù)通過可視化手段,表達數(shù)據(jù)內(nèi)在的信息和規(guī)律,促進數(shù)據(jù)信息的傳播和應(yīng)用。
Dreawer Design 團隊總結(jié)了以下四個可視化原則,供設(shè)計者參考及使用:
1. 準確
數(shù)據(jù)圖表需精準、如實地反應(yīng)數(shù)據(jù)信息的變化特征。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
2. 清晰
讓設(shè)計服務(wù)于數(shù)據(jù)內(nèi)容,給用戶以最為清晰、明確、迅捷的數(shù)據(jù)展示。用戶看到可視化圖表時,應(yīng)能在 5 秒內(nèi)了解到它的用途,而不是花幾分鐘都不能理解各個數(shù)據(jù)的含義。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
3. 簡單
可視化結(jié)果應(yīng)該是一看就懂,不需要思考和過度理解,因而選定圖表時要理性,避免為了視覺上的效果而選擇一些對用戶不太友好的圖形。
下面為圖標類型與認知成本對比:
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
4. 美觀
優(yōu)秀的數(shù)據(jù)可視化界面,會有一套非常嚴謹一致的版面。這里的一致性需要考慮到布局、結(jié)構(gòu)和內(nèi)容。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
二、圖表解構(gòu)
1. 構(gòu)成元素
我們從標題、坐標軸、圖例、標簽、提示信息、數(shù)據(jù)圖形這 6 個大類,對數(shù)據(jù)圖表進行進一步元素拆解及闡述。設(shè)計過程中,需遵循可視化原則來精簡數(shù)據(jù)圖表,讓用戶快速獲取圖表中的關(guān)鍵信息,完成任務(wù)。
 
圖表構(gòu)成 6 大類,元素細分:
1. 標題:圖表標題;
2. 坐標軸:X/Y軸線、刻度線、網(wǎng)格線、X/Y軸標題、X/Y軸標簽;
3. 標簽:數(shù)據(jù)點、引導(dǎo)線、(文本)數(shù)據(jù)值;
4. 提示信息;
5. 圖例;
6. 數(shù)據(jù)圖形:線、矩形、扇形、環(huán)形等。
下面為數(shù)據(jù)圖表的基本構(gòu)成元素示例(為了便于觀察,某些字母做了大寫處理):
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
除了以上的常規(guī)元素,還有常用于餅圖、環(huán)形圖中的“引導(dǎo)線”:
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
2. 標題
標題是概括圖表主題的說明文字,一個明確、精簡的標題可以迅速讓讀者理解圖表要表達的內(nèi)容。
2.1 位置
一般位于數(shù)據(jù)圖表卡片的左上方。
2.2 使用建議
標題需言簡意賅、符合圖表主題;盡量控制在 20 個字以內(nèi),標題寬度盡量不要超過卡片寬度。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
2.3超長處理
當標題超過長出卡片寬度時,省略標題中間的文字,保住首尾,如“我是...標題”。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
 
3. 坐標軸
3.1 坐標系
坐標軸包含在坐標系的概念里,因此,我們需要先了解坐標系。坐標系是能夠使每個數(shù)組在維度空間內(nèi)找到映射關(guān)系的定位系統(tǒng),更偏向數(shù)學(xué)/物理概念。
 
數(shù)據(jù)可視化中,最常用的二維坐標系有兩種:
笛卡爾坐標系:即直角坐標系,是由相互垂直的兩條軸線構(gòu)成。常用于柱狀圖、條形圖、折線圖、面積圖等。
極坐標系:由極點、極軸組成,坐標系內(nèi)任何一個點都可以用極徑 r 和夾角 θ(逆時針為正)表示。常用于餅圖、圓環(huán)圖、雷達圖等。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
補充說明:
1. 坐標軸由定義域軸(X 軸)和值域軸(Y 軸)組成。條形圖中,定義域軸為 Y 軸,值域軸為 X 軸。
2. X軸為水平方向的橫軸,Y 軸為垂直方向的豎軸。以下主要針對笛卡爾坐標系的坐標軸構(gòu)成進行分析:
3.2 坐標軸
定義:坐標軸指二維空間中統(tǒng)計圖表中的軸,是坐標系的構(gòu)成部分,它用來定義坐標系中數(shù)據(jù)在方向和值之間的映射關(guān)系。
構(gòu)成元素細分:X/Y 軸線、刻度線、網(wǎng)格線、X/Y 軸標題、X/Y 軸標簽。
3.3 軸類型
根據(jù)對應(yīng)變量是連續(xù)數(shù)據(jù)還是離散數(shù)據(jù),可以把坐標軸分為:分類軸、時間軸、連續(xù)軸三大類。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
3.4 X/Y 軸線
顏色層級:X/Y軸線要比網(wǎng)格線層級高、顏色深,這樣能讓圖表有主次區(qū)分。
使用建議:有網(wǎng)格線時,柱狀圖/折線圖會隱藏 Y 軸線,條形圖則是隱藏 X 軸線,以達到信息降噪、突出重點的目的。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
3.5 刻度線
軸刻度線是軸線上的小線段, 用于指示數(shù)值標簽在坐標軸上的具體位置。軸刻度線有 3 種放置方式:置內(nèi)、置中(即交叉方式)、置外。
位置建議:刻度線置中/置內(nèi)時,可能會和網(wǎng)格線、數(shù)據(jù)圖形重疊,所以建議將刻度線置于數(shù)值坐標軸外側(cè),以呈現(xiàn)最佳顯示效果。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
顯示建議:
折線圖:刻度線、X/Y 軸標簽、數(shù)據(jù)點需要保持在同一垂直線上;
柱狀圖/條形圖:由于單個柱子有很強的對應(yīng)關(guān)系,此時可以隱藏刻度線;
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
 
3.6 網(wǎng)格線
定義:網(wǎng)格線是用來輔助圖表優(yōu)化映射關(guān)系的,我們需要弱化網(wǎng)格線的視覺效果,來增加數(shù)據(jù)的可閱讀性。
作用:1. 延伸數(shù)值刻度至可視化對象中,以便觀察數(shù)據(jù)值的大??;2. 增加可視化對象之間的對比觀察度。
使用建議 1 :使用網(wǎng)格線時,需遵從主次原則,以軸線為主、網(wǎng)格線為輔;樣式上可采用實線或虛線;避免顏色過重、使用純黑/純白色。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
使用建議 2 :網(wǎng)格線一般跟隨值域軸的位置單向顯示,柱狀圖、折線圖等采用水平網(wǎng)格,條形圖采用垂直網(wǎng)格。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
3.7 X/Y 軸標題
軸標題主要用于說明坐標軸數(shù)據(jù)組的含義,也可理解為“軸單位”。當可視化圖表標題、圖例、軸標簽等已能充分表達數(shù)據(jù)含義時,可隱藏軸標題。
這樣處理體現(xiàn)了奧卡姆剃刀定律:如無必要,勿增實體。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
3.8 X/Y 軸標簽
軸標簽是對當前某一組數(shù)據(jù)的內(nèi)容標注,用于提高數(shù)據(jù)的可讀性。
以下從 X 軸標簽、Y軸標簽兩方面進行分析:
a.  X 軸標簽
X 軸標簽的設(shè)計重點在顯示規(guī)則上。卡片寬度過窄、標簽過多、名稱過長時,X 軸標簽便會出現(xiàn)顯示問題(如標簽重疊等)。
為了解決顯示問題,我們從連續(xù)/時間軸標簽(數(shù)值類)、分類軸標簽(文本類)兩方面進行分析:
 
  •  
    連續(xù)/時間軸標簽
顯示規(guī)則:建議等分抽樣顯示、旋轉(zhuǎn);不尾部省略。
建議等分抽樣:連續(xù)/時間軸,通常由一組等差數(shù)列組成,具有規(guī)律性,缺失的數(shù)據(jù)用戶會在腦海中自動補全。所以建議用等分抽樣來避免標簽的重疊問題。
注意:等分抽樣盡量保留首尾數(shù)據(jù)標簽;隨機抽樣沒有規(guī)律,會影響用戶的判斷及辨認,不建議采取隨機抽樣顯示。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
連續(xù)/時間軸標簽是由“關(guān)鍵數(shù)值”組成的標注點,一般都明確精簡,尾部省略會影響用戶對關(guān)鍵數(shù)值的辨認。
為了保證標簽的辨識度,我們可以將標簽旋轉(zhuǎn) 45°、 90° 。極端情況下(圖表寬度極窄),可以同時進行旋轉(zhuǎn)+抽樣。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
  •  
    分類軸標簽
顯示規(guī)則:建議旋轉(zhuǎn)顯示;不建議抽樣顯示。
分類軸由幾個離散數(shù)據(jù)標簽組成,標簽之間獨立存在,無緊密邏輯關(guān)系,用戶無法自動補全缺失信息。因此,不能采取抽樣顯示,應(yīng)盡量展示全部標簽的全部文本。
若標簽橫向展示空間不夠(文字重疊),我們可以將標簽旋轉(zhuǎn) 45°、 90° 來達到預(yù)期顯示效果。若通過旋轉(zhuǎn)無法滿足需求,可使用條形圖,將分類軸放在Y軸。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
旋轉(zhuǎn)方向說明:通常情況下,用戶的閱讀視線為從左至右、從上到下。因此,標簽順時針旋轉(zhuǎn) 45° 更符合用戶的瀏覽習(xí)慣。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
b. Y 軸標簽
Y 軸標簽的設(shè)計重點在標簽數(shù)量、取值范圍和數(shù)據(jù)格式上。標簽顯示區(qū)域一般根據(jù)最長標簽寬度進行自適應(yīng)縮放。
  •  
    軸標簽的數(shù)量
使用建議:根據(jù)米勒定律(7±2 法則),Y 軸標簽數(shù)量應(yīng)控制在 5-9 個的范圍內(nèi);Web頁面中,Y 軸常用標簽數(shù)為:6 或 7(含標簽0)。
軸標簽的數(shù)量越多,橫向網(wǎng)格線就會越多。過多的軸標簽及網(wǎng)格線會造成元素冗余,違背了清晰、準確的可視化原則,也不利于圖表信息的表達及閱讀。
對齊方式:右對齊
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
  •  
    軸標簽的取值范圍
基準線: Y 軸標簽取值應(yīng)從 0 基線開始,以反映數(shù)據(jù)的真實性。如果展示被截斷的 Y 軸數(shù)據(jù),會導(dǎo)致用戶做出錯誤的判斷。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
  •  
    軸標簽的數(shù)據(jù)格式
使用建議 1: 標簽保留的小數(shù)位數(shù)保持統(tǒng)一。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
4. 數(shù)據(jù)標簽
數(shù)據(jù)標簽是對數(shù)據(jù)點對應(yīng)數(shù)值的標注,用于直接觀察每個數(shù)據(jù)點的具體數(shù)值。
若圖表主要是用來看趨勢變化、占比大小等,則不需要顯示數(shù)據(jù)標簽。若想精確了解每組數(shù)據(jù)的具體數(shù)值,則可以顯示數(shù)據(jù)標簽。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
4.1 位置
數(shù)據(jù)標簽位于數(shù)據(jù)點的上方。
4.2 顯示規(guī)則
在不同類型的圖表中,數(shù)據(jù)標簽的顯示規(guī)則不同。我們可以根據(jù)數(shù)據(jù)圖形、數(shù)據(jù)值的特性,選擇合適的顯示方式,提高圖表的準確性。
a. 柱狀圖
  •  
    基礎(chǔ)柱狀圖
    :數(shù)據(jù)標簽可顯示在數(shù)據(jù)圖形內(nèi)部、外部。
數(shù)據(jù)標簽在圖形內(nèi)部的顯示規(guī)則:正常情況下,橫向顯示;數(shù)據(jù)標簽超長時,旋轉(zhuǎn) 90°;圖形高度 < 數(shù)據(jù)標簽高度時,不顯示數(shù)據(jù)標簽。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
  •  
    分組柱狀圖
    :數(shù)據(jù)標簽可顯示在數(shù)據(jù)圖形內(nèi)部、外部。顯示在內(nèi)部的數(shù)據(jù)標簽顯示寬度不夠時,解決方案同上。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
  •  
    堆疊柱狀圖
    :數(shù)據(jù)標簽顯示在數(shù)據(jù)圖形內(nèi)部。
數(shù)據(jù)標簽在圖形內(nèi)部的顯示規(guī)則:正常情況下,橫向顯示;數(shù)據(jù)標簽超長時,旋轉(zhuǎn) 90°;圖形高度 < 數(shù)據(jù)標簽高度時,不顯示數(shù)據(jù)標簽。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
b. 條形圖
數(shù)據(jù)標簽在圖形內(nèi)部的顯示規(guī)則:正常情況下,橫向顯示;圖形寬度 < 數(shù)據(jù)標簽高度時,不顯示數(shù)據(jù)標簽;條形圖高度需 >= 數(shù)據(jù)標簽高度。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
基礎(chǔ)、分組條形圖的數(shù)據(jù)標簽也可以顯示在圖形外部:
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
c. 折線圖
數(shù)據(jù)標簽顯示在數(shù)據(jù)點的上方。
圖表寬度過窄,數(shù)據(jù)點多且密時,相鄰的數(shù)據(jù)標簽會出現(xiàn)重疊的問題。此時,我們會采用抽樣的方式顯示數(shù)據(jù)標簽。鼠標懸停數(shù)據(jù)點,顯示隱藏的數(shù)據(jù)標簽。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
d. 餅圖、環(huán)形圖
數(shù)據(jù)標簽顯示在圖形內(nèi)部、外部均可。
由于扇形有角度,且形狀相對不規(guī)則,對數(shù)據(jù)標簽的文本長度包容度較低,環(huán)形更是如此。所以,當扇/環(huán)形分割過多、面積較小時,建議將數(shù)據(jù)標簽顯示在圖形外部。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
當然,我們也可以內(nèi)外部結(jié)合使用:
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
e. 數(shù)據(jù)標簽顏色
數(shù)據(jù)標簽顯示在圖形內(nèi)部時,圖形為背景,數(shù)據(jù)標簽為前景。此時,數(shù)據(jù)圖形作為背景色,會影響到數(shù)據(jù)標簽的顯色度及易讀性。
為了確保良好的可讀性,我們通過對圖形顏色 HS 值的判斷,來決定文字的顏色。這樣對比度就在可控范圍內(nèi),不會出現(xiàn)可讀性低的問題。
Web端設(shè)計語言庫——數(shù)據(jù)可視化
 
 
由于篇幅問題,剩余內(nèi)容接下一篇文章展示
 


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

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢、UI設(shè)計服務(wù)公司軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司、UI交互設(shè)計公司數(shù)據(jù)可視化設(shè)計公司、用戶體驗公司高端網(wǎng)站設(shè)計公司、銀行金融軟件UI界面設(shè)計能源及監(jiān)控軟件UI界面設(shè)計、氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)、軟件wpf開發(fā)、軟件vue開發(fā)

從對話到嵌入:多元場景AI形態(tài)淺析

鶴鶴

前言
 
當我們一次次被AI技術(shù)帶來的變革所驚艷,當ChatGPT一次次宣布其能力已經(jīng)突破了人類的想象,你是否注意到現(xiàn)有產(chǎn)品與AI融合的新趨勢?值得注意的是,新技術(shù)的出現(xiàn)也一定帶來了新的交互體驗。本文將以多種產(chǎn)品場景為例,梳理PC端多種主流的AI融合形態(tài),希望能給大家?guī)韱l(fā)。
 
 
多元場景下的主流AI形態(tài)
 
目前主流AI產(chǎn)品有如下3種主要形態(tài),分別為沉浸式的AI智能體(Agent)、伴隨式的AI副駕駛(Co-pilot)、嵌入式的AI場景化嵌入(Embedding)。這3種形態(tài)在能力、界面、操作體驗和適用場景都上存在顯著差異。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
 
一、沉浸式形態(tài)
 
AI智能體(Agent)—功能強大的AI伙伴
 
一個富有主動性的獨立伙伴,輸出的結(jié)果不完全依賴用戶的輸入,啟動AI問詢后有2種主流的形態(tài):
 
①「對話智能體」 以對話流的形式展示信息,用戶通過在當前語境下進行追問獲取最終結(jié)果;
 
②「目標智能體」用戶輸入指令后,一次性給予用戶“靠譜”的結(jié)果,配有側(cè)邊欄可進行多種輔助操作。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
1.對話智能體示例—Gemini
 
以谷歌Gemini產(chǎn)品為例,其作為對話流的智能體,為滿足搜索場景,具有以下特征:
 
1)冷啟頁Prompt形象化
 
相較于2023年初Gemini冷啟時的樣式,最近改版中冷啟的Prompt卡片變得形象化,當然我們也在其他Agent產(chǎn)品中觀察到了這一變化。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
2)多模態(tài)內(nèi)容
 
理解用戶的文字意圖,依據(jù)要求自主生成多模態(tài)卡片是對話智能體的主要特征之一,該功能可以極大地豐富AI反饋的多樣性,并能提高信息傳達的效率。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
3)信息索引的顯示
 
信息索引的展示是提升AI回答權(quán)威性和透明度的關(guān)鍵因素。然而,直接在閱讀內(nèi)容中嵌入索引標簽,可能在某些情況下影響用戶的閱讀連貫性。以Gemini為例,當前的設(shè)計允許用戶在卡片下方手動啟用索引信息,這種靈活性平衡了信息的可信度和閱讀體驗,適合多數(shù)日常場景。
 
當然,從設(shè)計角度考慮,某些情況下默認收起索引并非最佳選擇。在用戶高度依賴信息準確性的場景中,如金融或醫(yī)學(xué)領(lǐng)域,索引的可見性將會直接影響信任感。對于深入研究或延展閱讀需求較高的用戶,即時查看索引能更高效地獲取信息來源。
 
與之類似,在涉及多方信息傳播的業(yè)務(wù)分發(fā)場景,清晰可見的索引有助于減少誤解,提高效率。在這些情況下,索引的默認展開不僅強化了內(nèi)容的可靠性,也更好地支持了用戶的深入需求。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
2.目標智能體示例—Perplexity
 
Perplexity作為最近廣受好評的AI搜索工具,相較于Gemini,它更注重給予用戶最精準的答案?;赗AG技術(shù)的Perplexity為用戶提供了一種新的“確定性”,而鑒于這種特征,Perplexity擁有雙面板的形態(tài),可以對當前確定性的信息進行深化處理。
 
1 )輸入即結(jié)果
 
相較于Gemini等對話智能體產(chǎn)品,AI Agent用戶需要反復(fù)追問結(jié)果,而在體驗Perplexity時的無對話場景感,更傾向于一次性給予用戶“靠譜”的答案。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
2)側(cè)分欄—信息補充
 
因為Perplexity一次就可以給予用戶最“準確”的信息,用戶可能沒有追問的必要,但可能會有對于當前問答進行深度搜索的需求,這時會有右側(cè)GUI分欄的出現(xiàn),以便用戶進行輔助搜索。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
3.思考:給予用戶最佳答案的AI形態(tài)
 
在使用體驗上,Gemini與Perplexity雖然走向兩個不同的流派,但目的都是為了給用戶呈現(xiàn)最佳的搜索結(jié)果。Gemini就像一位富有想象力的對話者,用戶在對話中通過不斷地追問來獲得最佳的結(jié)果,而Perplexity更像一個AI版的知乎,它堅持“用戶不會犯錯”原則,冷靜客觀地為用戶提供最精準的答案。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
 
二、伴隨式形態(tài)
 
AI副駕駛(Copilot)—被動性的AI助手
 
這種形態(tài)下的AI更多扮演“副駕駛”的角色,為用戶提供建議和幫助,依賴用戶精準的指令對當前內(nèi)容窗口進行操作,一般以側(cè)邊欄形式展示,目前的Office文檔類產(chǎn)品多采用此類形態(tài)。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
1.AI副駕駛產(chǎn)品示例-Office
 
在近年的開發(fā)者大會中,微軟提到最多的詞就是“Copilot”,力推將AI技術(shù)快速融入到旗下應(yīng)用中。其中,Office軟件就融入了AI副駕駛的理念,該形態(tài)下的AI主要為用戶提供產(chǎn)品的創(chuàng)作輔助、信息的查詢總結(jié)等功能。
 
1)當前場景下的AI助手
 
AI的能力默認被限定在當前場景下,滿足用戶問詢、信息檢索、創(chuàng)作輔助等操作。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
2)被動性AI助手
 
Copilot無法自動執(zhí)行操作去修改當前頁面內(nèi)容,需要用戶確認后才可執(zhí)行,用戶執(zhí)行操作后會在側(cè)邊欄內(nèi)顯示操作記錄與撤銷操作的入口。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
3)輔助Prompt
 
由于AI副駕駛的特性,常常需要準確的Prompt才能執(zhí)行符合預(yù)期的操作,這對大部分用戶來說門檻較高,因此在使用時需要及時給予用戶合理的聯(lián)想Prompt,輔助用戶決策。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
2.思考:提高用戶工作效率的AI助手
 
作為被動性AI助手,用戶即使不使用也不會影響其在整體頁面中的操作,AI更多承擔(dān)的是提升用戶工作效率過程中的輔助角色。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
 
三、嵌入式形態(tài)
 
AI場景化嵌入(Embedding)
 
嵌入式AI主要聚焦特定場景的AI輔助,如AI即時性地生成對當前評論的回復(fù),此類交互無固定形態(tài),AI會在用戶進行高頻重要操作時即時觸發(fā)。
 
在多元化場景中,嵌入式AI的設(shè)計相較于前兩類更加靈活和輕量,通常以LGUI(輕量化用戶界面)為核心,強調(diào)用戶與AI之間的無縫銜接與高效互動。
 
與對話式或結(jié)構(gòu)化阿拉丁模式相比,嵌入式AI的設(shè)計思路更加通暢,摒棄了復(fù)雜的交互流程,更注重場景中的引導(dǎo)性和即時反饋,幫助用戶在合適的時機獲取所需信息。
 
從對話到嵌入:多元場景AI形態(tài)淺析
 
 
 
1.嵌入式AI示例—One Drive
 
以微軟One Drive為例,嵌入式AI不僅會在用戶整理文件時提供智能建議,還能在用戶分享文件時根據(jù)歷史記錄和內(nèi)容精準推薦分享對象。這種場景化的嵌入,展現(xiàn)了如何通過LGUI設(shè)計最大化提高效率,而非依賴傳統(tǒng)對話或復(fù)雜交互。
 
場景一: 文件整理AI建議
 
在AI為相關(guān)文件創(chuàng)建新文件夾的情境中,執(zhí)行完成后,它會主動詢問用戶是否需要將其他可能相關(guān)的文件一并移入到新建的文件夾中,以幫助用戶進一步整理文件。AI能夠基于文件內(nèi)容的上下文,敏銳地判斷出哪些文件可能屬于同一類別,進而為用戶提供便捷的一鍵整理服務(wù)。
 
場景二: 智能分享建議
 
當用戶準備在One Drive中分享文件時,AI助手會根據(jù)文件內(nèi)容和用戶的歷史分享記錄,預(yù)測出最可能需要分享的對象名單,為用戶精準推薦受眾人員。智能分享建議可以極大地節(jié)省用戶挑選分享對象的時間。
 
基于上述2個例子,我們可以對嵌入式AI有進一步的思考:
 
合理的嵌入式AI操作只在用戶進行重要操作時被“激活”,能夠在當前場景下即時給予用戶建議;
 
嵌入式AI一般情況下點擊大于錄入,方便用戶快速做出決定;
 
設(shè)計此類交互時,需要深度理解用戶使用場景,AI的喚起不應(yīng)干擾用戶對于主流程的操作體驗。
 
2.思考:效率導(dǎo)向的AI嵌入設(shè)計
 
對于普通設(shè)計師來說,容易在純對話交互和結(jié)構(gòu)化設(shè)計兩端搖擺,可能忽視了效率也是設(shè)計的重要原則。嵌入式AI的設(shè)計啟示在于“什么合適用什么”,既不過度依賴復(fù)雜的對話式設(shè)計,也不拘泥于結(jié)構(gòu)化方案。關(guān)鍵在于聚焦場景需求,以最簡便和有效的方式幫助用戶完成任務(wù)。因此,在嵌入式AI的設(shè)計中,保持界面的簡潔與流暢,同時結(jié)合輕量化的LGUI原則,才是提升用戶體驗的關(guān)鍵。最終目標始終是“效率”,無論采用何種形式,選擇最適合當前場景的交互模式才是設(shè)計的核心。
 
 
未來的AI設(shè)計
 
多樣化形態(tài)下的平衡與共生
 
隨著AI技術(shù)的迅速發(fā)展,各種AI形態(tài)在不同場景中不斷涌現(xiàn),如上述討論的沉浸式、伴隨式、嵌入式等設(shè)計形態(tài)。無論是主動性強的智能體、輔助型的副駕駛,還是輕量化的嵌入式方案,每一種設(shè)計都展現(xiàn)出其獨特的價值。
 
然而,在這些多樣化的形態(tài)背后,我們?nèi)孕杌貧w一個核心問題:什么樣的AI設(shè)計才是理想的?
 
  •  
    首先,沒有一種AI形態(tài)能夠完美適用所有場景,真正成功的AI設(shè)計應(yīng)始終圍繞需求展開。在效率為先的原則下,設(shè)計師需要深刻理解用戶在不同情境下的核心需求,并選擇最適合的交互形態(tài)。復(fù)雜的對話式和高度結(jié)構(gòu)化的設(shè)計并非萬能,嵌入式AI的靈活性和輕量化設(shè)計則為平衡提供了啟發(fā)—服務(wù)于效率與體驗,簡化不必要的交互,專注于解決用戶的實際問題。
 
  •  
    其次,AI設(shè)計的多樣性并不意味著割裂,而是指向共生與融合。未來,AI技術(shù)將進一步打破不同形態(tài)之間的界限,形成更加靈活、動態(tài)的交互模式。這種融合不僅依賴更智能的技術(shù),還要求設(shè)計師在實際應(yīng)用中敏銳捕捉用戶需求,提供真正有價值的解決方案。
 
  •  
    最后,設(shè)計的核心原則是以用戶為中心,強調(diào)合適性,而非追求炫技。無論是大型智能體的復(fù)雜場景處理,還是嵌入式AI的場景化介入,優(yōu)秀的設(shè)計應(yīng)始終聚焦用戶需求,在不同場景中找到最優(yōu)平衡點。隨著技術(shù)的進化,設(shè)計師需要更加專注于如何將AI技術(shù)自然、無縫地融入用戶的工作與生活,使每一次交互都變得更加高效和愉快。
 
在未來,AI的形態(tài)將會更加多元,但不變的仍是設(shè)計師對效率、用戶價值和場景適配的持續(xù)探索。希望設(shè)計師在面對AI設(shè)計時,始終尋求既符合用戶需求又能提升效率的最佳方案。


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

用戶體驗一致性思考

鶴鶴

前言
在團隊內(nèi)部,我們已確立了一套設(shè)計規(guī)范,在日常項目中使用設(shè)計規(guī)范輸出變的高效、統(tǒng)一。然而,在實際操作中,不可避免地會遇到一些特殊情況:某些客戶提出的個性化需求并不完全契合既定的設(shè)計規(guī)范,這些促使我們不得不在保持設(shè)計一致性的基礎(chǔ)上進行靈活調(diào)整。因此,深入反思并優(yōu)化一致性原則的應(yīng)用策略顯得尤為重要。我們需要探索如何在堅守設(shè)計規(guī)范核心精神的同時,靈活應(yīng)對多變的需求,確保設(shè)計既保持統(tǒng)一和諧,又能滿足特定場景下的獨特需求,從而實現(xiàn)用戶體驗與品牌價值的雙重提升。
 
用戶體驗一致性思考
 
 
用戶體驗一致性思考
 
 
在UI/UX設(shè)計中,雅各布·尼爾森的十條可用性原則中,一致性(Consistency and standards)位列第四。這一原則強調(diào)在界面和交互設(shè)計上需要遵循既定的規(guī)則,無論是在應(yīng)用內(nèi)部還是跨平臺之間。
背后的心理學(xué)原理——重復(fù)定律,強調(diào)了信息重復(fù)對于鞏固記憶的重要性。正如赫爾曼·艾賓浩斯通過“遺忘曲線”所揭示的,信息的有效保留離不開重復(fù)接觸。一致性的應(yīng)用正是這一原理的生動實踐,通過不斷重復(fù)統(tǒng)一的設(shè)計元素與模式,強化用戶對產(chǎn)品的認知與記憶,從而提升整體的用戶滿意度與忠誠度。
艾賓浩斯遺忘曲線
艾賓浩斯遺忘曲線
 
用戶體驗一致性思考
 
 
用戶側(cè)
1、用戶學(xué)習(xí)曲線:
一致的UI/UX設(shè)計可以降低用戶的學(xué)習(xí)曲線。當用戶在應(yīng)用程序或網(wǎng)站中遇到一致的元素、布局和交互方式時,他們可以快速理解并準確預(yù)測如何與界面進行交互。這減少了用戶的混淆和困惑,提高了他們的效率和滿意度。
2、提升可用性:
一致性使用戶界面更加易于使用。當用戶在不同的頁面或功能之間找到相似的設(shè)計元素和交互模式時,他們可以輕松地將已有的知識和經(jīng)驗應(yīng)用于新的情境中。這種一致性幫助用戶快速完成任務(wù),減少錯誤和迷失,提供更好的導(dǎo)航和流暢的體驗。
3、品牌認可度:
一致的UI/UX設(shè)計有助于樹立品牌形象和增強品牌認可度。通過在不同的渠道和平臺上保持一致的設(shè)計元素、標識和視覺風(fēng)格,品牌可以建立起獨特而可識別的形象。用戶在不同的觸點上都能感受到品牌的一致性,從而增加品牌的信任和忠誠度。
4、用戶滿意度:
一致性直接影響用戶的滿意度。當用戶在使用應(yīng)用程序或網(wǎng)站時感受到一致的設(shè)計和交互方式時,他們會感到更加舒適和自信。一致性傳遞了專業(yè)和質(zhì)量的信號,讓用戶感到被關(guān)注和重視。這種積極的用戶體驗有助于提升用戶滿意度,并促使他們持續(xù)使用和推薦你的產(chǎn)品或服務(wù)。
 
用戶體驗一致性思考
 
 
產(chǎn)研側(cè)
1. 降低設(shè)計成本,提高開發(fā)效率
無論是設(shè)計還是開發(fā),復(fù)用已有的組件資源,保持界面的一致性可以有效地減少設(shè)計的投入,避免不必要的設(shè)計分歧點。
而在開發(fā)階段,可以避免重復(fù)造輪子,提高開發(fā)的效率,保證落地效果,也可以減少上線前設(shè)計走查、測試的工作量。
2. 形成一致的設(shè)計風(fēng)格
根據(jù)原子設(shè)計理論,通過原子組件的一致性,可以構(gòu)建出統(tǒng)一的界面框架、布局,形成統(tǒng)一風(fēng)格和用戶交互認知,從而更好地保證用戶體驗質(zhì)量。
 
用戶體驗一致性思考
 
 
色彩
色彩作為一種兼具物理屬性與感官享受的復(fù)雜現(xiàn)象,其本質(zhì)在于光波在人體視網(wǎng)膜上的特定波長被反射或吸收后,所引發(fā)的視覺感知結(jié)果。在設(shè)計領(lǐng)域,色彩的選擇與運用不僅是視覺藝術(shù)的展現(xiàn),更是品牌身份與個性的直接體現(xiàn)。諸如餓了么標志性的藍色、美團鮮明的黃色、以及京東熱情的紅色等,這些品牌專屬色彩不僅構(gòu)成了品牌識別系統(tǒng)的重要組成部分,還通過其高度的一致性,在視覺層面上構(gòu)建起強烈的品牌認知,營造出統(tǒng)一和諧的視覺體驗。
色彩的一致性策略在品牌塑造中發(fā)揮著不可估量的作用,它能夠有效增強品牌的記憶度與辨識度,深化品牌形象在消費者心中的烙印,進而提升產(chǎn)品的市場吸引力和用戶忠誠度。同時,這種策略還促進了設(shè)計元素間的和諧共存,包括按鈕、圖標、字體、標簽、背景、以及關(guān)鍵視覺元素如Banner等,均能在統(tǒng)一的色彩體系下實現(xiàn)視覺上的連貫與流暢,極大地提升了產(chǎn)品的可用性、無障礙性,以及用戶在使用過程中的整體滿意度與交互體驗。
 
用戶體驗一致性思考
 
 
字體
字體作為設(shè)計中不可或缺的核心要素,其獨特性在于能夠精準地塑造文字的視覺形象,涵蓋形狀、尺寸、粗細、字間距等多維度特征。這些特征共同構(gòu)建了一種獨特的文字風(fēng)格,不僅承載著信息的傳遞功能,更在無形中引導(dǎo)著用戶的視覺流程,影響著信息的接收與理解深度。因此,在設(shè)計過程中,合理選擇與應(yīng)用字體顯得尤為關(guān)鍵。
 
字體類型的多樣性,如有襯線字體與無襯線字體的對比,不僅體現(xiàn)了風(fēng)格上的差異,還隱含了不同的閱讀體驗與情感表達。字體的粗細變化(如細體、常規(guī)、粗體等)更是能夠強調(diào)文本的重要性層級,增強信息的層次感與可讀性。此外,字重的調(diào)整也是塑造視覺焦點、引導(dǎo)視線流動的有效手段,對于提升設(shè)計的整體美觀度和信息傳達效率具有不可小覷的作用。
 
然而,在實際的開發(fā)與實現(xiàn)過程中,若不加節(jié)制地使用多種字體,不僅會顯著增加頁面的加載時間,影響用戶體驗的流暢性,還可能因風(fēng)格不統(tǒng)一而導(dǎo)致頁面顯得雜亂無章,破壞整體設(shè)計的和諧感。因此,制定一套統(tǒng)一、規(guī)范的字體使用策略顯得尤為重要。這不僅有助于提升開發(fā)效率,減少后期更新迭代的復(fù)雜度,還能有效避免資源浪費,確保設(shè)計作品在視覺上的一致性與專業(yè)性。
 
用戶體驗一致性思考
 
 
圖標
 
圖標作為用戶界面設(shè)計中至關(guān)重要的元素,風(fēng)格直接影響到用戶的使用體驗與對產(chǎn)品的整體印象。圖標以其簡潔、直觀且富有表現(xiàn)力的特點,在快速傳達信息、引導(dǎo)用戶操作方面發(fā)揮著不可替代的作用。在設(shè)計中,圖標的設(shè)計與應(yīng)用更是需要精心考量,以確保其既能夠準確傳達信息,又能夠與整體設(shè)計風(fēng)格保持一致,從而營造出專業(yè)、和諧且易于使用的界面環(huán)境。
 
設(shè)計中視覺上保持統(tǒng)一包括圖標的大小、形狀、色彩以及設(shè)計風(fēng)格等多個方面,能夠增強用戶的認知連貫性,降低學(xué)習(xí)成本,提升使用效率。相反,如果圖標風(fēng)格混雜,不僅會讓界面顯得雜亂無章,還會給用戶帶來困惑和不安,進而影響其對產(chǎn)品專業(yè)性和安全性的信任。
用戶體驗一致性思考
 
 
按鈕
按鈕設(shè)計應(yīng)統(tǒng)一于項目風(fēng)格,無論是圓形、矩形、圓角矩形還是特定形狀,保持一致性是關(guān)鍵。統(tǒng)一的按鈕樣式不僅彰顯專業(yè)性,還能增強用戶信任,確保體驗連貫。過多變化的按鈕樣式會擾亂用戶界面,降低操作直觀性,甚至讓用戶誤以為自己已離開應(yīng)用環(huán)境。因此,精心設(shè)計的統(tǒng)一按鈕樣式對提升用戶體驗至關(guān)重要。
 
排版
設(shè)計中的排版一致性對于構(gòu)建高效、用戶友好的界面至關(guān)重要。一致的排版不僅能夠讓用戶快速適應(yīng)和理解界面的整體結(jié)構(gòu),大幅降低學(xué)習(xí)成本,還能在用戶心中激發(fā)強烈的歸屬感和安全感。這種熟悉感使得內(nèi)容更加易讀,用戶能夠自然地依照既定的視覺動線流暢地瀏覽頁面,迅速定位并獲取所需信息,從而顯著提升信息獲取的效率。因此,在設(shè)計過程中,注重并維護排版的一致性,是提升用戶體驗和界面有效性的重要策略之一。
 
 
用戶體驗一致性思考
 
 
 
操作流程的一致性
標準化流程
:確保用戶在執(zhí)行相似任務(wù)時,如購買商品、搜索信息或提交表單等,能夠遵循相同的操作流程。這有助于用戶快速適應(yīng)并高效完成任務(wù)。
邏輯清晰
:操作流程的每一步都應(yīng)符合用戶的認知習(xí)慣和行為邏輯,避免讓用戶感到困惑或不知所措。
用戶體驗一致性思考
 
 
交互元素的一致性
按鈕和控件
:確保按鈕、輸入框、下拉菜單等交互元素的樣式、位置和操作方式在整個應(yīng)用或網(wǎng)站中保持一致。例如,所有按鈕都應(yīng)具有相同的視覺風(fēng)格和觸發(fā)機制。
導(dǎo)航和菜單
:導(dǎo)航欄和菜單的設(shè)計也應(yīng)保持一致,使用戶能夠輕松地在不同頁面或功能之間切換。
 
用戶體驗一致性思考
 
 
反饋機制的一致性
操作反饋
:當用戶執(zhí)行某個操作時,應(yīng)用或網(wǎng)站應(yīng)提供一致且及時的反饋,如加載動畫、成功提示或錯誤消息等。這有助于用戶了解操作結(jié)果并采取相應(yīng)的行動。
狀態(tài)提示
:對于長時間運行的操作或需要用戶等待的場景,應(yīng)提供明確的狀態(tài)提示(如進度條),以減輕用戶的不確定感和焦慮感。
 
 
 
 
 
 
在任何維度上,一致性不應(yīng)成為設(shè)計的唯一導(dǎo)向。設(shè)計,這一融合了藝術(shù)與科學(xué)的復(fù)雜領(lǐng)域,要求我們在用戶體驗的細膩雕琢、功能需求的精準滿足、美學(xué)價值的深刻體現(xiàn)及技術(shù)可行性的嚴格考量間游走。
 
“一致性”作為設(shè)計策略,其核心使命在于優(yōu)化用戶路徑,降低認知門檻,確保用戶在多元界面中穿梭時仍能感受到連貫與和諧。當我們在與設(shè)計團隊(包括工程師、產(chǎn)品經(jīng)理等)溝通時,僅僅提及“一致性”可能并不足以說明其必要性和價值。我們需要更深入地闡述為什么需要保持一致性,以及它如何具體幫助減少用戶困惑、提高用戶滿意度和忠誠度。
 
同時,我們應(yīng)清醒認識到,“一致性”并不是萬能的。在某些情況下,為了追求極致的用戶體驗或解決特定的設(shè)計問題,可能需要打破傳統(tǒng)的一致性規(guī)則。因此,設(shè)計師需要在保持一致性和創(chuàng)新之間找到平衡點,根據(jù)具體情況靈活調(diào)整設(shè)計方案。
 
實際落地執(zhí)行時,要根據(jù)產(chǎn)品定位、用戶場景,結(jié)合業(yè)務(wù)功能來確定設(shè)計方案,不能為了一致而一致。
當我們遇到一致性問題時,還是需要從以下3個方面深入思考,做出準確合理的設(shè)計決策。
用戶體驗一致性思考
 
 
真實項目
真實項目
 
在SaaS產(chǎn)品設(shè)計中,特別是面向B/G端(企業(yè)用戶)時,滿足不同用戶角色(如普通用戶與高權(quán)限領(lǐng)導(dǎo))的需求是至關(guān)重要的。
管理端布局設(shè)計
普通簡潔明了
:為普通用戶設(shè)計的管理界面應(yīng)簡潔直觀,聚焦于日常操作,如數(shù)據(jù)查看、統(tǒng)計和下載。
功能分區(qū)
:通過清晰的導(dǎo)航欄或側(cè)邊欄將功能區(qū)域劃分開,如“數(shù)據(jù)概覽”、“報表下載”、“任務(wù)管理”等,便于用戶快速定位所需功能。
操作便捷
:確保常用操作(如搜索、篩選、排序)易于觸達,減少用戶點擊次數(shù)和頁面跳轉(zhuǎn)。
 
首頁版心定寬設(shè)計
固定寬度
:為首頁設(shè)定一個合適的固定寬度(如1200px、1440px等),以保證內(nèi)容在大多數(shù)屏幕上都能保持一致的閱讀體驗。
信息模塊化
:將首頁內(nèi)容劃分為多個卡片,每個卡片承載一個獨立的信息單元(如數(shù)據(jù)報表、通知公告、項目進展等)。
視覺層次
:通過顏色、大小、陰影等設(shè)計元素區(qū)分卡片的重要性,引導(dǎo)用戶視線,提高信息獲取效率。
交互性
:為卡片添加交互元素,如點擊展開、滑動查看更多等,增加用戶參與度和頁面活躍度。
 
用戶體驗一致性思考
 
 
位置差異性分析
根據(jù)「認知負荷>視覺負荷>動作負荷」理論,在頁面中我們首先要讓用戶能夠找到按鈕,然后完成操作。
相對于彈窗,頁面的空間更大,邊界感偏弱,用戶的視覺重心更容易停留在左側(cè)表單內(nèi)容區(qū)域。所以按鈕應(yīng)該緊隨搜索條件,便于用戶快速發(fā)現(xiàn)按鈕。
區(qū)域用戶已經(jīng)形成下意識操作習(xí)慣,雖然區(qū)別于規(guī)范,只能打破,遵循客戶需求
用戶體驗一致性思考
 
 
一致性是規(guī)則
“一致性”作為規(guī)則或手段,服務(wù)于提升用戶體驗的原則。規(guī)則與原則一致時,促進業(yè)務(wù)共識與用戶價值;沖突時,原則優(yōu)先。用戶體驗原則指導(dǎo)下的一致性,要超越表面控件統(tǒng)一,更在于產(chǎn)品決策與價值取向的一致。必要時,為更好的用戶體驗,可在規(guī)則上讓步以實現(xiàn)原則統(tǒng)一。打破規(guī)則需慎重權(quán)衡,確保用戶便利足以彌補理解成本,需長期全局考量。規(guī)則非僵化教條,而是引導(dǎo)我們謹慎創(chuàng)新的框架。
 
一致性的底線
無論從哪個角度,一致性存在的必要性都是毋庸置疑的。
對于關(guān)鍵的設(shè)計元素,如專有名詞和顏色體系,保持一致性至關(guān)重要。這不僅有助于維護品牌形象,還能減少用戶的困惑。
特定設(shè)計語言在特定場景下的變體應(yīng)用,雖然可能帶來一定的視覺新鮮感或針對性優(yōu)化,但往往需要謹慎評估其潛在風(fēng)險。一旦變體打破了整體設(shè)計的一致性,可能會破壞用戶對品牌的熟悉感和信任感,甚至引發(fā)誤解。因此,在追求設(shè)計創(chuàng)新的同時,必須確保這種創(chuàng)新是基于一致性的原則之上,以維持品牌的整體性和用戶的良好體驗。
 
擁抱復(fù)雜性
一致性確實不應(yīng)成為設(shè)計師的避風(fēng)港或限制創(chuàng)新的枷鎖,而應(yīng)是基于對業(yè)務(wù)深刻理解和多樣化設(shè)計能力之上的價值選擇。設(shè)計師的核心任務(wù)始終是滿足用戶的多樣化需求和偏好,這需要他們細致入微地觀察、理解并解決每個用戶的獨特問題。
 
在追求一致性的同時,設(shè)計師應(yīng)保持“第一性思考”的能力,即回歸問題的本質(zhì),從用戶需求出發(fā)進行創(chuàng)新設(shè)計。多樣性頁面的產(chǎn)出,不僅體現(xiàn)了設(shè)計師的創(chuàng)造力和靈活性,也是提升用戶體驗、增強產(chǎn)品吸引力的關(guān)鍵。
 
一致性與創(chuàng)新設(shè)計并非相互排斥,而是相輔相成的關(guān)系。真正的一致性不應(yīng)導(dǎo)致單調(diào)或拒絕創(chuàng)新,而應(yīng)是在遵循品牌或產(chǎn)品核心價值的前提下,鼓勵設(shè)計師在細節(jié)和體驗上不斷探索和突破。當設(shè)計師感到被既定規(guī)則束縛時,應(yīng)勇于質(zhì)疑并重新評估當前的規(guī)范,確保所謂的“一致性”不是刻板的偽命題,而是真正符合用戶需求和品牌發(fā)展的價值導(dǎo)向。
 
因此,設(shè)計師應(yīng)時刻保持開放的心態(tài)和敏銳的洞察力,不斷探索和嘗試新的設(shè)計方法和理念,以更加靈活和創(chuàng)新的方式實現(xiàn)一致性與用戶需求的完美融合。
 
用戶體驗一致性思考
 
 
重要的設(shè)計原則
「一致性」作為設(shè)計領(lǐng)域中的一項基礎(chǔ)性原則,其重要性不言而喻。它不僅為設(shè)計過程提供了穩(wěn)固的基石,還顯著促進了開發(fā)效率與產(chǎn)品體驗的全面升級。在設(shè)計實踐中,一致性確保了界面元素的統(tǒng)一性和連貫性,使得用戶能夠迅速熟悉并掌握產(chǎn)品的使用方式,降低了學(xué)習(xí)成本,增強了操作的直觀性和便捷性。
靈活變通使用
一致性原則并非一成不變的強制規(guī)定,而是需要根據(jù)產(chǎn)品的具體定位和市場環(huán)境進行靈活變通的應(yīng)用。不同的產(chǎn)品可能面向不同的用戶群體,擁有獨特的品牌調(diào)性和功能需求,因此在追求一致性的同時,也需充分考慮這些因素,確保設(shè)計既符合品牌特色,又能滿足用戶的實際需求。
 
提升用戶體驗是價值所在
一致性的真正價值在于其能夠顯著提升用戶體驗。通過遵循用戶的認知和習(xí)慣,設(shè)計師能夠創(chuàng)造出更加自然、流暢的操作流程,使用戶在享受產(chǎn)品功能的同時,也能感受到品牌所傳遞的舒適與和諧。因此,在追求設(shè)計一致性的過程中,我們始終應(yīng)以人為本,將用戶的體驗和感受放在首位。建設(shè)有兼容性和長期價值的的一致性框架,在一致性中做到有用戶價值的設(shè)計,是設(shè)計師應(yīng)該不斷探索的命題。
 
 


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

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢、UI設(shè)計服務(wù)公司軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司、UI交互設(shè)計公司、數(shù)據(jù)可視化設(shè)計公司、用戶體驗公司、高端網(wǎng)站設(shè)計公司、銀行金融軟件UI界面設(shè)計能源及監(jiān)控軟件UI界面設(shè)計、氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)軟件wpf開發(fā)、軟件vue開發(fā)

 

打動人心的直覺設(shè)計

鶴鶴

前言
之所以對“直覺設(shè)計”產(chǎn)生興趣還要源于我們每次的設(shè)計評審,在跟其他設(shè)計師還有我們的業(yè)務(wù)方溝通時,大家常常會問到的且令人印象深刻的問題是:
 
“用戶怎么知道點哪里?”、“這符合用戶直覺嗎?”
 
類似的靈魂拷問涉及到用戶使用工具產(chǎn)品行為流程的每一步操作。作為設(shè)計師大家有時也會心生質(zhì)疑,“這么明顯用戶注意不到嗎?這么簡單用戶不可能不會操作吧...”。
 
但是隨著我們的”新手體驗官活動“的逐步進行,當親自站在用戶面前觀察用戶是如何操作和理解工具時,我們漸漸意識到小白用戶
 接觸-認知-使用工具
的每一環(huán)都是至關(guān)重要的,即便是一個交互細節(jié)的設(shè)計都有可能帶來認知和操作層面受阻,從而勸退用戶。
 
因此,我們想去了解什么樣的設(shè)計是符合用戶直覺的,是易用的,同時也想去了解主流3D建模軟件的核心建模邏輯(SU、Revit為代表)--于是開始了“直覺設(shè)計”的研究以及“建模課程”的學(xué)習(xí)。
打動人心的直覺設(shè)計
 
 
 
1、什么是直覺設(shè)計?
首先來看什么是直覺設(shè)計,直覺設(shè)計是指用戶無需進行有意識的思考就可以立即理解并知道如何去使用產(chǎn)品。國外有不少的用戶研究機構(gòu)也專門定義過直覺設(shè)計:
 
“在特定任務(wù)的背景下,技術(shù)系統(tǒng)可以直觀地使用,而特定用戶能夠有效地交互,而不是有意識地使用先前的知識。”– 用戶界面的直觀使用 (IUUI) 研究小組。一個由跨學(xué)科研究人員組成的團隊,致力于探索如何定義直觀的使用和界面。
 
為了方便大家更好的理解直覺設(shè)計,我們先來看幾個例子:
打動人心的直覺設(shè)計
 
 
 
案例1-玩具收納:小朋友在玩完玩具以后,把玩具擺的到處都是,如果發(fā)號施令告訴小朋友“去把玩具收拾起來”,小朋友通常不會去收拾。如果將收納設(shè)計成為一種小游戲,小朋友會自然而然的參與其中并且會覺得非常有趣。
案例2-公共環(huán)境衛(wèi)生:保持小便池的清潔,張貼告示語“注意保持清潔”大多是沒有用的。荷蘭的設(shè)計師在公共的男士小便池里設(shè)計了一個“蒼蠅”,利用人們的嫌惡心理會發(fā)現(xiàn)小便時會不由自主的對準中心的位置,從而減少尿液四濺,維護公共環(huán)境衛(wèi)生。
案例3-公共設(shè)施:設(shè)有傳感器和揚聲器的臺階,人們只要踩上去就能聽到音樂聲,從而達到鼓勵人們爬樓梯的目標。
案例4-工業(yè)產(chǎn)品設(shè)計:很多耳熟能詳?shù)墓I(yè)產(chǎn)品中也運用了直覺設(shè)計,例如深澤直人的CD播放器,Apple的Vision OS系統(tǒng)等等。
案例5-游戲設(shè)計:游戲中非常多的運用了直覺設(shè)計,比如超級馬里奧,塞爾達,想必大家都深有感受。
 
通過上述案例我們發(fā)現(xiàn)其實直覺設(shè)計傳達出來是信息包含兩方面:用戶看到就能夠理解是什么,且能夠不由自主地產(chǎn)生行動。
打動人心的直覺設(shè)計
 
 
 
看到這里,大家可能會好奇為什么會產(chǎn)生這種”直覺設(shè)計“?接下來讓我們一起來看看直覺設(shè)計是如何產(chǎn)生的。
 
2、直覺設(shè)計如何產(chǎn)生?
人的直覺設(shè)計是怎么來的?是天生的嗎?帶著這樣的疑惑,我們閱讀了相關(guān)書籍和文章。
 
先天視覺和經(jīng)驗直覺
先天直覺,也可以說是”本我“,是最原始的”心理現(xiàn)實“,在個體從外部世界獲得經(jīng)驗之前就存在的內(nèi)部世界,不需要經(jīng)過學(xué)習(xí)或訓(xùn)練。比如嬰兒時期的特征,希望立刻得到滿足、躲避痛苦、強大的求生意愿等。
 
經(jīng)驗直覺,巴普洛夫的實驗想必大家都知道。有機體能夠把已有的經(jīng)驗遷移到新的學(xué)習(xí)環(huán)境中去,從而擴大學(xué)習(xí)范圍。
 
先天直覺一般對應(yīng)于人類的第一信號系統(tǒng),是建立在人的直接感覺上的,通過人的感覺(視覺、聽覺、觸覺等)而進行的一種思維活動;經(jīng)驗直覺(邏輯性直覺直覺)思維雖然利用了人類的感性認識(感覺、知覺、表象等)形式,但它絕不是僅僅停留在這一步上,而是超越了邏輯思維形式達到了更高一個層次上的思維。
 
從表面上看,邏輯性直覺的結(jié)果是以直觀的形式表現(xiàn)出來的,實際上它已經(jīng)在頭腦中進行了邏輯程序的高度壓縮,迅速地越過了“理性認識階段”,是簡縮了整個邏輯思維過程的一種思維形式。
所以,邏輯性直覺既源于感性認識,又高于感性認識,是一種常常能在極短的時間內(nèi)完成,并能夠?qū)栴}迅速作出回答的一種無意識的、躍進式的直覺形式。
 
構(gòu)建直覺,現(xiàn)有研究指出,分析加工和直覺加工兩者可能處于不斷的相互轉(zhuǎn)換之中。一方面,分析加工可以通過熟練化形成經(jīng)驗圖式,從而減少認知資源的消耗,并由此轉(zhuǎn)化為直覺加工;另一方面,當直覺加工無法通過已有經(jīng)驗解決新的問題情境時,又需要調(diào)動更多的認知資源并轉(zhuǎn)向分析加工,直到形成新的經(jīng)驗圖式。
 
先天直覺大家都容易理解,接下來我們重點看一下經(jīng)驗直覺是如何產(chǎn)生的?
 
經(jīng)驗直覺的產(chǎn)生與人生存的環(huán)境密切相關(guān),所以這里包含兩個關(guān)鍵點:物理世界(環(huán)境)和生活環(huán)境。
 
來自物理環(huán)境的經(jīng)驗
物理環(huán)境主要包括我們生存的自然環(huán)境,以及我們與物理環(huán)境的互動所形成的感官運動。人類在嬰兒時期就開始體驗和實驗物理環(huán)境。這種體驗建立在我們第一次拿著一個物體、第一次把它扔到地板上、第一次學(xué)會爬到我們最喜歡的玩具等時學(xué)到的基本感覺運動技能上。我們對物理世界的體驗它已成為日常生活的一部分。經(jīng)過物理環(huán)境互動所形成的直覺是跨越國界、且不會被遺忘的。
來自文化環(huán)境的經(jīng)驗
通俗的講指社會文化環(huán)境。它包括人類通過其獲得的知識和技術(shù)開發(fā)的所有物質(zhì)文化元素。例如,房屋、村莊、城鎮(zhèn)、公路和鐵路網(wǎng)絡(luò)、交通方式、工業(yè)單位、田野、醫(yī)院、體育場館、娛樂設(shè)施、市場、港口以及日常和特殊用途的物品。除此之外還包括價值觀念、道德信仰、語言、符號、審美觀念、風(fēng)俗習(xí)慣等各種規(guī)范。
 
例如播放圖標“?”是許多文化中的人們在年輕時學(xué)習(xí)符號的一個很好的例子。在任何可以使用媒體播放器的文化中,人們都知道 ? 圖標的含義。它的直觀性幾乎與物理世界中的對象行為一致。
 
因此,在媒體播放器中,人們理所當然的希望可以延續(xù)“?”符號的含義。來自文化環(huán)境的知識也可以變得很直觀,但是由于沒有來自物理世界的持續(xù)提醒之后,很容易被遺忘。
 
因此在提供直覺設(shè)計時,應(yīng)盡量符合用戶從物理世界中獲得的經(jīng)驗與技能。但如果我們的用戶群體是具有相同文化背景下的人群,符合文化環(huán)境的知識與經(jīng)驗也可以作為直觀設(shè)計的決策依據(jù)。
打動人心的直覺設(shè)計
 
 
 
3、為什么要符合直覺設(shè)計?
給用戶留下良好的第一印象,助力產(chǎn)品贏得并且留下用戶。
當我們開始使用某款產(chǎn)品時,用戶往往在幾秒內(nèi)就會產(chǎn)生第一印象并且往往會保持不變,少則幾分鐘多則十幾分鐘用戶就可感受到產(chǎn)品的價值。
 
渥太華卡雷頓大學(xué)的Gitte·Lindgaard和她的研究小組發(fā)現(xiàn):人類對事物的初始印象在50毫秒內(nèi)就會形成。研究小組準備了一批要么極易入眼要么混亂不堪的網(wǎng)頁,讓一批志愿者在快速變換中投票。雖然這些網(wǎng)頁以50毫秒每張的速度一閃而過,但是研究發(fā)現(xiàn)他們的評價與長時間觀察后的結(jié)果基本無異。
 
這就說明了用戶的第一印象非常明確且重要,幫助用戶判斷出這是否是一個設(shè)計合理的網(wǎng)站。如果用戶停留時間再長一點,那么用戶足以判斷出網(wǎng)站上的信息是否是滿足自己需要的信息,從而影響用戶是否繼續(xù)停留下來去使用該網(wǎng)站。
 
更容易讓用戶達到心流狀態(tài)、沉浸式的使用產(chǎn)品,并且持續(xù)吸引用戶使用產(chǎn)品。
符合用戶直覺的、熟悉的操作模式,作為用戶直觀使用的基礎(chǔ),更容易產(chǎn)生積極的審美評價。相反,如果用戶的認知流暢性受阻,則不太會產(chǎn)生正面積極的評價。簡潔有力的設(shè)計會促使用戶再次使用產(chǎn)品,是保持產(chǎn)品吸引力的最佳方式。
 
4、如何使設(shè)計符合用戶直覺?
因為工作中涉及到3D建模軟件的設(shè)計,所以這部分將結(jié)合3D建模軟件來探討。
 
如果您接觸過3D建模軟件,一定用過SU、Rhino吧,我們在使用后不久,就能清晰的感受到它們的核心邏輯,比如SU的推拉,Rhino的曲面建模等,進而能夠舉一反三的學(xué)會相關(guān)功能,使軟件的學(xué)習(xí)變得更簡單更直覺。那么怎樣的功能設(shè)計才能打造出軟件的核心邏輯,讓其在使用時更加符合用戶的直覺?
 
為了得到以上問題的答案,我們進行了SU和Revit這兩款建筑領(lǐng)域主流軟件的使用,感受兩款軟件在直覺設(shè)計方面的表現(xiàn),進而找到了一些設(shè)計原則指導(dǎo)我們在實際業(yè)務(wù)中應(yīng)用。
 
充分了解你的用戶
每個人在自己生活的世界里,都會形成自己的一些認知,這個前面也已經(jīng)介紹過。所以要充分了解用戶的知識、技能、經(jīng)驗,盡可能減少用戶當前具備知識與完成目標所需具備的知識之間的Gap。當用戶已具備的知識和完成目標需要的知識之間的差距越小,越符合用戶的直覺,越容易實現(xiàn)目標。
打動人心的直覺設(shè)計
 
 
SU和Revit都是充分了解自己的用戶,基于用戶群體的知識、技能、經(jīng)驗等特點,去打造自己軟件的核心邏輯,符合目標用戶群體的使用直覺。
SU 
 ▽
SU的Slogan 是“3D for Everyone“,人人可用。他的用戶群體非常廣泛,所以它是一個業(yè)務(wù)屬性較弱的工具,界面設(shè)計和操作使用上更簡單,普適性和靈活性更強。使用面作為基本單元建模,推拉面成體,推推拉拉就可以快速完成建模。對于小白來說很容易上手。
 
Revit  
Revit的用戶主要是專業(yè)的建筑師,場景聚焦在建筑相關(guān)領(lǐng)域,所以它是一個業(yè)務(wù)屬性較強的工具,將更多的業(yè)務(wù)場景包含在里面。比如標高、工作平面以及模塊化的構(gòu)件等,這樣的設(shè)定對于建筑背景的用戶來說,可以更符合他們的已有認知。
 
將從物理世界和文化環(huán)
前面反復(fù)提到過過,用戶總是利用她在物理和文化環(huán)境中的經(jīng)驗來了解她通過界面可以采取哪些行動。因此我們需要熟知用戶已有的這些經(jīng)驗,并考慮到設(shè)計中。
 
通過聯(lián)想或類比,將物理世界的經(jīng)驗運用到數(shù)字產(chǎn)品設(shè)計中,使得全新的事物變得熟悉。
 
SU 
 ▽
SU的圖標非常直觀好懂,比如畫筆、橡皮擦、油漆桶、量尺、放大鏡、材質(zhì)刷、垃圾桶等等,圖標的語意和其在物理世界的功能是相符的,哪怕是第一次接觸建模軟件的人,只看圖標也能大概猜出對應(yīng)的功能。
打動人心的直覺設(shè)計
 
 
 
Revit  
Revit將物理世界中房子映射到設(shè)計中。比如像墻、門、窗、柱、屋頂?shù)龋@是作為一個房子基本組成結(jié)構(gòu),對于建筑師來言,非常熟悉。所以在軟件設(shè)計中,功能也是基于這種具象的構(gòu)件分類的,在用戶使用之前,內(nèi)心已經(jīng)有了房子的認知,從而也能在產(chǎn)品中找到對應(yīng)的功能,理解成本很低。
 
打動人心的直覺設(shè)計
 
 
結(jié)合用戶在已有的文化環(huán)境中獲得的認知與經(jīng)驗:比如在類似產(chǎn)品中或你的產(chǎn)品所教給他的一些知識、經(jīng)驗,并保持這些經(jīng)驗的一致性。
 
SU 
 ▽
很好的匹配用戶已經(jīng)存在的認知。提及SU就會想到它的推拉交互,推拉面成體。一方面它底層的點線面邏輯是我們學(xué)習(xí)數(shù)學(xué)或繪畫最基礎(chǔ)的知識,幾乎人人都知道;另一方面推拉的操作也是和我們已有的推敲形體的過程體驗是一致的,我們在繪制草圖時,會在紙上勾勾畫畫,涂涂抹抹,這跟在SU上推推拉拉有異曲同工之妙,我們使在用它時能夠享受手繪一般的樂趣,很難忘記這個操作。
打動人心的直覺設(shè)計
 
 
Revit  
同為Autodesk公司產(chǎn)品,Revit的用戶與Autocad有著大量的重疊,因此在交互上也延用了不少CAD的固有邏輯,將用戶在CAD獲得的認知與經(jīng)驗沿用在這里。與AutoCAD一樣 ,Revit快捷鍵
是該命令英文單詞的第1個或前面2個字母,這使得用戶無需再學(xué)習(xí)。
 
以及為了讓用戶切換軟件成本最小,Revit中還支持一個指令可以設(shè)置多個快捷鍵,這樣可以兼容喜歡自定義快捷鍵的高階用戶的習(xí)慣。例如在AutoCAD里習(xí)慣用Ctrl+1 呼出屬性面板,而如果按 Revit 快捷鍵的邏輯則應(yīng)該是"屬性"英文取用 PP,對于已熟悉AutoCAD操作的用戶來說,這么高頻的指令改變會造成極大的不適應(yīng),默認兼容多個快捷鍵就是非常優(yōu)雅的解法。
打動人心的直覺設(shè)計
 
 
用戶認知和行為要足夠簡單
關(guān)于1+1=?,大家看到后會自然而然的想到答案;28×4=?,稍加思索也能給出答案;那么3927÷23=?,看到這個問題,可能幾乎沒有人想要解開了。有些問題無意識的解開了,有些問題看到就想放棄解答。由此可見改變?nèi)藗冃袨榉绞降耐ǔJ悄芊褡銐蚝唵魏腿菀?,當眼前的問題復(fù)雜時,人們不會試圖解決它。
 
SU 
 ▽
吸附非常的自然。當我想移動到某個位置的時候,很自然將鼠標靠近目標對象,就會幫我精準的吸附到對應(yīng)的位置
 
打動人心的直覺設(shè)計
 
 
補面非常簡單。當形體發(fā)生破面的時候,自然的想要繪制線去補全,當我沿著要補全的路徑繪制兩個點的時候,整個面被補好了。
打動人心的直覺設(shè)計
 
 
 
5、實戰(zhàn):應(yīng)用最佳設(shè)計原則
將我們在建模軟件中學(xué)習(xí)到的有助于直覺設(shè)計的內(nèi)容進行總結(jié),得出幾條原則,并將這些設(shè)計原則應(yīng)用到實踐當中,指導(dǎo)我們進行設(shè)計。
 
心理學(xué)中也提到,人的大腦處理不同的信息時所消耗的腦力資源是不同的,他們的排序是認知>視覺>行動。用戶花費的腦力資源要多于點擊按鈕或移動鼠標時(動作負荷)。所以我們在設(shè)計的時候,首先要從認知上降低用戶的認知負擔(dān),其次在行為上確保操作絲滑順暢。
 
認知上,降低認知負擔(dān)
提升信息的識別性。
比如位置、信息分組的邏輯、顏色、比例等的使用等。作為別墅設(shè)計軟件,在進行功能分類時,要以用戶使用的流程、場景,識別的效率等為依據(jù)進行合理分組。
打動人心的直覺設(shè)計
 
 
提高和用戶已有認知的匹配。
作為別墅設(shè)計軟件,設(shè)計要與用戶已有的對別墅對房子的認知相匹配。比如檐口線、浮雕、墻裙等構(gòu)件,人們在現(xiàn)實中的房子中都會見到,只是不熟知這些叫法。因此我們采用建造一個真實小房子的做法,當用戶點擊某個構(gòu)件,對應(yīng)的構(gòu)件就會在房子上高亮,用戶瞬間就會明白,哦原來是它,跟已有的認知匹配上了,會有一種恍然大悟的感覺。同時也讓用戶大概知道這個構(gòu)件位于房子的哪個位置,對后續(xù)的操作有預(yù)期,知道要擺在哪個位置。
打動人心的直覺設(shè)計
 
 
 
保持醫(yī)學(xué)認知的一致性。
任何產(chǎn)品都很難做到匹配用戶已有的所有認知,總會有一些內(nèi)容是需要重新學(xué)習(xí)獲得的,那么就要保證我們教給他的這些認知邏輯始終一致,讓用戶能做到舉一反三。作為別墅設(shè)計軟件,用戶要完成一個完整房子的建造,需要用到20+的構(gòu)件模塊,我們希望用戶學(xué)會使用一個構(gòu)件之后,就不需要再學(xué)習(xí),能觸類旁通的使用同類構(gòu)件。因此歸納出通用操作流程,找到相對統(tǒng)一的方式,串聯(lián)起我們用戶的心智。
打動人心的直覺設(shè)計
 
 
行為上,讓操作絲滑順暢
提供場景化的行為設(shè)計,并將操作聚焦在手邊。
在我們的別墅設(shè)計軟件中,當用戶要修改老虎窗和飄窗的時候,如果看到這個窗戶的樣式不是自己想要的,可能會想去繪制。按照我們現(xiàn)有的流程,用戶要先去左側(cè)面板找到自由繪窗入口,然后再選擇要在哪個面上繪制,操作流程是有點繞的。后面我們就想,用戶要修改這個窗子的時候,直覺上會去點擊它,那么在選中這個對象的時候,在手邊提供自由繪窗的入口,讓他能夠快速的綁定這個對象去繪制窗戶,操作上順暢了很多。
打動人心的直覺設(shè)計
 
 
一次只聚焦做一件事情,減少其他干擾。
我們現(xiàn)在的大部分操作,都是是激活命令后,左側(cè)面板還在。觀察到很多新用戶在激活了功能后,不知道下一步需要干什么。因為界面上需要他關(guān)注的事情太多了。所以,我們嘗試用戶在激活功能后,將當前步驟中不需要他關(guān)注的面板隱藏,聚焦到他當前需要做的事情上面去。
打動人心的直覺設(shè)計
 
 
操作要足夠簡單,簡單到不需要有太多思考,是一個自然而然的行為。
 
以下介紹的是我們的照片還原功能,對于外墻漆、門窗等用戶,他們可以現(xiàn)場拍好房子照片,導(dǎo)入后基于照片還原出別墅方案,再進行后續(xù)的外立面和門窗設(shè)計。最初,我們需要用戶手動擺放兩組消逝線去確定透視角度、然后調(diào)整比例尺、在尺子上選取點劃分樓層、拖拽點調(diào)整邊界、通過輸入開間數(shù)量確定開間。整個過程比較復(fù)雜,也涉及很多專業(yè)的概念,用戶不知道該如何操作。
 
后面優(yōu)化后,我們結(jié)合算法識別出照片中的房子,默認給一個box,用戶通過拖動box上的角點和邊線去調(diào)整整個形體。因為用戶對box的概念是熟悉的,拖拽box去擬合背后的照片就變得容易的多。樓層和開間的劃分也采用這種切豆腐塊的方式,用戶一下一下去切就好。不用再去輸入數(shù)字,想象會是什么樣子。而比例尺只需要用戶輸入他想要的1樓的高度即可確定。優(yōu)化后,生成方案的轉(zhuǎn)化率提升了將近20%。
 
打動人心的直覺設(shè)計
 
 
6、小結(jié)
直覺設(shè)計需要用戶看到產(chǎn)品時產(chǎn)生一種熟悉感,但是這種熟悉感判斷起來并不簡單,其中一部分人熟悉并不代表所有人都熟悉。所以設(shè)計師需要充分了解他們的用戶,了解產(chǎn)品的市場,并充分獲取用戶熟悉內(nèi)容的信息才有助于作出符合直覺設(shè)計的決策。
 
做出符合直覺的設(shè)計是困難的,需要充分考慮用戶在物理世界和文化環(huán)境中獲得的知識和經(jīng)驗,并將其應(yīng)用到具體的設(shè)計實踐中,也就是用戶的心智模型和產(chǎn)品概念模型達到基本吻合甚至去塑造與產(chǎn)品概念模型一致的用戶心智模型。
 
蘋果公司創(chuàng)始人兼前首席執(zhí)行官史蒂夫·喬布斯解釋說:“我們設(shè)計中最重要的是,必須讓事情直觀明顯。
 
打動人心的直覺設(shè)計
 
 
建議每一位設(shè)計師同學(xué)也多去感受和認識自己的知道,尤其是首次打開某個網(wǎng)站時,要更加關(guān)注自己的視覺動線和心理感受、無意識產(chǎn)生的操作行為等。同時也不要讓競品變成你的直覺,始終去思索有沒有體驗更加友好、創(chuàng)新的交互方式。
 
當然,連續(xù)的直覺操作也可能會讓用戶覺得疲倦,可以適時考慮引入驚喜設(shè)計,為用戶打造Amazing的感受。
  •  
    去認識和感受自己的直覺
  •  
    不要讓競品的設(shè)計變成你的直覺
  •  
    連續(xù)的直覺設(shè)計也可能也可能會給用戶帶來疲勞和厭倦,需要考慮在適當?shù)臅r候給用戶進喜設(shè)計。
 
本文在以下書籍和文章中予以引用,同時也推薦大家閱讀,想必大家對直覺設(shè)計會有更加深刻的認知和理解。
 
注意:文中數(shù)據(jù)皆為演示數(shù)據(jù),非業(yè)務(wù)真實數(shù)據(jù)
參考書籍:
  •  
    《創(chuàng)意選擇》
  •  
    《福格行為模型》
  •  
    《一目了然-Web軟件顯性設(shè)計之路》
  •  
    《峰值體驗-影響用戶決策的關(guān)鍵時刻》
  •  
    《任天堂的體驗設(shè)計-創(chuàng)造不知不覺打動人心的體驗》
  •  
    《玄機設(shè)計學(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
 
作者:藍胖、瑤一
 


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

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢UI設(shè)計服務(wù)公司、軟件界面設(shè)計公司、界面設(shè)計公司、UI設(shè)計公司、UI交互設(shè)計公司數(shù)據(jù)可視化設(shè)計公司、用戶體驗公司、高端網(wǎng)站設(shè)計公司、銀行金融軟件UI界面設(shè)計、能源及監(jiān)控軟件UI界面設(shè)計氣象行業(yè)UI界面設(shè)計、軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計航天軍工軟件UI界面設(shè)計、醫(yī)療行業(yè)軟件UI界面設(shè)計教育行業(yè)軟件UI界面設(shè)計、企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)、軟件wpf開發(fā)、軟件vue開發(fā)

 

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://www.xy78.cn

存檔