中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

設(shè)計移動應(yīng)用程序，有很多事情需要考慮。本文總結(jié)了許多可以應(yīng)用于設(shè)計的實用建議，供大家一起參考和學(xué)習(xí)。

應(yīng)用程序之間的好壞區(qū)別通常在于其用戶體驗（UX）的質(zhì)量。如今，移動用戶對應(yīng)用程序寄予厚望：加載時間短，易于使用且在交互過程中倍感愉悅。

如果要使應(yīng)用程序成功，則UX必須是產(chǎn)品策略的重要組成部分。

一、最小化用戶認知負荷

認知負荷是指使用該應(yīng)用所需的腦力。人腦的處理能力有限，當應(yīng)用程序一次提供太多信息時，可能會使用戶不知所措，從而使他們放棄任務(wù)。

1. 清除雜亂

消除雜亂是“ 移動UX設(shè)計的十大原則 ”中的主要建議之一。頁面雜亂是優(yōu)秀設(shè)計的最大敵人之一，雜亂的頁面會給用戶增加過多的信息：每個添加的按鈕，圖像和圖標都會使屏幕更加復(fù)雜。

頁面雜亂在PC端上非常糟糕，但在移動設(shè)備上則更加糟糕（這是因為我們在移動設(shè)備上的空間遠沒有PC端那么多）。在移動設(shè)計中去除任何不必要的東西是很重要的，因為減少雜亂會提高理解能力。

1）極簡主義可以幫助你處理凌亂的UI問題：

• 盡量減少內(nèi)容（僅向用戶提供他們需要知道的內(nèi)容）
• 盡量減少界面元素，簡單的設(shè)計將使用戶放心使用該產(chǎn)品

