主頁 > 資料庫 > 袋鼠云數堆疊UI5.0體驗升級背后的故事:可用性原則與互動升級

袋鼠云數堆疊UI5.0體驗升級背后的故事:可用性原則與互動升級

2022-11-18 07:00:12 資料庫

最近,我們袋鼠云的UED部?小伙伴們,不聲不響地?了?件?事——升級了全新設計語言「數堆疊UI5.0」,

眾所周知,用戶在使用產品時,是一個動態的程序,用戶和產品之間進行互動的可用性,能否讓用戶愉悅、快速地在產品內達成目的,直接影響用戶使用產品的體驗,

在設計中,有一個廣泛的經驗法則被稱為「尼爾森十大可用性原則」,1995年由著名的人機互動學博士尼爾森發表,它是產品設計和?戶體驗設計的重要參考標準,這??原則在設計程序和落地中能都能很好的幫助設計師去提升產品互動體驗,

針對數堆疊現有產品存在的?些問題,?如同質化嚴重, 視覺不統?,?戶體驗差等,從視覺呈現到互動細節,結合這經典十大可用性原則,進行了重?的提升,

今天就給大家講講數堆疊UI5.0的煥新升級,究竟做了哪些事,

系統可?性原則(Visibility of system status)

系統要在適當的時間內給予用戶恰當的反饋,始終讓用戶知道當前正在發生什么,——尼爾森

可以理解為包括?戶在??上的任何操作,系統需要給出相應的反饋,來確保?戶在操作程序中的狀態可?、變化可?、內容可?,從?幫助?戶將互動引導到正確的?向,?不會浪費精?,

1)在數堆疊UI5.0中,通過按鈕互動狀態的變化,來回應?戶的操作?為

file

2)提交任務之后給出的適當反饋提示,明確任務?的是否成功,減少不確定性

file

3)在數堆疊UI5.0中,通過?戶操作后導航的顏?狀態區分,從?告知?戶當前所處的模塊

file

貼近場景原則(Match between system and the real world)

系統要使用用戶的語言,用戶熟悉的單詞、短語和概念,而不是系統術語,遵循現實世界的約定,使資訊以自然和合乎邏輯的順序出現,——尼爾森

“Match between system and the real world”——系統與現實世界之間的匹配,

?戶會習慣?現實世界中已有認知來看待問題,這個已有認知是?戶根據??掌握的經驗、知識和想象所建?的?智模型,?如在?彩運?上,綠?代表成功,紅?代表失敗,??代表警示,當?戶在看到這?種?彩時,會延續已有慣性的思維,

再?如圖示的設計,我們設計圖示時會按照實際事物來描繪圖形,?如垃圾桶的圖形表示洗掉,當我們在設計時如果遵循這種習慣,能夠很?程度上去降低?戶的認知成本,

file

可控性原則(User control and freedom)

當用戶錯誤地選擇了的某個功能后,系統需要提供一個明確的「緊急出口」,來讓用戶離開其不想要的狀態,而且無需額外的對話框,支持撤銷和重做,——尼爾森

可控是?種原則和框架,是指事物的發展在我們能夠預期和把握的范圍內,在?業務場景下,數堆疊選擇給?戶更多的選擇和控制的?由,增加?戶對于產品的“安全感”,從?塑造良好的體驗,

1)在數堆疊UI5.0中,當操作不可逆時,給予?戶?次確認的機會,避免?戶由于誤操作造成的后果

file

2)在數堆疊UI5.0中,當?戶在完成任務程序中,允許?戶回溯所做的選擇或退出流程

file

一致性原則(Consistency and standards)

我們不應當讓用戶去懷疑不同的陳述句、狀態或操作是否在表達同一件事,設計需遵循平臺的慣例,——尼爾森

?致性可以給?戶統?的認知,幫助?戶快速學習、記憶和熟悉產品的功能,從?建??戶穩定的?智模型,為了保障產品間的?戶體驗統?,通常都需要建?設計規范,來確保產品內部的?致性,這里的?致性包括視覺?致性、?為?致性和感知?致性,

