教你美化APP界面設(shè)計(jì):減少冗余步驟和干擾項(xiàng)

如今各位設(shè)計(jì)出了很多好看精致的APP界面設(shè)計(jì)作品。25學(xué)堂也要提醒各位,當(dāng)我們做完每一個移動端的APP界面設(shè)計(jì)后,要學(xué)會去思考和反思。

重新回過頭去看看自己設(shè)計(jì)的APP界面,這個時候你同樣發(fā)現(xiàn)很多界面當(dāng)中美中不足的地方。

這節(jié)課,25學(xué)堂跟大家聊聊手機(jī)APP界面交互美化設(shè)計(jì)知識:《減少冗余步驟和干擾項(xiàng)》。

這一篇也是從這個知識點(diǎn),教大家如何去美化和優(yōu)化手機(jī)APP UI界面。

先來看經(jīng)典的APP設(shè)計(jì)案例:

1、微信支付和支付寶支付界面的美化

APP支付頁面的優(yōu)化案例

這是一個在移動產(chǎn)品經(jīng)理范疇里面的經(jīng)典案例。

兩個界面都是讓用戶輸入六位數(shù)密碼,唯一的區(qū)別就在于支付寶在輸入密碼后,要點(diǎn)擊一下確定才能支付,而微信是輸入密碼后直接支付。雖然只是一個操作上小小差異,但在感受上會覺得微信的體驗(yàn)更流暢。之后,支付寶也學(xué)習(xí)了微信的支付操作,去掉了確認(rèn)按鈕。

 

2、APP界面流程的簡化案例

如下圖的2個關(guān)于我的個人中心頁面,左邊是我們常用的列表表現(xiàn)形式。但是這樣的表現(xiàn)布局方式需要2個頁面才能完成這些信息的承載。同時需要不能來回切換頁面來查看3個不同的界面的信息。非常的麻煩。

app流程簡化

如果采用右邊這樣的布局方式,一個界面就搞定了。在當(dāng)前頁面的切換使得頁面的轉(zhuǎn)場次數(shù)減少。

同時可以采取左右滑動的觸摸方式切換,非常的流暢。

 

3、減少冗余步驟和干擾項(xiàng)的精美APP界面設(shè)計(jì)欣賞

APP設(shè)計(jì)減少干擾項(xiàng)

左邊的APP可視化做的非常到位。點(diǎn)擊下面的選項(xiàng)。上圖出現(xiàn)對應(yīng)在曲線上的點(diǎn),從而讓用戶知道這個數(shù)據(jù)是漲了 還跌了。

用戶體驗(yàn)設(shè)計(jì)作的很棒。而且整個界面非常簡約簡潔。暫無其他的太多的干擾項(xiàng)。

 

 

當(dāng)我們在APP ui界面上,提供很多選項(xiàng)的時候,看似可以給用戶更多選擇,讓他們可以掌控局面,但如果超過了一定的界限,特別是在很多選擇都很類似的情況下,反而會給用戶帶來負(fù)擔(dān)。所以,控制在6個以下左右即可。

所以提供合適的首選項(xiàng)、減少冗余步驟和減少干擾項(xiàng)?等等這些細(xì)節(jié)的優(yōu)化,可以幫助用戶防止出錯,使他們能夠更快更順暢地完成任務(wù),體驗(yàn)自然就會有所提升。

 

再來回顧一下:APP設(shè)計(jì)四大基本點(diǎn)【一有用、二速度、三視覺四交互】

開發(fā)App第一原則,我認(rèn)為:只需在用戶猴急的特定時候、特定地點(diǎn)、特定情境下你能猴急地滿足Ta。比如一個用戶午夜臨睡需要擼管的時候,打開你你就能以最快速度最順手的交互推給他最愛的兇器妹妹,Good Job,這就夠了。

以上觀點(diǎn)是犀利哥的點(diǎn)評。

 

 

 

 

每天更新,
全站高品質(zhì)素材免費(fèi)下載!