藍(lán)藍(lán)注：此文有些圖片沒有顯示全， 下載此文及圖片請點http://yvirxh.cn/what%20to%20do%20APP%20ui%20design.docx

用戶在面對移動應(yīng)用時，心態(tài)有三大特征：第一是微任務(wù)，我不會拿手機寫一篇論，不會從頭到尾看一部電影，使用是隨時隨地的；第二是查看周遭，也就是我所處的環(huán)境。我可能會打開手機，看有什么好的館子，有什么好的電影，打折團(tuán)購等等；第三個是無聊，很多移動用戶更多情況是無聊的，打開手機，從左到右的翻，翻到最后再把手機關(guān)掉。

 

針對這三種特征的心態(tài)，我們怎么樣去面對？第一，應(yīng)用最好是小而準(zhǔn)，不要大而全。越全的功能應(yīng)用，只能代表著這個應(yīng)用在各方面的都很平庸；第二個要滿足用戶的情景需求；第三個要幫助用戶去消磨時間。

 

屏幕布局

 

一般來說，手機屏幕是從上往下布局的，重要的信息會放在上方。但是在操作上，大部分人都是單手拿手機，常用的操作，要放在界面的下方。

 

另外還有一個原則，最小的觸摸單位，一般是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ù)卣乙粋€快捷酒店，住一晚上，第二天洗個澡再慢慢悠悠上班。我們要做的，先給用戶定位，然后提供附近的快捷酒店。

 

 

二、爽快感和新奇感

 

剛才提到，用戶很多時候是無聊的，我們的應(yīng)用要能夠讓他感覺操作起來很舒服，讓他經(jīng)常使用，以干掉競爭對手；另外要讓用戶對應(yīng)用產(chǎn)生好感，才有可能對應(yīng)用評分，在微博分享。

 

1、視覺反饋

 

用戶在操作應(yīng)用的時候，要給他提供時時的視覺上的反饋。

 

快捷酒店管家中，選擇了某個酒店某個房間后，可能會去選擇日期。如果是訂之后的日期，就有一個拖動的操作。從開始日期往后面拖，拖動的同時，會出現(xiàn)一個比較大的日期顯示。為什么呢？

 

這并不是一個標(biāo)準(zhǔn)控件。之所以這么做，是因為這里的動作是拖動，不是點，拖的時候用戶并不知道現(xiàn)在拖的是哪，所以需要一個提示。這個是視覺反饋，這種操作在一般的日歷里頭是看不到的。拖動本身是一種更好的交互方式，而明確的設(shè)置也讓用戶感到更舒服，很有意思。

 

 

2、隱喻

 

比如iOS6里面的Passbook，它的界面上就明顯的用了隱喻。它本身算是一張數(shù)字化的貴賓卡或者說消費卡，界面做的也非常像一個消費券，這個界面非常精美，光澤、整個顏色的搭配等等都非常像真實的，而且就用了條形碼。

 

大家對蘋果的界面都感覺比Windows要好，就是因為蘋果做的圖標(biāo)，界面都非常精美非常逼真，這也是蘋果能夠快速超越Windows的一個非常重要的地方。

 

 

3、操作方式的創(chuàng)新

 

比方說，我現(xiàn)在在這個位置，想知道某一些位置有什么好吃的，一種方式是定位了以后，直接就把附近所有東西顯示出來。

 

還有一種方式，我的手在上面滑動，它會記錄下軌跡，我只滑動這么一個區(qū)域，那就只會現(xiàn)顯示這個區(qū)域內(nèi)的商戶。這種方式特別直觀，而且用戶想怎么樣就怎么樣，想畫一個五角星就畫一個五角星，想畫一條線也可以，它只給你想要的地方的那些內(nèi)容，這就是一種創(chuàng)新。

 

 

三、在設(shè)計中浸入情感

 

什么樣的設(shè)計師，什么樣的團(tuán)隊才算優(yōu)秀？我們要對設(shè)計對應(yīng)用浸入感情。它會給產(chǎn)品帶來一些好玩、也可能讓用戶覺得有意思的地方。

 

比如定機票應(yīng)用中，有頭等艙和經(jīng)濟(jì)艙。經(jīng)濟(jì)艙是一個普通的人，而頭等艙是一個戴著帽子，系著領(lǐng)結(jié)，胸前別著手帕的這么一個人，很酷的老板角色，體現(xiàn)出了頭等艙和經(jīng)濟(jì)艙之間的區(qū)別。要做頭等艙的人，一般都愿意自己看到自己這么一個形象。

 

再比如微信4.0，剛打開的時候有一張圖片，非常文藝非常在都市的感覺的一張圖片，配文字“如你所見，微信，是一個生活方式”。其實它在干嘛呢？它是在提示用戶，新增了自己相冊功能。它雖然是給用戶介紹新功能，但是它把整個情緒融在里面。