數堆疊UI5.0在此次升級中建立了一套完整的設計規范體系,通過這套規范可以解決產品中的體驗問題, 并為產品設計提供指導原則,從而解決業務問題,

1)數堆疊UI5.0中的視覺?致性包括字體、顏?、尺?布局、圖示等,統?視覺使??井然有序

file

2)?為?致性體現在各種??控制元件布局、操作互動的?致性,??跳轉邏輯的?致性

file

3)感知?致性以及?本?致性

感知一致性:指位置?致性,確定、取消按鈕、保存,類似模塊的相同按鈕位置相似

文本一致性:提示語、操作提示、 功能按鈕、編輯提示

file

錯誤預防原則(Error prevention)

比報錯提示更好的方法是,通過嚴謹的設計來防止錯誤的發生:要么消除容易出錯的情況,要么把這些容易出錯的情況找出來,并在用戶采取行動之前提供確認選項,——尼爾森

在操作程序中?戶很難避免會出現錯誤操作,提前考慮到會影響?戶犯錯的原因,并提供正確的引導,能夠大大降低?戶的犯錯概率,同時在?戶操作錯誤時提供有效的解決措施來幫助?戶完成任務,在提升操作效率的同時,也能給?戶帶來安全感,這就好?你?在?個?字路?,清晰的指示牌可以避免你?錯路,

同時,文字提示(tooltip)在數堆疊UI5.0也被廣泛應用,主要用于適時的提醒以解決用戶的疑惑,而不打斷用戶的操作,

file

系統識別勝過記憶(Recognition rather than recall)

通過將物件、操作和選項進行可視化,最大限度地減輕用戶的記憶負擔,用戶不需要記住對話框中某一部分到另一部分的資訊,系統操作的指示資訊需要易于被用戶發現和獲取,——尼爾森

?戶是不可能記住操作程序中的過多資訊的,數堆疊在設計產品時就考慮到了需要減少?戶的記憶負擔,如在?戶重新編輯任務時記住?戶之前的操作記錄?不是清空;提供有效的提示資訊幫助?戶理解和記憶;可以的情況下,盡量讓?戶選擇?不是輸?,對?戶側??,選擇的操作成本肯定?輸?要低,

1)記住?戶操作歷史

“最近使?”按照項?打開時間由近?遠排序,?便?戶快速回到需要使?的項?

file

2)選擇?不是輸?

由于業務需要,數堆疊產品中會有?量表單內容需要?戶來操作,數堆疊UI5.0?選擇代替輸?可以減少?戶的記憶負擔,也能減少輸?錯誤等問題,可以有效的提升操作效率

file

使用的靈活性和效率(Flexibility and e?ciency of use)

一些快捷操作的功能,雖然會被新手用戶忽略,但可能為專家用戶所使用并幫助提升其使用效率,因此,系統需要同時滿足新手用戶和專家用戶的需求,允許用戶頻繁地操作,——尼爾森

關于這?點其實是在B端產品設計中?較容易忽視的?個原則,我們往往默認使?產品的業務?員是相對成熟的產品使?者,因為?部分?戶在進?產品后都會經過最初的產品培訓,從?成為中級?戶,

在《About Face 4:互動設計精髓》一書中有提到為中級?戶 優化設計,?多B端?戶既?新???專家,?是屬于中級?戶,當然不是說這樣就不需要在產品設計中考慮新??戶,反?更應該考慮如何在減少??培訓成本的條件下,幫助新?戶快速過渡到中級?戶,

數堆疊UI5.0選擇提供demo專案,來幫助用戶更快熟悉掌握產品,

file

美觀和簡約設計(Aesthetic and minimalist design)

對話框中不應包含無關或很少用到的資訊,在對話框中每增加一個資訊,就意味著降低了主要資訊的相對可見性,——尼爾森

視覺是互動設計中?關重要的?點,對于體驗本身,視覺的感知是最直觀的呈現?式,?往往會對好的設計有更?的包容性,

在??的設計中,視覺的層次可以有效的引導?戶操作路徑,良好的視覺層次結構可以提?相應??的可?性,?如格式塔視覺理論中提到的接近性原則:位置緊密的元素看起來是相關的,當將某些元素放在?起時,我們就向?戶提供了?個清晰的信號,說明物件是相關的,

