雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁 案例 服務(wù) 關(guān)于 face+

移動ui設(shè)計基本界面有哪些?這些常見界面你知道嗎

Time: 2021-04-09

現(xiàn)在人們的生活越發(fā)智能化,手機已然成為當(dāng)下人們經(jīng)常用到的一種設(shè)備,這也讓更多開始使用手機享受便利生活,那么移動ui設(shè)計基本界面有哪些?下面讓我們一起詳細(xì)了解下吧。

  常見界面

  啟動界面

  用戶對app的第一印象是至關(guān)重要的,它是影響用戶對app體驗的重要因素之一。當(dāng)app從一開始的交互體驗就很棒時,這款app會更加容易受用戶歡迎。這就是我們對啟動界面的重視度跟其他頁面相同的原因。

  啟動界面是用戶打開app第一個出現(xiàn)的頁面。通常都是極簡風(fēng)格,僅僅展現(xiàn)一個名字,logo或產(chǎn)品標(biāo)語。設(shè)計師為了確保啟動界面在不同設(shè)備的視覺效果,通常將設(shè)計元素放于頁面中間。建議啟動界面出現(xiàn)不超過4-8秒,超過這個時間,用戶可能會感到干擾。并且,向用戶展示加載過程也是挺好的,這樣不耐心的用戶也能知道app什么時候能夠正式啟動。

  入門教程界面

  入門教程界面是一系列展示app的頁面,包括app的導(dǎo)航,功能和對潛在用戶帶來的好處。這些頁面是在用戶第一次啟動app時出現(xiàn)的,可以幫助用戶了解app功能特性,同時了解app是否對他們有用。

  每一特定的app的教程界面的結(jié)構(gòu)和內(nèi)容都不同。但是,現(xiàn)在入門界面都有一些共同趨勢。首先,很多教程頁面使用一些自定義的插畫以一種趣味的方式來表示特定的功能或優(yōu)勢。而且,設(shè)計師經(jīng)常用一個吉祥物,就像是與用戶進行真正的交流,建立感情聯(lián)系。一個強有力的標(biāo)語提示對入門也很重要。提示應(yīng)該簡短,有用并且可讀。

  首頁和菜單頁

  對于任何一個app而言,首頁都是很重要的部分。在移動端app中,首頁是用戶進行最多交互選項的頁面。首頁的設(shè)計取雖然取決于不同的產(chǎn)品和產(chǎn)品用途,但是還是有一些重要元素是類似的。首先,首頁通常應(yīng)該有搜索框或按鈕,以便用戶查找需要的內(nèi)容。而且,鑒于首頁是用戶使用產(chǎn)品的開始,所以首頁應(yīng)該包含導(dǎo)航功能,以便用戶能進入不同的區(qū)域。

  為了方便用戶交互體驗,移動端app的菜單展示應(yīng)該包含用戶可能點擊移動的所有方向。這里有兩種app中菜單的展示方式:菜單可以在首頁里,也可以在一個單獨的頁面。建議菜單種類不超過7種,只顯示重要的種類。如果app需要更多種類,可以創(chuàng)建子分類。

  登錄界面和個人資料界面

  現(xiàn)在很多的app都可以讓用戶自己創(chuàng)建賬號,所以設(shè)計師也需要知道如何設(shè)計登錄界面和個人資料界面。登錄界面應(yīng)該是極簡,清晰,以便用戶登錄app。通常只有姓名,密碼和一按鈕。對于那些第一次登錄app的用戶來說,通常還應(yīng)該有一個注冊的選項。

  App里有了個人資料頁面,會使app更加個性化,根據(jù)每個用戶的特征進行有效的app內(nèi)數(shù)據(jù)處理。另外,對于任何社交app,個人賬號都是一個很重要的一部分,用戶有了賬號,就可以加入網(wǎng)絡(luò)上的虛擬社交群體,跟其他人分享個人信息。設(shè)計師的最大職責(zé)就是通過智能的用戶體驗將個人資料的便易性最大化體現(xiàn)。

  根據(jù)交互設(shè)計組織所說,設(shè)計師需要考慮的第一點就是個人資料頁一定要清晰易用。個人資料頁面信息是有一定數(shù)量限制的,以免這個頁面太過復(fù)雜。并且,app的導(dǎo)航一定要是直觀易懂的。這樣的話,用戶才不需要苦苦思索app的操作。最后,app的個人資料頁應(yīng)該是針對特定目標(biāo)群體。如果你需要app滿足用戶需求的話,那么必須做用戶調(diào)研。

  狀態(tài)界面

  很多app都有用戶活動的狀態(tài)。數(shù)據(jù)越多,狀態(tài)界面越難設(shè)計。設(shè)計師需要確保能在界面上看到所有的關(guān)鍵數(shù)據(jù),并且界面清晰可用。設(shè)計師可以用圖形曲線,刻度和原始圖標(biāo)來讓狀態(tài)界面在app上看起來流暢,簡潔。并且,狀態(tài)界面上還需要使用特定的字體,這樣用戶才能輕松辨別出數(shù)據(jù)。

  日歷

  事件app,待辦事項app和其他app都會為用戶提供專屬的日歷。根據(jù)不同類型的app,日歷也會有特定的功能,比如提醒或是安排。日歷的視覺效果應(yīng)該符合app的調(diào)性和目標(biāo)。

移動ui設(shè)計

