到今天為止,肯定很多人已經(jīng)知道如何去設(shè)計一個好的手機APP啦,因為25學(xué)堂早在2013年就寫過一篇《如何做好一個APP界面設(shè)計》原創(chuàng)博文,有興趣的小伙伴可以點擊回顧下。
而今天25學(xué)堂,想跟大家分享一篇航班管家設(shè)計總監(jiān)向怡寧在線下一次關(guān)于移動app界面設(shè)計的分享會上,總結(jié)的一些實用APP設(shè)計經(jīng)驗。非常簡單易懂而實用的APP設(shè)計干貨。
之前25學(xué)堂分享的航班管家設(shè)計總監(jiān)向怡寧老師的課程:
APP設(shè)計公開課《移動APP應(yīng)用界面設(shè)計視頻教程》
下面是APP設(shè)計實用知識點分享:
第一步:目標(biāo)用戶的心態(tài)
用戶在面對移動應(yīng)用時,心態(tài)有三大特征:
第一是微任務(wù),我不會拿手機寫一篇論,不會從頭到尾看一部電影,使用是隨時隨地的;
第二是查看周遭,也就是我所處的環(huán)境。我可能會打開手機,看有什么好的館子,有什么好的電影,打折團購等等;
第三個是無聊,很多移動用戶更多情況是無聊的,打開手機,從左到右的翻,翻到最后再把手機關(guān)掉。
?針對這三種特征的心態(tài),我們怎么樣去面對?
第一,應(yīng)用最好是小而準(zhǔn),不要大而全。越全的功能應(yīng)用,只能代表著這個應(yīng)用在各方面的都很平庸;
第二個要滿足用戶的情景需求;
第三個要幫助用戶去消磨時間。
第二步:快速的APP屏幕布局
一般來說,手機屏幕是從上往下布局的,重要的信息會放在上方。但是在操作上,大部分人都是單手拿手機,常用的操作,要放在界面的下方。
另外還有一個原則,最小的觸摸單位,一般是44個像素。如果再小,你的拇指難以觸碰,或者容易引發(fā)誤操作。同時,也不要讓界面太擁擠。
大家熟悉的,比如iOS的桌面,最主要的操作是在最下面,常用的四個鈕,上面的內(nèi)容可以來回滑動去選擇。微信的操作也是在下面,重要的信息——我們的聊天內(nèi)容放在上方。
一、簡單
用戶是要微任務(wù)的,心態(tài)是有點無聊的,我們要讓APP變得簡單。但設(shè)計更簡單的體驗,往往意味著要追求更極端的目標(biāo)。因為你要充分理解用戶的需求,理解用戶現(xiàn)在想要什么,理解他現(xiàn)在的心態(tài)是什么,理解他的大情緒是什么。
1、隱藏或者干掉
不太重要,但是必要的東西,可以把它隱藏起來;無關(guān)緊要的東西,能干掉的就干掉,不要把什么東西都塞給用戶。
比如郵件應(yīng)用中,已發(fā)郵件、草稿、已刪除這些功能,對一般用戶來說,在最常用的場景里面,這些是不重要的,但是不可能把它去掉,就可以隱藏在下面。而簽名、外出自動回復(fù)等,這些功能是更加不太使用的,可以把它藏得更深。
再比如Path,它把五個常用的按鈕,集成到“+”里。點擊加號以后,有拍照,音樂等功能。而界面上,打開這個應(yīng)用,最直觀的就是最主要的信息,沒有其他的干擾。比如之前有多少人看過我的圖片,它把這個信息直接集成在圖片右上角,沒有占據(jù)太多地方,點擊之后,可以發(fā)表情、評論、直接刪除等,做到了隱藏,是個非常干凈、漂亮的頁面。
2、分區(qū)
以酒店管家為例,酒店圖片,酒店提供的服務(wù)設(shè)施,價格,這個是最主要的內(nèi)容,放在首要位置;點評放在了其次;然后是交通狀況,周邊的設(shè)施等,有一個明確的分區(qū)。
用戶一旦知道了這種分區(qū)方式,他下次再點開這個應(yīng)用,想看哪個,他的眼睛會直接落在那兒。
3、幫用戶決策
用戶其實希望看到的是開發(fā)者直接給他們一個東西,非常簡單,不用去記,不用去選擇。那么怎樣幫用戶做決策呢?
以酒店產(chǎn)品為例,當(dāng)用戶需要訂酒店時,很多應(yīng)用都是需要用戶輸入條件,比如城市、日期、價格區(qū)間、房型等,之后得到酒店列表。快捷酒店管家中,用戶打開應(yīng)用,看到就是酒店頁面,沒有任何選擇。這并不是簡單粗暴,而是對用戶研究之后提供的功能。
快捷酒店管家的核心用戶,是本地化的,要在本地找一個快捷酒店,住一晚上。比如說我在通州住,公司在石景山,這兩個地方有60公里,晚上加班加到12點,我是打車回通州,還是說直接就在當(dāng)?shù)卣乙粋€快捷酒店,住一晚上,第二天洗個澡再慢慢悠悠上班。我們要做的,先給用戶定位,然后提供附近的快捷酒店。
2、隱喻
比如iOS6里面的Passbook,它的界面上就明顯的用了隱喻。它本身算是一張數(shù)字化的貴賓卡或者說消費卡,界面做的也非常像一個消費券,這個界面非常精美,光澤、整個顏色的搭配等等都非常像真實的,而且就用了條形碼。
大家對蘋果的界面都感覺比Windows要好,就是因為蘋果做的圖標(biāo),界面都非常精美非常逼真,這也是蘋果能夠快速超越Windows的一個非常重要的地方。
3、操作方式的創(chuàng)新
比方說,我現(xiàn)在在這個位置,想知道某一些位置有什么好吃的,一種方式是定位了以后,直接就把附近所有東西顯示出來。
還有一種方式,我的手在上面滑動,它會記錄下軌跡,我只滑動這么一個區(qū)域,那就只會現(xiàn)顯示這個區(qū)域內(nèi)的商戶。
這種方式特別直觀,而且用戶想怎么樣就怎么樣,想畫一個五角星就畫一個五角星,想畫一條線也可以,它只給你想要的地方的那些內(nèi)容,這就是一種創(chuàng)新。
三、在APP設(shè)計中浸入情感
什么樣的設(shè)計師,什么樣的團隊才算優(yōu)秀?我們要對設(shè)計對應(yīng)用浸入感情。它會給產(chǎn)品帶來一些好玩、也可能讓用戶覺得有意思的地方。
比如定機票應(yīng)用中,有頭等艙和經(jīng)濟艙。經(jīng)濟艙是一個普通的人,而頭等艙是一個戴著帽子,系著領(lǐng)結(jié),胸前別著手帕的這么一個人,很酷的老板角色,體現(xiàn)出了頭等艙和經(jīng)濟艙之間的區(qū)別。要做頭等艙的人,一般都愿意自己看到自己這么一個形象。
再比如微信4.0,剛打開的時候有一張圖片,非常文藝非常在都市的感覺的一張圖片,配文字“如你所見,微信,是一個生活方式”。其實它在干嘛呢?它是在提示用戶,新增了自己相冊功能。它雖然是給用戶介紹新功能,但是它把整個情緒融在里面。
全站高品質(zhì)素材免費下載!