1)視覺效果可以建立良好的第一印象

file

2)視覺的層次可以有效的引導用戶操作路徑,在數堆疊UI5.0中,根據資訊的關聯性布局,形成分組暗示

file

幫助?戶發現、判斷和修復錯誤(Help users recognize, diagnose,and recover from errors)

報錯資訊應該用通俗易懂的語言表達,而不是用代碼,準確地反應問題,并且提出可行的解決方案,——尼爾森

?戶在產品使?中經常會遇到操作錯誤,給予合理的錯誤提示可以幫助?戶快速解決問題,例如填寫表單時校驗資訊,用簡潔的語言解釋錯誤資訊,指出問題并提供有效解決方案,

file

幫助檔案(Help and documentation)

幫助檔案的資訊應該易于被搜索,聚焦于用戶的任務,并列出具體的步驟,而且,不能太龐大,——尼爾森

對于數堆疊這類業務性較強的產品來說,幫助?檔是必不可少的存在,它能夠幫助?戶更加快速的了解產品,同時也需要在??上提供資訊提示來幫助?戶完成任務,常?的如tooltip,較為輕量化的互動形式,需要?戶主動去觸發喚起,不打斷?戶的正常操作流程,

數堆疊UI5.0采用圖文方式提供功能介紹,幫助用戶更好的理解功能,

file

寫在最后(Conclusion part)

我們以往常說B端產品重功能,C端產品重互動,但隨著互聯?的“內卷”,B端的互動體驗現在也越來越受到重視,

本次數堆疊UI5.0全面煥新升級,不但要滿?當下的新功能需求,同時也在思考重新設計的內容能否為之后的業務拓展做到更強的兼容性,這也需要我們不斷地去進行探索和優化,

未來數堆疊也將從更多的細節中去提升互動體驗,來幫助我們的客戶更加?效的完成任務,給大家帶來更加好用的功能和體驗,

想了解或咨詢更多有關袋鼠云大資料產品、行業解決方案、客戶案例的朋友,瀏覽袋鼠云官網:https://www.dtstack.com/?src=https://www.cnblogs.com/DTinsight/p/szbky

同時,歡迎對大資料開源專案有興趣的同學加入「袋鼠云開源框架釘釘技術qun」,交流最新開源技術資訊,qun號碼:30537511,專案地址:https://github.com/DTStack/Taier

轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/536056.html

標籤:大數據

上一篇:React-移動到另一個html頁面-有條件的if