移動ui設(shè)計(圖片來自網(wǎng)絡(luò))


  電商界面

  目錄界面

  任何一個電商app的主要目標(biāo)都是賣產(chǎn)品。App的視覺體驗對用戶的消費決策有巨大影響。商家把促銷的產(chǎn)品放在目錄下進行售賣。設(shè)計師的任務(wù)就是設(shè)計出吸引用戶并刺激購買的目錄。App的產(chǎn)品列表可以與很多其他電商網(wǎng)站類似,商品以系列形式擺放,用戶可以垂直滑動進行查看。每一行的產(chǎn)品數(shù)量根據(jù)屏幕的寬度不同而有所不同。

  移動端目錄的另一種擺放產(chǎn)品的方式是每行展示產(chǎn)品,通過水平滑動進行切換。

  為了讓導(dǎo)航更加直觀,水平方向行里的最后一個產(chǎn)品應(yīng)該不完全展示,這樣用戶就能明白滑動的方向。并且,產(chǎn)品圖片和插圖應(yīng)該是高質(zhì)量的,這樣用戶才能清晰看清購買的產(chǎn)品。目錄界面還應(yīng)該有一個立即購買的按鈕,以便用戶直接添加購物車進行購買。這樣的話,用戶可以直接從目錄界面挑選產(chǎn)品,不需要一定要在某個特定頁面進行購買。

  產(chǎn)品卡片界面

  這個界面是為了那些清楚知道自己想買什么的用戶設(shè)計的。產(chǎn)品卡片上會展示產(chǎn)品的關(guān)鍵信息,以便用戶抉擇他們是否需要這個產(chǎn)品。設(shè)計師著重于產(chǎn)品圖片,將圖片放在屏幕中間。產(chǎn)品描述一般放在下方。設(shè)計師可以把產(chǎn)品信息分組,比如尺寸,材質(zhì)或其它,這樣用戶就可以輕易找到他們需要的信息。

  結(jié)算界面

  現(xiàn)在很多人都是通過智能手機進行購買,所以商家盡可能優(yōu)化移動端的購物流程,讓此流程變得比以往都更加方便。結(jié)算是用戶購買產(chǎn)品的最后一步。設(shè)計師的任務(wù)就是優(yōu)化用戶在結(jié)算時的用戶體驗。結(jié)算界面第一個部分也是最重要的部分之一就是一個表格,買家需要在這個表格里填上一些特定的個人信息,比如姓名和信用卡卡號。信息種類取決于用戶購買的平臺。另外,還有很重要的一點是,用戶需要確保他們填入的私人信息是安全的,所以設(shè)計師應(yīng)該設(shè)計一些視覺元素來告訴用戶信息的安全性。這些安全元素可以是一些標(biāo)注,知名品牌授權(quán)的圖標(biāo),或者如果是證書的話,也可以是一些證書圖標(biāo)。

  社交界面

  動態(tài)消息流

  人們通常會用很多社交平臺app進行交流,并且還可以關(guān)注新聞和更新消息。動態(tài)消息流會持續(xù)變化地展示新聞和一些其它用戶關(guān)注的內(nèi)容。實踐表明移動端用戶更傾向于快速瀏覽動態(tài)信息流,所以用戶需要簡單,清晰的動態(tài)信息流設(shè)計,不會被視覺設(shè)計細(xì)節(jié)所累贅。新聞可以一次滑動展示一條。下一條新聞應(yīng)該是部分顯示,這樣可以讓導(dǎo)航更加直觀。

  通訊錄

  通訊錄已經(jīng)發(fā)展了很長一段時間。從紙質(zhì)的筆記到不同的數(shù)字載體,視覺上已經(jīng)變化很多,但始終只有一個目的:保存朋友和其他近交的關(guān)鍵信息。手機通訊錄是將通訊錄的信息以姓名的字母順序進行排序。每一個聯(lián)系人都是可以點擊的,點擊之后進入詳細(xì)信息,包括電話號碼,郵箱,有時候還有Skype,Messenger等的通訊信息。另外,聯(lián)系人信息一般都伴有一張頭像,便于搜索。

  音樂界面

  播放列表

  音樂愛好者喜歡為每個情景創(chuàng)建自己的播放列表。很明顯,每個音樂app都應(yīng)該有這個功能。不同app的播放列表界面都很相似:一個音樂列表,顯示歌名,歌手名稱或樂隊名稱,和音樂的長度。另外,設(shè)計師也可以為音樂所屬專輯添加一張小圖片。為了以防歌曲沒有圖片,所以應(yīng)該有一個圖標(biāo)顯示,比如,一個音符。

  播放器

  人們可以通過播放器來控制他們聽的音樂和聽音樂的方式。播放器的功能包括切換歌曲,暫停和用易于識別的按鈕來播放新歌曲。這一部分一般是放在屏幕下方的中間部分。播放器界面的大部分都是放一張圖片。另外,有些時候,除了圖片,很多設(shè)計師會采用音樂視覺效果在屏幕中間。音樂視覺效果是發(fā)揮想象力和創(chuàng)造力的好機會,這對設(shè)計師而言是激發(fā)的作用。

移動ui設(shè)計

移動ui設(shè)計(圖片來自網(wǎng)絡(luò))


  以上是小編為大家介紹的有關(guān)移動ui設(shè)計的相關(guān)內(nèi)容,相信大家在看完之后也清楚了吧,歡迎關(guān)注我們的網(wǎng)站了解更多信息。


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號22號樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點地圖
北京辦公地點地圖
深圳辦公地點地圖
在微信中搜索faceui
或保存二維碼在微信中打開