移動應(yīng)用程序隨著用戶的需求而發(fā)展，提供了新的功能，但是，許多應(yīng)用程序都有常見的界面樣式，它們是本文的重點(diǎn)。

智能手機(jī)幾乎侵入了我們生活中的每一項(xiàng)活動。不同的應(yīng)用程序可以幫助我們，讓生活更輕松，設(shè)計(jì)師的工作是創(chuàng)建滿足用戶需求的用戶界面，使體驗(yàn)愉快和令人滿意。為了構(gòu)建有效的UI，設(shè)計(jì)人員需要深入了解移動應(yīng)用程序的特性，了解它們的組成部分和功能。如今，很難為任何應(yīng)用程序區(qū)分一套標(biāo)準(zhǔn)的必要屏幕UI，因?yàn)橐苿有袠I(yè)正在快速發(fā)展，應(yīng)用也是如此。我們的文章介紹了最常見和最受歡迎的移動屏幕類型，并展示了它們所需的設(shè)計(jì)功能。

常見頁面

啟動畫面

第一印象是影響用戶對移動應(yīng)用程序的意見的關(guān)鍵點(diǎn)之一。當(dāng)用戶體驗(yàn)從與應(yīng)用程序的交互一開始就很愉快時，它就會更有可能在用戶中更受歡迎。這就是為什么啟動畫面需要像其他任何移動應(yīng)用程序屏幕一樣受到關(guān)注。

啟動畫面是用戶看到啟動移動應(yīng)用程序的第一個圖像。它們通常是簡約的，并且提供產(chǎn)品的名稱，徽標(biāo)或標(biāo)語。為了確保閃屏在不同設(shè)備上看起來很好，設(shè)計(jì)師通常會將元素集中在屏幕中間。建議飛濺屏幕顯示不超過4-8秒，否則用戶可能會生氣。此外，顯示加載進(jìn)度可能會很好，這樣不耐煩的用戶就可以知道應(yīng)用程序何時啟動。

珠寶電子商務(wù)應(yīng)用程序

入職教程界面

新手引導(dǎo)是一組屏幕，展示了應(yīng)用程序可能為用戶帶來的移動應(yīng)用程序，導(dǎo)航系統(tǒng)，功能和優(yōu)勢。對于首次啟動應(yīng)用程序的用戶來說，他們似乎可以幫助他們在不熟悉的功能和控件中進(jìn)行定位，并了解應(yīng)用程序是否對他們有用。

應(yīng)用教程的結(jié)構(gòu)和內(nèi)容對于每個特定項(xiàng)目都是高度個性化的。但是，入職設(shè)計(jì)存在一些共同傾向。首先，許多教程使用自定義插圖，以有吸引力且易于解碼的方式呈現(xiàn)特定功能或優(yōu)點(diǎn)。此外，設(shè)計(jì)師經(jīng)常使用吉祥物，這是一個模仿與用戶進(jìn)行真實(shí)交流并設(shè)置情感紐帶的角色。強(qiáng)大的副本對于入職也很重要。它應(yīng)該簡短，有用且易讀。

海底世界百科全書 - 部分教程

主頁和菜單屏幕

主屏幕是任何應(yīng)用程序的重要組成部分。在移動應(yīng)用程序的上下文中，它是用戶與應(yīng)用程序的大多數(shù)選項(xiàng)進(jìn)行交互的主屏幕。主屏幕的設(shè)計(jì)取決于產(chǎn)品的類型，其目的仍然是一些不同類型的共同關(guān)鍵元素。首先，主屏幕通常包括搜索字段或按鈕，以便用戶可以輕松搜索他們需要的內(nèi)容。此外，由于主屏幕是用戶旅程的起點(diǎn)，因此它通常包含提供對各種內(nèi)容部分的訪問的導(dǎo)航元素。

家庭應(yīng)用程序

為了使用戶交互更容易，移動應(yīng)用程序包含一個菜單，其中包含用戶可以在一次單擊中移動到的可能方向列表。在移動應(yīng)用程序中呈現(xiàn)菜單有兩種變體：它可以是主屏幕的一部分或單獨(dú)的屏幕。建議將菜單中的選項(xiàng)數(shù)保持在7以下，僅顯示重要部分。如果應(yīng)用程序需要更多，則創(chuàng)建子類別可能是個好主意。

幻燈片菜單概念

登錄和配置文件屏幕

