如何從設(shè)計(jì)層面創(chuàng)造一個(gè)優(yōu)美的app界面來(lái)吸引用戶已然成為廣大App開(kāi)發(fā)者們必做的功課之一。

 

 

根據(jù)調(diào)查顯示, iOS與Android的市場(chǎng)份額差距正越來(lái)越大。Android設(shè)備正在成為手機(jī)應(yīng)用市場(chǎng)的主力軍。如何從設(shè)計(jì)層面創(chuàng)造一個(gè)優(yōu)美的app界面來(lái)吸引用戶已然成為廣大App開(kāi)發(fā)者們必做的功課之一。

盡管蘋(píng)果的扁平化設(shè)計(jì)風(fēng)格在這幾年出盡了風(fēng)頭，但Material design主導(dǎo)下的Android應(yīng)用界面設(shè)計(jì)也是非常值得設(shè)計(jì)師學(xué)習(xí)和重視的。以下是Mockplus（摩客）為大家整理的一些界面設(shè)計(jì)非常優(yōu)秀的安卓應(yīng)用。

1. Eye In Sky Weather

 

與iOS一樣，谷歌Play商店中也有大量的天氣應(yīng)用。Eye in Sky Weather以其簡(jiǎn)約，全息主題和用戶所期待的天氣應(yīng)用程序應(yīng)有的基本功能而脫穎而出。該應(yīng)用程序包括14個(gè)最好的天氣圖標(biāo)集，可以添加自己的圖標(biāo)集。還有四個(gè)高度可定制的小部件和一個(gè)可擴(kuò)展的通知,還有一個(gè)DashClock擴(kuò)展。

2. Snapseed

 

Snapseed是Google提供的綜合照片編輯應(yīng)用程序。除了擁有Instagram提供的基本編輯功能之外，Snapseed的這種編輯模式使得照片編輯變得前所未有的簡(jiǎn)單。許多照片編輯應(yīng)用程序的編輯過(guò)程都顯得非常笨重，但Snapseed保持簡(jiǎn)單風(fēng)格的同時(shí)還提供了很多可輕松調(diào)整的選項(xiàng)。

當(dāng)然，你可以改變燈光和添加濾鏡，但重新聚焦圖像和改變膠片風(fēng)格的能力使得他們的工具箱是獨(dú)一無(wú)二的。最后，根據(jù)您之前制作的節(jié)省，重新編輯的能力使得這個(gè)應(yīng)用程序成為我最喜歡的照片編輯器。

3. YouTube

 

作為全球最大的視頻共享網(wǎng)站，YouTube自2005年成立以來(lái)一直受益于他們的智能設(shè)計(jì)。同樣的靈感貫穿到今天，并且可以看到移動(dòng)應(yīng)用程序易于使用的服務(wù)。

同樣，雖然YouTube不是專門(mén)的移動(dòng)應(yīng)用程序，但YouTube視頻中超過(guò)一半的視圖都是通過(guò)移動(dòng)設(shè)備完成的。 2017年這樣的應(yīng)用程序的必要性是非常明顯的。

YouTube在保持設(shè)計(jì)的可訪問(wèn)性和新鮮度方面做得很好，每?jī)芍芨乱淮螒?yīng)用程序，并使設(shè)計(jì)適應(yīng)它們對(duì)平臺(tái)所做的更改。事實(shí)上，大多數(shù)用戶也更喜歡移動(dòng)版本。

4. Pinterest

 

Pinterest可以說(shuō)是最美Android應(yīng)用程序設(shè)計(jì)的競(jìng)爭(zhēng)者之一。 從詳細(xì)的注冊(cè)流程到照片的全面展示，Pinterest為用戶界面添加了足夠的細(xì)節(jié)，使圖片和內(nèi)容保持在中心位置。

5.  Trello

 

Trello是一個(gè)項(xiàng)目管理和組織工具，主要工作是他們所謂的“看板”。每個(gè)看板可以對(duì)應(yīng)不同的任務(wù)或責(zé)任，需要完成。 簡(jiǎn)單而明顯的設(shè)計(jì)使得工作可以更快地完成，并減少了各方之間的交流錯(cuò)誤。

Trello是一個(gè)很好的用戶體驗(yàn)設(shè)計(jì)的案例，因?yàn)樗鼪](méi)有太多不必要的功能。 應(yīng)用程序主屏幕上的所有內(nèi)容都很容易理解，并且完全按照應(yīng)用程序的方式工作，不會(huì)對(duì)任何從一個(gè)板到另一個(gè)板的任務(wù)產(chǎn)生任何困惑。 界面設(shè)計(jì)非常直觀，第一次使用應(yīng)用程序的用戶可以輕松瀏覽不同的頁(yè)面。

6. Slack

 

Slack是適合各種團(tuán)隊(duì)的溝通工具。 無(wú)論是計(jì)劃一個(gè)事件，從事某個(gè)項(xiàng)目，還是只是厭倦了電子郵件，Slack正在成為專業(yè)人士之間使用最廣泛的工具之一。 這個(gè)成功的關(guān)鍵原因是他們簡(jiǎn)單而強(qiáng)大的設(shè)計(jì)。

雖然Slack不是專門(mén)的移動(dòng)應(yīng)用程序，但他在移動(dòng)設(shè)備上的用戶體驗(yàn)并不比在計(jì)算機(jī)上使用差。您需要的所有內(nèi)容都非常清晰地放在左側(cè)的下拉菜單中，而團(tuán)隊(duì)Feed始終在應(yīng)用程序的主要區(qū)域進(jìn)行更新。

7. Duolingo 

 