下一篇:大資料技術的現狀與面臨的挑戰

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • GPU虛擬機創建時間深度優化

    **?桔妹導讀:**GPU虛擬機實體創建速度慢是公有云面臨的普遍問題,由于通常情況下創建虛擬機屬于低頻操作而未引起業界的重視,實際生產中還是存在對GPU實體創建時間有苛刻要求的業務場景。本文將介紹滴滴云在解決該問題時的思路、方法、并展示最終的優化成果。 從公有云服務商那里購買過虛擬主機的資深用戶,一 ......

    uj5u.com 2020-09-10 06:09:13 more
  • 可編程網卡芯片在滴滴云網路的應用實踐

    **?桔妹導讀:**隨著云規模不斷擴大以及業務層面對延遲、帶寬的要求越來越高,采用DPDK 加速網路報文處理的方式在橫向縱向擴展都出現了局限性。可編程芯片成為業界熱點。本文主要講述了可編程網卡芯片在滴滴云網路中的應用實踐,遇到的問題、帶來的收益以及開源社區貢獻。 #1. 資料中心面臨的問題 隨著滴滴 ......

    uj5u.com 2020-09-10 06:10:21 more
  • 滴滴資料通道服務演進之路

    **?桔妹導讀:**滴滴資料通道引擎承載著全公司的資料同步,為下游實時和離線場景提供了必不可少的源資料。隨著任務量的不斷增加,資料通道的整體架構也隨之發生改變。本文介紹了滴滴資料通道的發展歷程,遇到的問題以及今后的規劃。 #1. 背景 資料,對于任何一家互聯網公司來說都是非常重要的資產,公司的大資料 ......

    uj5u.com 2020-09-10 06:11:05 more
  • 滴滴AI Labs斬獲國際機器翻譯大賽中譯英方向世界第三

    **桔妹導讀:**深耕人工智能領域,致力于探索AI讓出行更美好的滴滴AI Labs再次斬獲國際大獎,這次獲獎的專案是什么呢?一起來看看詳細報道吧! 近日,由國際計算語言學協會ACL(The Association for Computational Linguistics)舉辦的世界最具影響力的機器 ......

    uj5u.com 2020-09-10 06:11:29 more
  • MPP (Massively Parallel Processing)大規模并行處理

    1、什么是mpp? MPP (Massively Parallel Processing),即大規模并行處理,在資料庫非共享集群中,每個節點都有獨立的磁盤存盤系統和記憶體系統,業務資料根據資料庫模型和應用特點劃分到各個節點上,每臺資料節點通過專用網路或者商業通用網路互相連接,彼此協同計算,作為整體提供 ......

    uj5u.com 2020-09-10 06:11:41 more
  • 滴滴資料倉庫指標體系建設實踐

    **桔妹導讀:**指標體系是什么?如何使用OSM模型和AARRR模型搭建指標體系?如何統一流程、規范化、工具化管理指標體系?本文會對建設的方法論結合滴滴資料指標體系建設實踐進行解答分析。 #1. 什么是指標體系 ##1.1 指標體系定義 指標體系是將零散單點的具有相互聯系的指標,系統化的組織起來,通 ......

    uj5u.com 2020-09-10 06:12:52 more
  • 單表千萬行資料庫 LIKE 搜索優化手記

    我們經常在資料庫中使用 LIKE 運算子來完成對資料的模糊搜索,LIKE 運算子用于在 WHERE 子句中搜索列中的指定模式。 如果需要查找客戶表中所有姓氏是“張”的資料,可以使用下面的 SQL 陳述句: SELECT * FROM Customer WHERE Name LIKE '張%' 如果需要 ......

    uj5u.com 2020-09-10 06:13:25 more
  • 滴滴Ceph分布式存盤系統優化之鎖優化

    **桔妹導讀:**Ceph是國際知名的開源分布式存盤系統,在工業界和學術界都有著重要的影響。Ceph的架構和演算法設計發表在國際系統領域頂級會議OSDI、SOSP、SC等上。Ceph社區得到Red Hat、SUSE、Intel等大公司的大力支持。Ceph是國際云計算領域應用最廣泛的開源分布式存盤系統, ......

    uj5u.com 2020-09-10 06:14:51 more
  • es~通過ElasticsearchTemplate進行聚合~嵌套聚合

    之前寫過《es~通過ElasticsearchTemplate進行聚合操作》的文章,這一次主要寫一個嵌套的聚合,例如先對sex集合,再對desc聚合,最后再對age求和,共三層嵌套。 Aggregations的部分特性類似于SQL語言中的group by,avg,sum等函式,Aggregation ......

    uj5u.com 2020-09-10 06:14:59 more
  • 爬蟲日志監控 -- Elastc Stack(ELK)部署

    傻瓜式部署,只需替換IP與用戶 導讀: 現ELK四大組件分別為:Elasticsearch(核心)、logstash(處理)、filebeat(采集)、kibana(可視化) 下載均在https://www.elastic.co/cn/downloads/下tar包,各組件版本最好一致,配合fdm會 ......

    uj5u.com 2020-09-10 06:15:05 more