今天，許多應(yīng)用程序?yàn)橛脩魟?chuàng)建個人帳戶，因此每個設(shè)計(jì)師都需要知道如何使用登錄和配置文件屏幕。登錄屏幕應(yīng)該簡潔明了，以便用戶可以輕松訪問應(yīng)用程序。通常有兩個字段，用戶可以在其中輸入其名稱和密碼以及確認(rèn)按鈕。對于第一次使用該應(yīng)用程序的用戶，始終必須有注冊選項(xiàng)。

配置文件使移動應(yīng)用程序內(nèi)的交互更加個性化，并允許有效地操作數(shù)據(jù)。此外，個人帳戶是任何社交網(wǎng)絡(luò)應(yīng)用程序的關(guān)鍵部分，其涉及用戶進(jìn)入網(wǎng)絡(luò)的虛擬社區(qū)并且能夠與其他人共享個人信息。設(shè)計(jì)師的主要任務(wù)是通過智能UX最大限度地提高便利性。根據(jù)交互設(shè)計(jì)基金會，第一點(diǎn)設(shè)計(jì)者應(yīng)該考慮的是，配置文件頁面應(yīng)該清晰使用。必須限制信息量，否則配置文件屏幕可能看起來太復(fù)雜。更重要的是，確保導(dǎo)航系統(tǒng)直觀是至關(guān)重要的。這樣，用戶就不必花費(fèi)太多精力來解開應(yīng)用程序。最后，配置文件屏幕設(shè)計(jì)應(yīng)面向應(yīng)用程序的目標(biāo)受眾。如果您希望您的應(yīng)用滿足用戶需求，則必須進(jìn)行用戶調(diào)查。

約會應(yīng)用

統(tǒng)計(jì)屏幕

各種應(yīng)用程序包含用戶活動的統(tǒng)計(jì)信息。它提供的數(shù)據(jù)越多，創(chuàng)建統(tǒng)計(jì)屏幕的移動設(shè)計(jì)就越困難。設(shè)計(jì)人員需要確保能夠看到屏幕必須清晰可用的所有關(guān)鍵信息。圖形曲線，比例和原始圖標(biāo)可以使統(tǒng)計(jì)屏幕在移動應(yīng)用程序上看起來流暢和干凈。此外，統(tǒng)計(jì)屏幕需要不同的排版，以便用戶可以輕松讀取數(shù)據(jù)。

NGIN App

日歷

活動應(yīng)用，待辦事項(xiàng)列表應(yīng)用以及許多其他應(yīng)用為用戶提供個人日歷。根據(jù)應(yīng)用程序的類型，日歷可以完成某些功能，例如提醒或計(jì)劃。視覺風(fēng)格應(yīng)該適合移動應(yīng)用程序的心情和目標(biāo)。

Vibe日歷

電子商務(wù)屏幕

目錄屏幕

任何電子商務(wù)項(xiàng)目的主要目標(biāo)是銷售產(chǎn)品。視覺呈現(xiàn)對用戶的決策有很大影響。目錄是公司出售的商品清單。設(shè)計(jì)師的工作是創(chuàng)建目錄，吸引用戶注意并鼓勵他們購買產(chǎn)品。移動應(yīng)用程序中的產(chǎn)品列表可以類似于許多電子商務(wù)網(wǎng)站，其中的項(xiàng)目放置在catenas中，可以通過垂直滾動查看。一行中的產(chǎn)品數(shù)量根據(jù)屏幕寬度確定。

移動目錄中產(chǎn)品組織的另一種方法是具有水平滾動的行。為了使導(dǎo)航更直觀，水平行中的最后一項(xiàng)不應(yīng)顯示在完整視圖中，以便讓用戶看到這是滾動的方向。此外，產(chǎn)品的照片或插圖應(yīng)該是高質(zhì)量的，以便用戶可以清楚地看到他們將要購買的東西。目錄屏幕應(yīng)包括一個號召性用語按鈕，用戶可以通過該按鈕將項(xiàng)目添加到購物車。這樣，用戶就可以直接從目錄屏幕上獲取產(chǎn)品，而無需轉(zhuǎn)到此特定位置的頁面。

咖啡廳優(yōu)惠券應(yīng)用程序

產(chǎn)品卡屏幕

此屏幕適用于想知道他們究竟購買什么的人。產(chǎn)品卡顯示有關(guān)商品的關(guān)鍵信息，幫助用戶決定是否需要產(chǎn)品。設(shè)計(jì)師專注于產(chǎn)品的照片，將其置于屏幕的中心。描述數(shù)據(jù)通常放在下面。設(shè)計(jì)人員可以將數(shù)據(jù)劃分為大小，材料或其他組，以便用戶可以輕松找到所需的信息。