Duolingo是一家語(yǔ)言學(xué)習(xí)公司，教導(dǎo)用戶如何通過(guò)迷你游戲和簡(jiǎn)短的課程講不同的語(yǔ)言。 該公司成立于2009年，已經(jīng)達(dá)到1億用戶，并且一直在持續(xù)增長(zhǎng)中，主要是由于他們的應(yīng)用程序非常簡(jiǎn)單，技術(shù)也在不斷的創(chuàng)新。

任何使用Duolingo的人都能理解應(yīng)用程序的簡(jiǎn)單性。 通過(guò)完成一個(gè)任務(wù)或游戲，您可以轉(zhuǎn)到更高級(jí)的類別。 結(jié)合移動(dòng)游戲應(yīng)用程序的成癮性，并使用它來(lái)學(xué)習(xí)新的語(yǔ)言也是一個(gè)很棒的主意，在此基礎(chǔ)上的用戶體驗(yàn)也是吸引用戶的因素之一。

8.Wickr

 

與許多有效的移動(dòng)應(yīng)用程序UI設(shè)計(jì)一樣，Wickr非常簡(jiǎn)單。 它可以完美地處理安全的消息，同時(shí)保持其基本的黑色和白色的設(shè)計(jì)。 無(wú)論用戶是出于商業(yè)還是個(gè)人目的選擇，都是安全發(fā)送加密消息的有效方式。 它具有群組消息功能，以及一對(duì)一的通信。 信息發(fā)送者可以控制消息，圖像或視頻可以被查看多長(zhǎng)時(shí)間。 像Snapchat的消息只能顯示1-10秒鐘，隨著時(shí)間的推移，它會(huì)數(shù)字化地“碎片化”已刪除的消息。

9. Hipmunk

 

Hipmunk是計(jì)劃旅行的最快，最簡(jiǎn)單的方法。 這個(gè)程序?qū)⑼ㄟ^(guò)比較所有的頂級(jí)旅游網(wǎng)站節(jié)省您的時(shí)間，包括設(shè)置您想要前往某一天的目的地的提醒，查看其他乘客的評(píng)論，預(yù)訂航班，根據(jù)您想要最接近的目的搜索酒店房間等等。

我真正喜歡它的設(shè)計(jì)方面是，它可以根據(jù)您的需求，例如基于卡片布局的城市訪問(wèn)，或適合某個(gè)預(yù)算的酒店的最佳時(shí)間）量身定制您的視圖。 這是一個(gè)真正可定制的預(yù)訂旅行安排的應(yīng)用。

10. PEAR Sports

 

PEAR是一款個(gè)性化的健身應(yīng)用程序，集合了數(shù)以千計(jì)的鍛煉與私人教練。 這個(gè)應(yīng)用程序可以對(duì)用戶的健康數(shù)據(jù)做出實(shí)時(shí)反應(yīng)，以適應(yīng)用戶的具體需求的鍛煉。比如跑步，騎自行車和舉重訓(xùn)練，并根據(jù)你的選擇對(duì)你進(jìn)行實(shí)時(shí)鼓勵(lì)。 它與所有主要的健身追蹤器和應(yīng)用程序同步，以保持所有的鍛煉數(shù)據(jù)易于管理。 最重要的是，你可以隨心所欲地打開(kāi)或關(guān)閉手機(jī)。 如果您正在做瑜伽或其他需要雙手的東西，您的私人教練可以純粹通過(guò)音頻來(lái)指導(dǎo)。 例如，如果您在跑步機(jī)上跑步，則會(huì)提供有用的心率圖形，燃燒的卡路里以及總體進(jìn)度。 總的來(lái)說(shuō)，這是一個(gè)非常有用的應(yīng)用程序，考慮到個(gè)性的健身，以及其可定制的功能和設(shè)計(jì)。

更多UI設(shè)計(jì)資源

1. developer.android

作為安卓開(kāi)發(fā)者，可以參考Google的Android Design規(guī)范，官方對(duì)于如何做好Android App的UI設(shè)計(jì)一直有著很多的導(dǎo)引和建議。

2. Github

Github的UI設(shè)計(jì)板塊收集了很多設(shè)計(jì)相關(guān)的素材和優(yōu)秀設(shè)計(jì)站點(diǎn)。不僅僅限于Android應(yīng)用界面設(shè)計(jì)。

視頻教程

1.How to Design Android UI/GUIs in Android Studio

這個(gè)視頻向Eclipse用戶解釋如何使用Android Studio為你的應(yīng)用程序創(chuàng)建圖形用戶界面。 視頻很長(zhǎng)（接近一個(gè)小時(shí)），但流程邏輯上很容易。

2. Android UI Tutorial: Layouts and Animations

Android UI布局和動(dòng)畫(huà)的最佳教程之一。 它教你如何使用Android Studio創(chuàng)建不同的布局（框架布局，線性布局，相對(duì)布局和網(wǎng)格布局），視圖（TextView，ListView，ImageView，GridView，RecyclerView）和動(dòng)作（屬性動(dòng)畫(huà)，可繪制動(dòng)畫(huà)）。 本教程適用于初學(xué)者和高級(jí)設(shè)計(jì)人員，并且可以在GitHub上使用該項(xiàng)目。

關(guān)于原型設(shè)計(jì)

一個(gè)應(yīng)用的設(shè)計(jì)風(fēng)格基調(diào)奠定我認(rèn)為是從原型設(shè)計(jì)開(kāi)始的。在App的原型設(shè)計(jì)階段，UI元素的選擇和使用是設(shè)計(jì)師需要慎重把握的。在工具選擇方面可以根據(jù)安卓應(yīng)用的特點(diǎn)盡量使用Mockplus或者Justinmind這類偏向于Material design風(fēng)格的設(shè)計(jì)工具。

來(lái)源：UI中國(guó)