最新发布
  • day02-2-商鋪查詢快取

    功能02-商鋪查詢快取 3.商鋪詳情快取查詢 3.1什么是快取? 快取就是資料交換的緩沖區(稱作Cache),是存盤資料的臨時地方,一般讀寫性能較高。 快取的作用: 降低后端負載 提高讀寫效率,降低回應時間 快取的成本: 資料一致性成本 代碼維護成本 運維成本 3.2需求說明 如下,當我們點擊商店詳 ......

    uj5u.com 2023-04-20 08:33:24 more
  • MySQL中binlog備份腳本分享

    關于MySQL的二進制日志(binlog),我們都知道二進制日志(binlog)非常重要,尤其當你需要point to point災難恢復的時侯,所以我們要對其進行備份。關于二進制日志(binlog)的備份,可以基于flush logs方式先切換binlog,然后拷貝&壓縮到到遠程服務器或本地服務器 ......

    uj5u.com 2023-04-20 08:28:06 more
  • day02-短信登錄

    功能實作02 2.功能01-短信登錄 2.1基于Session實作登錄 2.1.1思路分析 2.1.2代碼實作 2.1.2.1發送短信驗證碼 發送短信驗證碼: 發送驗證碼的介面為:http://127.0.0.1:8080/api/user/code?phone=xxxxx<手機號> 請求方式:PO ......

    uj5u.com 2023-04-20 08:27:27 more
  • 快取與資料庫雙寫一致性幾種策略分析

    本文將對幾種快取與資料庫保證資料一致性的使用方式進行分析。為保證高并發性能,以下分析場景不考慮執行的原子性及加鎖等強一致性要求的場景,僅追求最終一致性。 ......

    uj5u.com 2023-04-20 08:26:48 more
  • sql陳述句優化

    問題查找及措施 問題查找 需要找到具體的代碼,對其進行一對一優化,而非一直把關注點放在服務器和sql平臺 降低簡化每個事務中處理的問題,盡量不要讓一個事務拖太長的時間 例如檔案上傳時,應將檔案上傳這一步放在事務外面 微軟建議 4.啟動sql定時執行計劃 怎么啟動sqlserver代理服務-百度經驗 ......

    uj5u.com 2023-04-20 08:26:35 more
  • 云時代,MySQL到ClickHouse資料同步產品對比推薦

    ClickHouse 在執行分析查詢時的速度優勢很好的彌補了MySQL的不足,但是對于很多開發者和DBA來說,如何將MySQL穩定、高效、簡單的同步到 ClickHouse 卻很困難。本文對比了 NineData、MaterializeMySQL(ClickHouse自帶)、Bifrost 三款產品... ......

    uj5u.com 2023-04-20 08:26:29 more
  • sql陳述句優化

    問題查找及措施 問題查找 需要找到具體的代碼,對其進行一對一優化,而非一直把關注點放在服務器和sql平臺 降低簡化每個事務中處理的問題,盡量不要讓一個事務拖太長的時間 例如檔案上傳時,應將檔案上傳這一步放在事務外面 微軟建議 4.啟動sql定時執行計劃 怎么啟動sqlserver代理服務-百度經驗 ......

    uj5u.com 2023-04-20 08:25:13 more
  • Redis 報”OutOfDirectMemoryError“(堆外記憶體溢位)

    Redis 報錯“OutOfDirectMemoryError(堆外記憶體溢位) ”問題如下: 一、報錯資訊: 使用 Redis 的業務介面 ,產生 OutOfDirectMemoryError(堆外記憶體溢位),如圖: 格式化后的報錯資訊: { "timestamp": "2023-04-17 22: ......

    uj5u.com 2023-04-20 08:24:54 more
  • day02-2-商鋪查詢快取

    功能02-商鋪查詢快取 3.商鋪詳情快取查詢 3.1什么是快取? 快取就是資料交換的緩沖區(稱作Cache),是存盤資料的臨時地方,一般讀寫性能較高。 快取的作用: 降低后端負載 提高讀寫效率,降低回應時間 快取的成本: 資料一致性成本 代碼維護成本 運維成本 3.2需求說明 如下,當我們點擊商店詳 ......

    uj5u.com 2023-04-20 08:24:03 more
  • day02-短信登錄

    功能實作02 2.功能01-短信登錄 2.1基于Session實作登錄 2.1.1思路分析 2.1.2代碼實作 2.1.2.1發送短信驗證碼 發送短信驗證碼: 發送驗證碼的介面為:http://127.0.0.1:8080/api/user/code?phone=xxxxx<手機號> 請求方式:PO ......

    uj5u.com 2023-04-20 08:23:11 more