移動應用程序設計綜合指南
已發表: 2022-03-10(這是一篇贊助文章。)人們比以往任何時候都更多地在關鍵時刻使用手機。 美國用戶平均每天在移動設備上花費 5 小時。 大部分時間花在應用程序和網站上。
好應用程序和壞應用程序之間的區別通常在於其用戶體驗 (UX) 的質量。 一個好的用戶體驗是將成功的應用程序與不成功的應用程序區分開來的地方。 今天,移動用戶對應用程序的期望很高:快速加載時間、易用性和交互過程中的愉悅感。 如果您希望您的應用程序成功,您必須考慮將用戶體驗不僅僅是設計的一個次要方面,而是產品戰略的重要組成部分。
在為移動設備設計時,有很多事情需要考慮。 在本文中,我總結了很多實用的建議,您可以將它們應用到您的設計中。
最小化認知負荷
認知負荷在這裡是指使用應用程序所需的腦力。 人腦的處理能力有限,當一個應用程序一次提供太多信息時,它可能會壓倒用戶並讓他們放棄任務。
整理
消除混亂是“移動用戶體驗設計的 10 條注意事項”中的主要建議之一。 雜亂是好的設計最大的敵人之一。 通過使您的界面雜亂無章,您會給用戶帶來過多的信息:每個添加的按鈕、圖像和圖標都會使屏幕變得更加複雜。
雜亂在台式機上很糟糕,但在移動設備上更糟(僅僅是因為我們在移動設備上沒有台式機和筆記本電腦那麼多的空間)。 刪除移動設計中並非絕對必要的任何內容至關重要,因為減少混亂會提高理解力。 功能極簡主義技術可以幫助您處理 UI 混亂的問題:
將內容保持在最低限度(僅向用戶展示他們需要知道的內容)。
盡量減少界面元素。 簡單的設計將使用戶對產品感到放心。
- 使用漸進式披露技術來顯示更多選項。
卸載任務
在設計中尋找任何需要用戶努力的東西(這可能是輸入數據、做出決定等),並尋找替代方案。 例如,在某些情況下,您可以重複使用以前輸入的數據,而不是要求用戶輸入更多數據,或者使用已有的信息來設置智能默認值。
將任務分解成小塊
如果一個任務包含很多用戶需要的步驟和動作,最好將這些任務分成多個子任務。 這一原則在移動設計中極為重要,因為您不想一次為用戶創造太多的複雜性。 一個很好的例子是電子商務應用程序中的逐步結賬流程,設計師將復雜的結賬任務分解成小塊,每個塊都需要用戶操作。
分塊還可以幫助連接兩種不同的活動(例如瀏覽和購買)。 當流程呈現為邏輯上相互連接的多個步驟時,用戶可以更輕鬆地完成它。
使用熟悉的屏幕
熟悉的屏幕是用戶在許多應用程序中看到的屏幕。 “Gettings started”、“What's new”和“Search results”等屏幕已成為移動應用程序的事實標準。 它們不需要額外的解釋,因為用戶已經熟悉它們。 這允許用戶使用先前的經驗與應用程序進行交互,而無需學習曲線。
考慮閱讀“您將在許多最成功的移動應用程序中找到的 11 個屏幕”,以了解有關熟悉屏幕的更多信息。
最小化用戶輸入
在小型手機屏幕上打字並不是最舒適的體驗。 事實上,它經常容易出錯。 用戶輸入最常見的情況是填寫表格。 這裡有一些實用的建議可以讓這個過程變得簡單:
- 通過刪除任何不必要的字段使表單盡可能簡短。 應用程序應該只要求用戶提供最少的信息。
- 提供輸入掩碼。 字段屏蔽是一種幫助用戶格式化輸入文本的技術。 一旦用戶關注某個字段,就會出現一個掩碼,並在填寫該字段時自動格式化文本,幫助用戶專注於所需的數據並更容易地發現錯誤。
使用自動完成等智能功能。 例如,填寫地址字段通常是任何註冊表單中最成問題的部分。 使用 Place Autocomplete Address Form 之類的工具(它使用地理位置和地址預填充來根據用戶的確切位置提供準確的建議)使用戶能夠以比使用常規輸入字段更少的擊鍵來輸入他們的地址。
動態驗證字段值。 提交數據後,您必須返回並糾正錯誤,這令人沮喪。 盡可能在輸入後立即檢查字段值,以便用戶立即更正它們。
- 自定義查詢類型的鍵盤。 詢問電話號碼時顯示數字鍵盤,詢問電子郵件地址時包括 @ 按鈕。 確保在整個應用程序中一致地實施此功能,而不僅僅是針對某些表單。
預測用戶需求
主動尋找用戶旅程中可能需要幫助的步驟。 例如,下面的屏幕截圖顯示了用戶需要提供特定信息的部分。
使用視覺重量來傳達重要性
屏幕上最重要的元素應該具有最大的視覺重量。 使用字體粗細、大小和顏色可以為元素添加更多權重。
避免行話
清晰的溝通應該始終是任何移動應用程序的重中之重。 使用您對目標受眾的了解來確定某些單詞或短語是否合適。
使設計一致
一致性是設計的基本原則。 一致性消除了混亂。 在整個應用程序中保持整體一致的外觀至關重要。 關於移動應用程序,一致性意味著以下內容:
視覺一致性
字體、按鈕和標籤需要在整個應用程序中保持一致。功能一致性
交互元素應該在應用程序的所有部分中以類似方式工作。外部一致性
設計應該在多個產品中保持一致。 這樣,用戶可以在使用其他產品時應用先驗知識。
以下是一些關於如何使設計保持一致的實用建議:
尊重平台準則。
每個移動操作系統都有界面設計的標準指南:Apple 的人機界面指南和 Google 的 Material Design 指南。 在為原生平台設計時,請遵循操作系統的設計指南以獲得最高質量。 遵循設計指南很重要的原因很簡單:用戶熟悉每個操作系統的交互模式,任何與指南相矛盾的事情都會產生摩擦。不要模仿其他平台的 UI 元素。
在為 Android 或 iOS 構建應用程序時,不要繼承其他平台的 UI 元素。 圖標、功能元素(輸入字段、複選框、開關)和字體應該具有原生的感覺。 盡可能使用原生組件,讓人們信任你的應用。使移動應用程序與網站保持一致。
這是外部一致性的一個例子。 如果您有 Web 服務和移動應用程序,請確保它們具有相似的特徵。 這將允許用戶在移動應用程序和移動網絡之間進行無摩擦的轉換。 設計不一致(例如,不同的導航方案或不同的配色方案)可能會導致混淆。
讓用戶掌控
保持交互元素熟悉且可預測
可預測性是用戶體驗設計的基本原則。 當事情按照用戶預測的方式進行時,他們會感到更強烈的控制感。 在桌面上,用戶可以使用懸停效果來了解某物是否具有交互性,而在移動設備上,用戶只能通過點擊元素來檢查交互性。 這就是為什麼對於按鈕和其他交互元素,必須考慮設計如何傳達可供性。 用戶如何將元素理解為按鈕? 形式應該遵循功能:對象的外觀告訴用戶如何使用它。 看起來像按鈕但不可點擊的視覺元素很容易讓用戶感到困惑。
“後退”按鈕應該可以正常工作
不正確創建的“後退”按鈕會給用戶帶來很多問題。 防止在多步驟過程中點擊“返回”按鈕會導致用戶一直回到主屏幕的情況。
一個好的設計使用戶更容易返回並進行更正。 當用戶知道他們可以再次查看他們提供的數據或他們選擇的選項時,這使他們可以輕鬆地繼續。
有意義的錯誤信息
人非聖賢孰能。 人們與應用程序互動時會發生錯誤。 有時,它們發生是因為用戶犯了錯誤。 有時,它們發生是因為應用程序失敗。 無論是什麼原因,這些錯誤以及它們的處理方式都會對用戶體驗產生巨大影響。 糟糕的錯誤處理加上無用的錯誤消息會讓用戶感到沮喪,這可能是用戶放棄你的應用程序的原因。
以 Spotify 的錯誤狀態屏幕為例。 它不能幫助用戶理解上下文,也不能幫助他們找到問題的答案,“我能做些什麼?”
不要假設用戶足夠精通技術來解決問題。 總是用簡單的語言告訴人們哪裡出了問題。 每條錯誤消息都應該告訴用戶:
- 出了什麼問題,可能是為什麼,
- 用戶應該採取什麼步驟來修復錯誤。
考慮閱讀“如何為移動應用程序設計錯誤狀態”以獲取有關錯誤處理的更多信息。
設計一個可訪問的界面
無障礙設計讓所有能力的用戶都能成功使用產品。 考慮視力喪失、聽力喪失和其他殘疾的用戶如何與您的應用互動。
注意色盲
全球有 4.5% 的人口患有色盲(即每 12 名男性中有 1 人,每 200 名女性中有 1 人),4% 患有低視力(每 30 人中有 1 人),0.6% 是盲人(每 188 人中有 1 人)。 很容易忘記我們是為這群用戶設計的,因為大多數設計師都沒有遇到過這樣的問題。
讓我給你一個簡單的例子。 移動表單中的成功和錯誤消息通常分別顯示為綠色和紅色。 但紅色和綠色是受色覺缺陷影響最大的顏色(這些顏色對於患有淡色盲或紅色盲的人來說很難區分)。 您很可能在填寫表格時看到以下錯誤消息:“紅色標記的字段是必填的”? 雖然這似乎不是一件大事,但此錯誤消息與以下示例中的表格相結合,對於有色覺缺陷的人來說可能是一種非常令人沮喪的體驗。
正如 W3C 的指導方針所述,顏色不應用作傳達信息、指示動作、提示響應或區分視覺元素的唯一視覺手段。 使用其他視覺符號來確保用戶能夠與界面交互非常重要。
使動畫可選
患有暈動病的用戶通常會在其操作系統設置中關閉動畫效果。 當在輔助功能首選項中啟用減少運動的選項時,您的應用應最小化或消除其自己的動畫。
讓導航變得簡單
幫助用戶導航應該是每個應用程序的重中之重。 如果人們找不到,您的應用程序擁有的所有酷炫功能和引人入勝的內容都將變得無關緊要; 此外,如果發現如何瀏覽您的產品需要花費太多時間或精力,那麼您很可能會失去用戶。 用戶應該能夠直觀地探索應用程序並完成所有主要任務而無需任何解釋。
使用標準導航組件
最好使用標準導航模式,例如標籤欄(適用於 iOS)和導航抽屜(適用於 Android)。 大多數用戶都熟悉這兩種導航模式,並且會直觀地知道如何繞過您的應用程序。
有關導航模式的更多信息,請閱讀文章“移動導航的基本模式:優點和缺點”。
優先導航選項
根據用戶與您的應用交互的方式確定導航的優先級。 為常見的用戶任務分配不同的優先級(高、中、低)。 在 UI 中突出具有高優先級和頻繁使用的路徑和目的地。 使用這些路徑來定義您的導航。 以需要最少點擊、滑動和屏幕次數的方式組織您的信息結構。
不要混合導航模式
當您為應用選擇主要導航模式時,請始終如一地使用它。 不應該出現應用程序的一部分有標籤欄,而另一部分有側抽屜的情況。
使導航可見
正如雅各布尼爾森所說,識別事物比記住它更容易。 通過使操作和選項可見,最大限度地減少用戶的記憶負荷。 導航應該在任何時候都可用,而不僅僅是在我們預計用戶需要它的時候。
溝通當前位置
無法指示當前位置是許多移動應用程序菜單非常常見的問題。 “我在哪裡?” 是用戶成功導航需要回答的基本問題之一。 人們應該隨時知道他們在您的應用程序中的位置。
使用功能動畫來闡明導航轉換
動畫是描述狀態轉換的最佳工具。 它可以幫助用戶理解頁面佈局中的狀態變化、觸髮變化的原因以及如何在需要時再次啟動變化。
小心在 UI 中使用手勢
在交互設計中使用手勢可能很誘人。 但在大多數情況下,最好避免這種誘惑。 當手勢被用作主要導航選項時,它們可能會導致糟糕的用戶體驗。 為什麼? 因為手勢是隱藏控件。
正如 Thomas Joos 在他的文章“超越按鈕:擁抱手勢驅動的界面”中指出的那樣,在用戶界面中使用手勢的最大缺點是學習曲線。 每次用手勢替換可見控件時,應用程序的學習曲線都會上升。 發生這種情況是因為手勢的可發現性較低——它們總是隱藏的,人們需要能夠識別這些選項才能使用它們。 這就是為什麼只使用廣泛接受的手勢(用戶期望在您的應用程序中使用的手勢)至關重要的原因。
在 UI 中使用手勢時,請遵循一些簡單的規則:
- 使用標準手勢。
我所說的“標準”是指對您所在類別的應用程序來說最自然的手勢。 人們熟悉標準手勢,因此不需要額外的努力來發現或記住它們。 - 提供手勢作為可見導航選項的補充而非替代。
手勢可以作為導航的快捷方式,但不能完全替代可見菜單。 因此,始終提供一種簡單、可見的導航方式,即使這意味著一些額外的操作。
有關在 UI 中使用手勢的更多信息,請考慮閱讀“應用內手勢和移動應用用戶體驗”。
專注於第一次體驗
首次體驗是移動應用的成敗。 您只能在第一印像中獲得一次機會。 如果你失敗了,用戶很可能不會再次啟動你的應用程序。 (Localytics 的研究表明,24% 的用戶在第一次使用應用程序後再也不會返回。)
避免登錄牆
登錄牆是使用應用程序之前的強制註冊。 這是用戶摩擦的常見來源,也是用戶放棄應用程序的原因之一。 放棄註冊過程的用戶數量對於品牌認知度低或價值主張不明確的應用程序尤其重要。
根據經驗,只有在必要時才要求用戶註冊(例如,如果您的應用程序的核心功能僅在用戶完成註冊後才可用)。 即使在這種情況下,最好還是盡可能延遲登錄——讓用戶體驗一下應用程序(例如,參觀一下),然後才輕輕提醒他們註冊。 這將使您的用戶體驗體驗,他們將更有可能投入使用。
設計良好的入職體驗
在移動 UX 的背景下,提供出色的入職體驗是留住用戶的基礎。 引導的目標是展示您的應用程序提供的價值。
在許多入職策略中,有一個特別有效:上下文入職。 上下文引導意味著僅在用戶需要時提供說明。 多鄰國就是一個很好的例子。 此應用程序將交互式導覽與漸進式披露相結合,向用戶展示應用程序的工作原理。 鼓勵用戶使用他們選擇的語言進行快速測試。 這使學習變得有趣且易於發現。
在入職期間可能非常有用的另一件事是空狀態。 空狀態是默認狀態為空的屏幕,需要用戶通過一個或多個步驟來填充數據。 除了告訴用戶頁面上的內容是什麼外,空狀態還可以教人們如何使用應用程序。 即使入職流程僅包含一個步驟,該指南也會讓用戶放心,他們正在做正確的事情。
考慮閱讀“空狀態在用戶入職中的作用”以獲取有關入職的更多信息。
不要事先詢問設置信息
強制設置階段會產生摩擦,並可能導致應用程序被放棄。 當用戶啟動應用程序時,他們希望它能夠正常工作。 因此,為大多數用戶設計您的應用程序,並讓少數想要不同配置的人隨時調整他們的設置以滿足他們的需求。
提示:嘗試從系統中推斷出您需要什麼。 如果您需要有關用戶、設備或環境的信息,請盡可能向系統查詢,而不是詢問用戶。
避免一開始就請求權限
避免用戶在啟動應用程序時看到的第一件事是請求權限的對話框。 與登錄牆或預先設置階段類似,只有在應用的核心功能需要時,才應在啟動時請求許可。 如果您的應用顯然依賴於該權限才能運行(例如,很明顯照片編輯器會請求訪問照片的原因),則用戶不會受到此請求的困擾。
但對於任何其他情況,請在上下文中請求權限。 如果在相關任務期間被詢問,用戶更有可能授予權限。
提示:
只詢問您的應用明確需要什麼。
不要要求所有可能的權限。 如果應用程序請求它沒有明顯需要的東西,那將是可疑的。 例如,一個鬧鐘應用程序請求訪問您的聯繫人列表的權限將是可疑的。如果信息不明顯,請解釋為什麼您的應用需要這些信息。
有時您需要為您的請求提供更多上下文。 出於這個原因,您可以設計一個自定義警報來請求權限。
讓您的應用程序看起來快速且響應迅速
加載時間對於 UX 來說非常重要。 隨著技術的進步,我們變得越來越不耐煩,如今,47% 的用戶希望頁面在 2 秒或更短的時間內加載完畢。
如果頁面需要更多時間來加載,訪問者可能會感到沮喪並離開。 這就是為什麼在構建移動應用程序時速度應該是優先事項。 但無論你製作應用程序的速度有多快,有些事情都需要時間來處理。 響應緩慢可能是由於 Internet 連接不良,或者操作可能需要很長時間。 但即使不能縮短排隊時間,至少也要盡量讓等待更愉快。
專注於在屏幕的可見區域加載內容
當頁面打開時,加載足夠的內容以填滿屏幕。 滾動可用的內容應繼續在後台加載。 這種方法的好處是用戶將專注於閱讀初始內容,在某些情況下,甚至不會注意到內容仍在加載。
加載時要清楚
用戶在加載內容時看到的空白或靜態屏幕會使您的應用看起來像是被凍結,從而導致混亂和沮喪,並可能導致人們離開您的應用。 至少,顯示一個加載微調器,清楚地表明正在發生某些事情。 對於較長的等待時間(超過 10 秒),必須顯示一個進度條,以便用戶可以衡量他們將等待多長時間。
考慮閱讀“動畫進度指示器的最佳實踐”以獲取有關加載指示器的更多信息。
提供視覺干擾
如果應用程序在等待時為用戶提供了一些有趣的東西,那麼用戶將不太關注等待本身。 因此,為了確保人們在等待某事發生時不會感到無聊,請讓他們分心。 一個精美的動畫等待指示器可以在用戶等待時保持他們的注意力。
提示:牢記長壽。 當過度使用時,即使是好的動畫也會很煩人。 在設計動畫時,問問自己,“動畫會在第一百次使用時變得煩人,還是普遍清晰且不引人注目?”
骨架屏風
骨架屏幕(即臨時信息容器)本質上是頁面的空白版本,信息逐漸加載到該頁面中。
當您的應用程序開始加載數據時,會出現一個骨架屏幕,給用戶一種您的應用程序快速且響應迅速的印象。 與僅傳達正在發生的事情的加載指示器不同,骨架屏幕專注於實際進度。
優化移動內容
內容在設計中起著重要作用。 在大多數情況下,人們使用應用程序的主要原因是它提供的內容。 但僅僅擁有清晰、精心製作的內容是不夠的。 內容必須易於消化。
使文本可讀和易讀
當我們考慮內容時,在大多數情況下,我們指的是排版。 正如 Oliver Reichenstein 在他的文章“Web Design Is 95% Typography”中所說:
“優化排版正在優化可讀性、可訪問性、可用性(!)、整體圖形平衡。”
移動排版的關鍵是可讀性和易讀性。 如果用戶無法閱讀您的內容,那麼首先提供內容是沒有意義的。
首先,關於易讀性的一些實用建議:
字體大小
通常,任何小於 16 像素(或 11 點)的內容在任何屏幕上都難以閱讀。字體系列
大多數用戶更喜歡清晰易讀的字體。 一個安全的選擇是系統的默認字體(Apple iOS 使用 San Francisco 字體;Google Android 使用 Roboto)。對比
淺色文本(如淺灰色)可能看起來很美觀,但用戶將很難閱讀,尤其是在淺色背景下。 確保字體和背景之間有足夠的對比,以便於閱讀。 WC3 的 Web 內容可訪問性指南為圖像和文本提供了對比度建議。
現在,一些關於可讀性的建議:
- 避免全部大寫。
所有大寫文本(即所有字母大寫的文本)在不涉及專心閱讀(例如首字母縮略詞和徽標)的上下文中很好,但在您的信息需要大量閱讀時避免使用。
- 限製文本行的長度。
一個好的經驗法則是移動設備每行使用 30 到 40 個字符。
- 不要擠線。
在文本之間添加空格有助於用戶閱讀,並產生一種沒有太多信息可以吸收的感覺。
高清質量的圖像和正確的縱橫比
具有高分辨率屏幕的設備的興起為圖像質量設定了標準。 圖像不應在高清屏幕上出現像素化。
圖像應始終以正確的縱橫比顯示,以免看起來失真。 被拉得太寬或太長以適應空間的圖像會看起來不吸引人且不合適。
許多移動設計師面臨的最新挑戰是優化 iPhone X 的用戶體驗。為 iPhone X 進行設計需要與任何其他 iPhone 不同的畫板尺寸(您需要 375 x 812 點分辨率的圖像,分辨率為 3x)。
考慮閱讀“為 iPhone X 設計應用程序:每個 UX 設計師需要了解的關於 Apple 最新設備的知識”,以了解有關 iPhone X 設計的更多信息。
視頻內容針對縱向模式進行了優化
視頻正迅速成為許多用戶消費內容的標準方法。 據 YouTube 稱,移動視頻消費量每年增長 100%。 到 2020 年,超過 75% 的全球移動數據流量將是視頻內容。 這意味著優化縱向模式的視頻內容至關重要。
據 ScientiaMobile 稱,94% 的用戶以縱向模式使用他們的移動設備。 如果您的應用提供視頻內容,則應對其進行優化以允許用戶以縱向模式觀看。
觸控設計
觸摸設計的目標是減少錯誤輸入的數量,並使與應用程序的交互更加舒適。
為手指而不是光標設計
When you're designing actionable elements in a mobile interface, it's vital to make targets big enough so that they're easy for users to tap. Mistaken taps often happen due to small touch controls.
When designing a touch target, you can rely on the MIT Touch Lab's study (PDF) to choose a proper size for interactive elements. This study found that the average size of finger pads are between 10 and 14 mm and fingertips are 8 to 10 mm, making 10 by 10 mm a good minimum touch target size.
Not only is the size of the target important, but it's also essential to have the right amount of space between targets. If multiple touch targets are near each other (for example, “Agree” and “Disagree” buttons), ensure that there is good amount of space between them.
Consider Thumb Zone
Designing for thumbs isn't only about making targets big enough, but also about considering the way we hold our devices. A lot of users hold their phone with one hand. Only a part of the screen would be a genuinely effortless territory for their thumbs. This territory is called the natural thumb zone. Other zones require finger stretching or even changing the grip to reach them. Below, you can see what the safe zone looks like on a modern mobile device.
The bigger the display, the more of the screen is less easily accessible.
Consider all zones when designing for mobile:
The green zone is the best place for navigation options or frequent interactive actions (such as call-to-action buttons).
The red zone is the best place for potential danger options (such as “Delete” or “Erase”). Users are less likely to trigger this option accidentally.
Feedback on Interaction
In the physical world, objects respond to our interaction. People expect a similar level of responsiveness from digital UI controls. You'll need to provide instant feedback on every user interaction. If your app doesn't provide feedback, the user will wonder if it has frozen or if they missed the target. The feedback could be visual (highlighting a tapped button) or tactile (a device vibration on input).
Humanize The Digital Experience
UX isn't only about usability; it's mostly about feelings. And when we think about what makes us feel great, we often think about well-crafted design.
個性化體驗
Personalization is one of the most critical aspects of mobile apps today. It's an opportunity to connect with users and provide the information they need in a way that feels genuine.
There are countless ways to improve the mobile UX by incorporating personalization. It's possible to offer personalized content depending on the user's location, their past searches and their past purchases. For example, if your users prefer to purchase particular groups of products each month, an app might track that and offer them special deals on those types of products.
Starbucks' mobile app is an excellent example that follows this approach. The app uses information provided by users (for example, the type of coffee they usually order) to craft special offers.
Delightful Animation
Unlike functional animation, which is used to improve the clarity of a user interface, delightful animation is used to make an interface feel human. This type of animation makes it clear that the people who crafted the app care about their users.
優化推送通知
煩人的通知是人們卸載移動應用程序的第一大原因(根據 71% 的受訪者)。
不要僅僅因為可以發送推送通知。 每個通知都應該是有價值的並且適時的。
推動價值
當用戶開始使用您的應用程序時,他們不會介意收到通知,只要他們獲得的價值遠遠大於中斷。 幾乎 50% 的用戶對他們感興趣的通知表示感謝。 個性化內容以激發和愉悅是至關重要的。 Netflix 是“推動價值”的公司的一個很好的例子。 它謹慎地使用查看數據來呈現量身定制的建議。
避免在短時間內發送大量通知
在短時間內傳遞過多的通知可能會導致稱為通知過度殺傷的情況——用戶無法處理信息並簡單地跳過它。 通過組合不同的消息來限制通知的總數。
定時通知
不僅你說什麼很重要,你說什麼時候也很重要。 不要在奇怪的時間(例如半夜)發送推送通知。 推送通知的最佳時間是移動使用高峰時間:從下午 6:00 到晚上 10:00。
考慮其他渠道來傳遞您的信息
推送通知並不是傳遞消息的唯一方式。 根據您想要分享的內容的緊急程度和類型,使用電子郵件、應用內通知和新聞源消息來通知用戶重要事件。
針對移動設備進行優化
中斷設計
我們生活在一個中斷的世界。 有些東西不斷地試圖分散我們的注意力,並將我們的注意力引向別處。 更不用說,當用戶在旅途中時,會發生很多移動會話。 例如,用戶可能會在等火車時使用您的應用程序。 此類會話可以隨時中斷。 當應用程序關閉後立即忘記當前進度時,用戶很容易感到沮喪。
發生中斷時,您的應用應保存當前狀態(上下文)並允許用戶從中斷處繼續。 這將使用戶在中斷後返回應用程序時更容易重新使用該應用程序。
利用設備的功能
移動設備有很多傳感器(攝像頭、位置跟踪、加速度計)可用於改善用戶體驗。 以下是您可以用來執行此操作的一些功能:
- 相機
使用相機可以簡化數據輸入操作。 例如,您可以使用數碼相機自動讀取信用卡號。
- 位置感知
應用程序可以使用設備的位置數據來提供與用戶位置相關的內容或簡化某些操作。 例如,如果您正在設計一個用於送餐的應用程序,而不是要求用戶提供送餐地址,您可以自動檢測他們當前的位置並要求用戶確認他們想要接收到該地點的送貨.
- 生物特徵認證
使用指紋觸摸登錄或面部識別等功能可以最大限度地減少登錄應用程序所需的步驟數。
提示:您可以在我們的文章“為 iPhone X 設計應用程序:每個 UX 設計師需要了解的有關 Apple 最新設備的知識”一文中找到有關如何使用 Apple 面容 ID 的實用建議。
努力打造多渠道體驗
不要將您的移動應用程序視為一種孤立的體驗。 在創建用戶旅程時,最終目標是在所有設備上創建無縫體驗。 用戶應該能夠切換到不同的媒體並繼續旅程。
根據 Appicles 的數據,37% 的用戶在移動設備上進行研究,但轉而使用桌面設備完成購買。 因此,如果您正在設計電子商務應用程序,移動用戶應該能夠切換到他們的台式機或筆記本電腦以繼續旅程。 跨設備同步用戶進度是創建無縫體驗的關鍵優先事項。 它讓用戶覺得他們的工作流程沒有被打斷。
使移動設計適應新興市場
據谷歌稱,預計未來幾年將有 10 億新用戶上網。 其中絕大多數將來自新興市場(或所謂的移動優先國家,如印度、印度尼西亞、巴西和尼日利亞)。 他們將通過手機獲得訪問權限。 這些用戶將擁有與美國和歐洲用戶截然不同的體驗和期望。
如果您對走向全球感興趣,那麼考慮他們的經驗很重要。
互聯網連接不佳
在美國和歐洲,用戶習慣於無處不在的連接。 但這在世界範圍內肯定不是真的。 新興市場的產品必須能夠在緩慢或斷斷續續的連接中運行。 根據一個人的位置,網絡可能會從 Wi-Fi 切換到 3G 再到 2G 再到完全沒有連接,而您的產品必須適應這種情況。
如果您計劃針對此類市場進行設計,請考慮以下事項:
確保您的產品在完全未連接到 Internet 時可以正常工作。 允許緩存數據。
優化您的產品以實現快速加載。 通過將圖像和其他重量級內容保持在最低限度來最小化頁面大小; 並減小該內容的大小。
YouTube Go 是圍繞連接限制設計的移動應用程序的一個很好的例子。 該應用程序被設計為離線優先(這意味著即使它沒有連接到互聯網也可以使用)。 該應用程序允許用戶先預覽視頻,並允許他們選擇視頻的文件大小,然後再將其離線保存以供以後觀看。 它還有一個很棒的功能,讓用戶可以輕鬆地與附近的朋友和家人分享視頻,而無需使用任何數據。
Google 新聞和天氣是另一個針對不良連接設計的應用程序的絕佳示例。 該應用程序有一個名為“精簡模式”的功能,適用於低帶寬連接的人。 激活此模式後,它會將內容精簡到基本內容,以便應用更快地加載。 據谷歌稱,這種模式使用的數據不到正常數據的三分之一,當應用程序檢測到網絡速度較慢時,它會自動激活。
有限的數據
在大約 95% 的新興市場中,人們幾乎完全依賴昂貴的預付費移動數據。 人們購買固定數量的數據,許多人每月只能負擔 250 MB 的數據。
這些用戶在了解他們的數據消耗時非常重視透明度。 他們還重視控制產品是通過 Wi-Fi 下載還是使用數據的能力。
下面,您可以看到另一個來自 YouTube Go 的示例。 選擇視頻後,用戶可以選擇視頻的質量。 該應用程序讓他們在承諾採取行動之前預先知道他們將花費多少數據。
有限的設備功能
移動優先國家的智能手機與美國流行的 Pixels 和 iPhone 有著截然不同的功能。 大多數新興市場設備的成本低於 100 美元,並且可能具有有限的存儲和處理能力。 確保您設計的產品適用於較舊的低端設備和軟件。
地方美學
當今在西方世界流行的極簡主義設計對於其他文化來說可能被認為過於赤裸裸。 如果您希望您的產品在新興市場取得成功,請注意文化美學。 您可以從當地流行的產品中獲得靈感,也可以聘請熟悉用戶偏好的本地設計師。 根據當地美學進行設計將使您的產品感覺更相關。
地區細節
當谷歌為印度調整谷歌地圖時,它認為印度是世界上最大的兩輪車市場,數以百萬計的摩托車和踏板車騎手與汽車司機有著不同的需求。 它在地圖中發布了兩輪車模式。 此模式顯示使用快捷方式的旅行路線,汽車和卡車無法訪問。
測試和反饋
您剛剛閱讀的所有原則都可以幫助您設計更好的移動體驗,但它們不會取代用戶研究和測試的需求。 您仍然需要與真實用戶一起測試您的解決方案,以了解 UI 的哪些部分需要改進。
反饋迴路
在每一個機會鼓勵用戶反饋。 為了收集有價值的反饋,您需要讓用戶輕鬆提供反饋。 因此,在您的產品中建立一個反饋機制。 這可以像標有“留下反饋”的表格一樣簡單。 只需確保它對您的用戶無縫運行即可。
設計是一個永無止境的過程
公平地說,設計是一個不斷改進的過程。 作為產品設計師,我們使用分析和用戶反饋來不斷改進體驗。
對設計師有用的工具和資源
顏色對比檢查器
令人驚訝的是,有多少移動應用程序沒有通過 AA 測試。 不要成為他們中的一員! 檢查顏色對比的可訪問性至關重要。 使用 WebAIM 的顏色對比檢查器來測試顏色組合。
Adobe XD 的 UI 工具包
精心設計的用戶界面將使您的應用程序大放異彩。 如果您可以不從頭開始設計您的 UI,而是使用諸如 UI 套件之類的堅實基礎來設計您的 UI,那就太好了。 Adobe XD 有五個 UI 套件,您可以完全免費下載。這些套件將提高您的創造力並幫助您提供視覺上有趣的 UI 設計。
結論
出色的設計是美觀和功能的完美結合,而這正是您在構建應用程序時應該追求的目標。 但是不要試圖在第一次嘗試就構建一個完美的應用程序。 這幾乎是不可能的。 相反,將您的應用程序視為一個不斷發展的項目,並使用來自測試會話和用戶反饋的數據來不斷改進體驗。
本文是 Adobe 贊助的 UX 設計系列的一部分。 Adobe XD 專為快速流暢的 UX 設計流程而設計,因為它可以讓您更快地從構思轉變為原型。 設計、原型製作和分享——全部在一個應用程序中。 您可以在 Behance 上查看使用 Adobe XD 創建的更多鼓舞人心的項目,還可以註冊 Adobe 體驗設計時事通訊,以隨時了解 UX/UI 設計的最新趨勢和見解。