珠寶電子商務(wù)應(yīng)用程序

看看屏幕

今天，很多購買都是通過智能手機(jī)完成的，因此公司試圖讓移動購物流程變得前所未有的方便。結(jié)帳過程是用戶的最后一步在他們購買產(chǎn)品之前服用。設(shè)計(jì)師的任務(wù)是讓人們在采取這一步驟時感到舒適。結(jié)賬屏幕的第一個和其中一個基本部分是買方填寫特定個人數(shù)據(jù)（如信用卡的名稱和編號）的表格。所需信息的類型取決于用戶進(jìn)行購買的資源。此外，對于人們來說，了解他們的個人數(shù)據(jù)是安全的很重要，因此設(shè)計(jì)師必須通過視覺元素向用戶保證他們的信息是安全的。它可以是副本中的標(biāo)注，也可以是知名品牌的一些圖標(biāo)，如果有的話，可以給予他們的批準(zhǔn)，甚至可能是一些證書標(biāo)志。

電影應(yīng)用

社交屏幕

飼料

人們經(jīng)常使用各種社交網(wǎng)絡(luò)應(yīng)用程序進(jìn)行通信，并關(guān)注它們周圍的新聞和更新。Feed是一個不斷變化的新聞和用戶選擇遵循的其他數(shù)據(jù)列表。實(shí)踐表明，移動用戶更喜歡通過Feed快速掃描，因此他們需要一個簡單明了的設(shè)計(jì)，不會因視覺細(xì)節(jié)而過載。新聞可以通過滾動逐一呈現(xiàn)。為了使導(dǎo)航更直觀，應(yīng)該部分顯示下一條新聞。

時間線應(yīng)用程序

往來

聯(lián)系人名單已經(jīng)發(fā)展了很長時間。從紙質(zhì)筆記到不同的數(shù)字變體，它在視覺上一直在變化，但仍然只提供一個目的：保存關(guān)于朋友和其他親密人物的關(guān)鍵數(shù)據(jù)。移動聯(lián)系人屏幕向用戶顯示按名稱按字母順序排序的聯(lián)系人數(shù)據(jù)列表。每個聯(lián)系人都應(yīng)該是可點(diǎn)擊的，并提供詳細(xì)的數(shù)據(jù)，其中包括電話號碼，電子郵件，有時還包括Skype，Messenger等聯(lián)系人。此外，聯(lián)系信息提供了一張小照片，使搜索過程更容易。

聯(lián)系清單概念

音樂屏幕

播放列表

音樂愛好者喜歡為每個場合創(chuàng)建自己的播放列表。顯然，每個音樂應(yīng)用程序都有義務(wù)為其用戶提供此類功能。播放列表屏幕在不同的應(yīng)用程序上看起來類似：它是一個軌道列表，顯示歌曲，歌手或樂隊(duì)的名稱，以及音軌的長度。此外，設(shè)計(jì)師可以添加此曲目所屬的專輯的小圖像。如果歌曲沒有圖像，那么仍然應(yīng)該有一個圖標(biāo)，例如，帶有音符。

音樂應(yīng)用

播放機(jī)

人們可以控制他們聽的內(nèi)容以及他們?nèi)绾瓮ㄟ^播放器收聽。該功能允許使用易于識別的標(biāo)準(zhǔn)按鈕切換，停止和啟動軌道。該組通常位于屏幕底部的中央。屏幕的主要部分通常由附加的圖像拍攝。此外，有時候不是圖片，許多設(shè)計(jì)師將音樂可視化器應(yīng)用為屏幕的中心部分。Visualizer是一個展示想象力和創(chuàng)造力的好機(jī)會，這對設(shè)計(jì)師來說總是很有啟發(fā)性。

ECHO應(yīng)用程序

如今，出現(xiàn)了大量的移動應(yīng)用程序，因此它們?yōu)橛脩魩淼男乱髱砹诵滦推聊?。設(shè)計(jì)師應(yīng)該準(zhǔn)備好接受這一挑戰(zhàn)并始終遵循創(chuàng)新。得到靈感！

翻譯整理文章不易，打賞個5毛錢吧！

推薦閱讀

2019年設(shè)計(jì)趨勢指南(全集）

網(wǎng)頁設(shè)計(jì)：Web內(nèi)容的5種基本圖像類型

公眾號：設(shè)計(jì)攝影