(簡潔的標簽欄（右）比凌亂的標簽欄（左）好得多）

2）使用漸進式呈現(xiàn)技術(shù)顯示更多選項

2. 減少重復(fù)性任務(wù)

在設(shè)計中尋找需要用戶努力的任何事物（這可能是輸入數(shù)據(jù)，做出決定等），并尋找替代方法。

例如，在某些情況下，你可以重復(fù)使用以前輸入的數(shù)據(jù)，而不必要求用戶鍵入更多數(shù)據(jù)，或使用已有的信息來設(shè)置智能默認值。

3. 將任務(wù)分解為小任務(wù)

如果任務(wù)需要用戶執(zhí)行大量的步驟和操作，則最好將此類任務(wù)劃分為多個子任務(wù)。該原則在移動設(shè)計中非常重要，因為你不想一次為用戶帶來太多復(fù)雜性。

一個很好的例子是電子商務(wù)應(yīng)用程序中的分步付款流程，其中設(shè)計人員將復(fù)雜的結(jié)帳任務(wù)分解成若干個小任務(wù)，讓用戶完成每個小任務(wù)。

不同的小任務(wù)還可以幫助連接兩個不同的活動（例如瀏覽和購買）。當一個流程被表示為邏輯上相互連接的多個步驟時，用戶可以更輕松地進行操作。

(查找電影并購買電影院門票）

4. 使用熟悉的屏幕

熟悉的屏幕是指用戶在許多應(yīng)用程序中都會看到的屏幕。“入門”，“新功能”和“搜索結(jié)果”等屏幕已成為移動應(yīng)用程序的實際標準。它們不需要額外的解釋，因為用戶已經(jīng)很熟悉它們。這使用戶可以使用以前的經(jīng)驗與該應(yīng)用進行交互，而無需學(xué)習(xí)。

(Quora應(yīng)用程序中的用戶個人資料屏幕）

5. 最小化用戶輸入

在小巧的手機屏幕上打字不是最舒適的體驗。實際上，它經(jīng)常容易出錯。用戶輸入的最常見情況是填寫表格。以下是一些實用的建議，可簡化此過程：

1）刪除任何不必要的字段，使表格盡可能短

(表單設(shè)計的經(jīng)驗法則是，越短越好。將多個字段合并為一個易于填充的字段）

2）提供輸入原型

字段原型是一種幫助用戶格式化輸入文本的技術(shù)。一旦用戶將注意力集中在某個字段上，就會出現(xiàn)一個需要輸入的格式，該原型會在填寫該字段時自動設(shè)置文本格式，從而幫助用戶專注于所需的數(shù)據(jù)并更容易地注意到錯誤。

3）使用自動填寫等智能功能

例如，填寫地址字段通常是任何注冊表單中最有問題的部分。使用“ 自動填寫地址”工具，使用戶能夠以比常規(guī)輸入字段更少的擊鍵次數(shù)輸入他們正確的地址。

4）動態(tài)驗證字段值

在提交數(shù)據(jù)后，當你不得不返回并更正錯誤時，這很令人沮喪。盡可能在輸入后立即檢查字段值，以便用戶立即進行更正。

(內(nèi)聯(lián)驗證）

5）為填寫字段的類型自定義鍵盤

詢問電話號碼時顯示數(shù)字鍵盤，詢問電子郵件地址時顯示@按鈕。確保該特性在整個應(yīng)用程序中得到一致的實現(xiàn)，而不是只針對某些表單。

(使鍵盤與所需的文本輸入匹配）

6. 預(yù)測用戶的需求

主動尋找用戶使用中可能需要幫助的步驟。例如，下面的屏幕快照顯示了用戶需要提供特定信息的部分。

(輸入字段旁邊的簡明幫助文本將幫助用戶找到條形碼的信息）

7. 利用視覺權(quán)重來表示重要性

屏幕上最重要的元素應(yīng)該具有最大的視覺權(quán)重。通過字體的粗細、大小和顏色，可以roid或 iOS 構(gòu)建應(yīng)用程序時，不要從其他平臺移植UI元素。

圖標，功能元素（輸入字段，復(fù)選框，開關(guān)）和字體應(yīng)具有原生感，盡可能多地使用自己的組件，這樣人們才會信任你的應(yīng)用。

1）使移動應(yīng)用程序與網(wǎng)站保持一致

這是外部一致性的一個例子。如果你具有Web服務(wù)和移動應(yīng)用程序，請確保它們都具有相似的特征。這將使得用戶在移動應(yīng)用程序和web之間進行平滑的過渡。設(shè)計不一致（例如，不同的導(dǎo)航方案或不同的配色方案）可能會引起混亂

二、讓用戶來控制

1. 保持交互元素熟悉且可預(yù)測

可預(yù)測性是用戶體驗設(shè)計的基本原則。當事情按照用戶預(yù)期的方式運行時，他們會有一種更強的控制感。與PC不同，在PC上，用戶可以使用懸停效果來了解事物是否是交互式的，而在移動設(shè)備上，用戶只能通過點擊某個元素來檢查交互性。這就是為什么，對于按鈕和其他交互元素，必須考慮設(shè)計如何傳達可視性。

2. “返回”按鈕應(yīng)正常工作

創(chuàng)建不正確的“返回”按鈕會給用戶帶來很多問題。防止在一個多步驟的過程中點擊“返回”按鈕把用戶帶回到主屏幕。

好的設(shè)計可以使用戶更輕松地返回并進行修改。當用戶知道可以再次查看他們提供的數(shù)據(jù)或選擇的選項時，這使他們可以輕松地繼續(xù)。

3. 有意義的錯誤提示

人非圣賢孰能。人們與應(yīng)用互動時會發(fā)生錯誤。有時，它們的發(fā)生是因為用戶犯了一個錯誤。有時，它們的發(fā)生是因為應(yīng)用程序失敗。無論是什么原因，這些錯誤及其處理方式都會對UX產(chǎn)生巨大影響。不當?shù)奶幚礤e誤消息加上無用的錯誤信息會讓用戶感到沮喪，這可能是用戶放棄應(yīng)用程序的原因。

以Spotify中的錯誤狀態(tài)為例。它不能幫助用戶理解上下文，也不能幫助他們找到“我能做什么?”這個問題的答案。

(屏幕僅顯示“發(fā)生錯誤”，并未提供有關(guān)解決問題的任何建設(shè)性建議）

不要假設(shè)用戶有足夠的技術(shù)知識來解決問題?？偸怯弥卑椎恼Z言告訴別人哪里不對。每個錯誤消息應(yīng)該告訴用戶:

• 哪里出錯了，為什么？
• 用戶應(yīng)該采取什么措施來修復(fù)錯誤？

三、設(shè)計無障礙的界面

無障礙設(shè)計使所有能力的用戶都能成功使用產(chǎn)品?？紤]有視力障礙，聽力障礙和其他殘疾的用戶如何與你的應(yīng)用互動。

1. 注意色盲人群

全球人口中有4.5％患有色盲（每12名男性中有1名，每200名女性中有1名），有4％的人視力低下（每30人中有1人），有0.6％的人是盲人（每188人中有1人）。很容易忘記我們是為這類用戶設(shè)計的，因為大多數(shù)設(shè)計師都不會遇到此類問題。

舉一個簡單的例子。移動端表單的成功和錯誤消息通常分別以綠色和紅色顯示，但是紅色和綠色是受色覺不足影響最大的顏色。填寫表格時，你很可能已經(jīng)看到以下錯誤消息：“紅色字段為必填項”？雖然這看起來似乎不是一件大事，但此錯誤消息與以下示例中的表格相結(jié)合，對于色覺不足的人來說可能是極其令人沮喪的體驗。

(色盲用戶無法區(qū)分以紅色突出顯示的字段）

正如 W3C的指導(dǎo)原則所指出的那樣，顏色不應(yīng)該用作傳達信息，指示操作，提示響應(yīng)或區(qū)分視覺元素的唯一視覺手段。使用其他視覺指示符以確保用戶能夠與界面進行交互非常重要。

(使用圖標和標簽顯示哪些字段無效可以更好地將信息傳達給色盲用戶）

2. 將動畫設(shè)為可選

暈車的用戶通常會在其OS設(shè)置中關(guān)閉動畫效果。在輔助功能偏好設(shè)置中啟用減少動作選項后，你的應(yīng)用應(yīng)最小化或消除其自己的動畫。

四、簡化導(dǎo)航

每個應(yīng)用程序都應(yīng)優(yōu)先考慮幫助用戶使用導(dǎo)航。如果人們找不到它們，則應(yīng)用程序具有的所有出色功能和引人入勝的內(nèi)容都將無關(guān)緊要；同樣，如果花太多時間或精力去發(fā)現(xiàn)如何使用你的產(chǎn)品，你很可能會失去用戶。

用戶應(yīng)該能夠直觀地探索該應(yīng)用程序，并且無需任何解釋即可完成所有主要任務(wù)。

1. 使用標準導(dǎo)航組件

最好使用標準的導(dǎo)航模式，例如標簽欄（對于iOS）和抽屜式導(dǎo)航欄（對于Android）。大多數(shù)用戶都熟悉兩種導(dǎo)航模式，并且會直觀地知道如何使用你的應(yīng)用程序。

(側(cè)抽屜（Android））

(標簽欄（iOS））

2. 優(yōu)先考慮導(dǎo)航選項

根據(jù)用戶與你的應(yīng)用互動的方式確定導(dǎo)航的優(yōu)先級。為常見的用戶任務(wù)分配不同的優(yōu)先級（高，中，低）。在UI中突出顯示具有高優(yōu)先級和頻繁使用的路徑和目的地。使用這些路徑定義導(dǎo)航。以一種需要最少數(shù)量的單擊、滑動和屏幕來組織你的信息結(jié)構(gòu)。

3. 不要混雜導(dǎo)航模式

當你為你的應(yīng)用選擇一個主要的導(dǎo)航模式時，要始終如一地使用它。不應(yīng)該有這樣的情況，你的應(yīng)用程序的一部分有一個標簽欄，而另一部分有一個抽屜式導(dǎo)航欄。

4. 導(dǎo)航可見

正如雅各布·尼爾森所說，認識某件事比記住它容易。通過使操作和選項可見來最小化用戶的使用負擔(dān)。導(dǎo)航應(yīng)該在任何時候都可用，而不僅僅是在我們預(yù)期用戶需要它的時候才可用。

5. 明確當前位置

在許多移動應(yīng)用程序菜單中，不指明當前位置是一個非常常見的問題。人們隨時都應(yīng)該知道他們在應(yīng)用程序中的位置。

(Health data被突出顯示和Activity在布局的頂部可見）

6. 使用功能性動畫闡明導(dǎo)航的轉(zhuǎn)換

動畫是描述狀態(tài)轉(zhuǎn)換的最佳工具。它可以幫助用戶了解頁面布局中的狀態(tài)更改，觸發(fā)更改的原因以及在需要時如何再次發(fā)起更改。

(復(fù)雜的過渡易于理解）

7. 在UI中小心使用手勢

在交互設(shè)計中使用手勢可能很誘人，但是在大多數(shù)情況下，最好避免這種誘惑。當手勢用作主要導(dǎo)航選項時，它們會導(dǎo)致糟糕的UX。為什么？因為手勢是隱藏的控件。

正如托馬斯·約斯指出的在用戶界面中使用手勢的最大缺點是學(xué)習(xí)曲線。每次將可見控件替換為手勢時，應(yīng)用程序的學(xué)習(xí)曲線就會上升。發(fā)生這種情況是因為手勢的可發(fā)現(xiàn)性較低——它們始終是隱藏的，并且人們需要能夠識別這些選項才能使用它們，這就是為什么僅使用廣泛接受的手勢的原因。

在UI中使用手勢時，請遵循一些簡單的規(guī)則：

1）使用標準手勢

“標準”是指你所在類別中最適合應(yīng)用的手勢。人們熟悉標準手勢，因此無需額外的努力即可發(fā)現(xiàn)或記住它們。

2）提供手勢作為可見導(dǎo)航選項的補充，而不是替代

手勢可以用作導(dǎo)航的快捷方式，但不能完全替代可見菜單。因此，即使這意味著一些額外的操作，也始終提供一種簡單可見的導(dǎo)航方式。

本文作者：Nick Babich

原文地址：https://www.smashingmagazine.com/2018/02/comprehensive-guide-to-mobile-app-design/

本文由 @Kris 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議