UI / UX設計師是產品開發團隊中非常重要的職位。它們是客戶和程序員之間的橋梁,程序員解碼客戶見解,與業務目標協調,并將其轉化為產品的功能,交互和界面。他們可以承擔早期階段的工作,一般策略或詳細的工作,例如產品流應該如何,按鈕應該是什么顏色等。除了研究和設計,UI / UX設計師還進行數據分析和測試工作以優化產品。
作為 UI/UX 設計人員,您將參與產品開發過程,從客戶需求文件的第一步到完整的 UI。
工作的性質使您專注于處理項目的核心問題。您的UI使客戶滿意,因為您解決其業務問題的方式非常好。這就是為什么你有時會忘記UI的其他子組件。沒有它,您的產品仍然可以正常工作,但從用戶的角度來看,缺乏這些組件將使他們的體驗顯著惡化。
在成為高級UI / UX設計師時,您應該改進這些要點,并為客戶提供和開發團隊最完整的UI版本。
以下是許多新的UI / UX設計人員在設計過程中忘記的組件。
1. 入職屏幕
首次打開下載的應用時,主介紹屏幕是載入屏幕。載入屏幕是一個指南,旨在簡要介紹應用程序、其主要功能以及如何使用它。
入職屏幕應以簡單的風格設計,內容應過濾,主要功能應首先介紹。創建載入屏幕(如靜態狀態頁)是為了通知和教育用戶。在UX方面,載入屏幕使用戶在開始使用應用程序時免于困惑,以及必須自己找到應用程序功能的挫敗感。
應用程序入職設計
Walet.vip 入職UI設計
清潔的介紹屏幕由我
使用載入屏幕
的目的 用戶已安裝應用,無需閱讀說明手冊。用戶尚不熟悉應用的 UI 或準備了解它。歡迎用戶并讓他們對未來的體驗感到興奮
幫助用戶隱性或明確地了解如何在他們的生活中使用該應用程序。推動用戶采取行動,提高參與度和保留率。
2. 骨架裝載機
骨架只是一組預定義的幀,用于替換要在等待加載數據時顯示的內容。Skeleton有助于提高用戶體驗,并且在您的頁面/應用程序有太多數據要加載的情況下特別有用。
框架的目的是一個預覽框架,它簡化了內容的加載,以便在完全加載數據所需的時間內減少用戶的期望。元素應具有骨架,例如頭像,卡片,圖表,列表,表格,文本內容,圖像等。
臉書
何時使用骨架裝載機
加載內容并且用戶進行交互后,重新加載頁面時,不需要骨架
無需骨架,內容可立即顯示,加載時間不長
不要同時使用微調器加載和骨架加載
設計時應使用不同級別的灰度來表示,并具有動畫加載功能,以使用戶知道它們正在加載。
使用與內容相對應的形狀,每個形狀代表內容,以便于識別。例如,頭像使用圓圈,長文本使用矩形。
3. 空狀態
空狀態是用戶進入頁面但無要顯示任何內容時的狀態。然后,您需要一個說明,說明此頁面為空,沒有數據,您可以從中向他們建議操作。例如,對于空的待辦事項列表頁,您可以添加“創建待辦事項”操作。
首次使用 — 當然,第一次使用時不會顯示任何數據,例如新的 Google 云端硬盤帳戶。
無結果/無數據 — 在無要顯示任何內容時發生。如果有人執行搜索并且查詢為空或沒有可顯示的數據(例如,在篩選沒有數據的日期范圍時),則可能會發生這種情況。
谷歌驅動器與提示
Dropbox — 行動號召按鈕可幫助您開始操作,而無需考慮下一步該做什么。
4. 初始屏幕
初始屏幕是用戶在啟動應用或網站時看到的介紹屏幕。這是一個建立您的品牌標識的機會,當您的應用程序在后臺加載時,它會讓用戶保持忙碌。此屏幕可以是圖像、圖形、徽標或動畫,有時還帶有進度條。當設備速度較慢且互聯網速度更慢時,經常使用初始屏幕。
移動應用程序的問題在于您無法承受漫長的等待時間;用戶等待的時間越長,用戶放棄應用的可能性就越大。初始屏幕使用戶的等待時間不那么痛苦。
動畫初始屏幕 — 中型應用
靜態初始屏幕 — 幣安、臉書、NALS 任務(NALS 內部應用程序)
5. 404錯誤頁面
當用戶登陸不再存在的頁面,輸入的URL不正確,或者鏈接導致死胡同等時,該網站將引導您進入404頁面。當他們被定向到錯誤頁面時,它會中斷他們的流程,從而導致沮喪的感覺,他們會找到回去的路。因此,您應該需要設計錯誤頁面,否則會導致用戶在那時對網站失去興趣。在這些情況下反彈是一個明顯的跡象,表明產品的用戶體驗不好。
用戶離開網站不僅對UX來說是一個問題,而且對SEO也是不好的(404頁面是谷歌的SEO排名因素之一)
404 頁面未找到
6. 無互聯網狀態
用戶的設備并不總是連接到互聯網,或者有時互聯網連接速度很慢,以防他們在飛機上突然失去wifi連接。然后有時,UI必須顯示一個屏幕來告訴他們連接的問題,類似于空狀態,錯誤,這是一個破壞用戶體驗的問題。
如果應用程序具有僅在用戶連接時可用的功能,則應向用戶發送有關當前連接狀態的通知。你可以以 Toast 元素的形式顯示帶有文本標簽“你處于脫機狀態”的脫機圖釘圖標。
中敬消息
設計數字產品是復雜且多步驟的,導致設計人員有時會忘記增強用戶體驗所需的其他不重要的屏幕元素。
相關文章
關注千鋒學習站小程序
隨時隨地免費學習課程
掃一掃快速進入
千鋒移動端頁面
掃碼匿名提建議
直達CEO信箱