手機(jī)移動(dòng)端APP界面設(shè)計(jì)之引導(dǎo)設(shè)計(jì)篇

25學(xué)堂的小編打算這周分享一些比較適合初學(xué)者的APP界面設(shè)計(jì)教程。也算是對(duì)之前關(guān)于APP界面設(shè)計(jì)做一次階段性的總結(jié)。

今天要跟大家來分享的關(guān)于手機(jī)移動(dòng)端APP界面設(shè)計(jì)之引導(dǎo)設(shè)計(jì)篇。

之前有聊過App引導(dǎo)頁(yè)最佳設(shè)計(jì)之5個(gè)UI界面設(shè)計(jì)步驟

1、移動(dòng)APP界面設(shè)計(jì)分享:文字閱讀體驗(yàn)設(shè)計(jì)篇

2、APP界面設(shè)計(jì)教程:移動(dòng)界面設(shè)計(jì)尺寸篇

3、APP圖標(biāo)設(shè)計(jì)教程之APP圖標(biāo)設(shè)計(jì)素材篇

如今很多手機(jī)移動(dòng)端APP應(yīng)用都會(huì)在初次加載時(shí)提供“教練畫板”形式的進(jìn)行新手引導(dǎo)或教程任務(wù)(畫著各種使用說明的半透明浮層)。此類引導(dǎo)有時(shí)確實(shí)可以幫助用戶以正確的方式使用產(chǎn)品。但是有時(shí)候又覺得沒有這個(gè)必要。

那如何來定達(dá)到合理的APP引導(dǎo)設(shè)計(jì)呢?

手機(jī)app引導(dǎo)設(shè)計(jì)一:引導(dǎo)語句必須簡(jiǎn)短,聚焦在最重要的任務(wù)上

因?yàn)樵谝苿?dòng)情境中,人機(jī)會(huì)話時(shí)間更加有限,注意力更容易分散。而人類的短期記憶難以保存太多的內(nèi)容,信息在20秒左右的時(shí)間內(nèi)就會(huì)開始被遺忘。因此,相比于在一個(gè)浮層上一次性展示UI當(dāng)中每個(gè)地方的說明,不如一次聚焦在一兩個(gè)上面。減少說明的焦點(diǎn)可以使用戶將注意力放在最重要的說明上。一次展示的說明越少,用戶越有可能去閱讀并記憶下來。

同時(shí)交互設(shè)計(jì)師也要學(xué)會(huì)挑選合適的時(shí)機(jī),為用戶提供最重要的引導(dǎo)提示,一次一個(gè),使他們更容易理解和明白。

02-mobile-application-hint-instruction-tutorials-ui-ux-design.png

也要避免接連不斷的展示引導(dǎo)信息,這樣不僅會(huì)產(chǎn)生短期加重記憶方面的問題,而且會(huì)讓新用戶覺得你的應(yīng)用過于復(fù)雜,望而生畏。

如果需要展示引導(dǎo)的文字太多,可以概括分成幾個(gè)步驟來引導(dǎo),簡(jiǎn)化這些文字。

手機(jī)app引導(dǎo)設(shè)計(jì)二:盡量使用圖形元素

我們都知道,圖形對(duì)于文字更易于記憶和了解。最合理的方式是:

“恰當(dāng)?shù)膱D形元素” +簡(jiǎn)短的文字”,并整合到一個(gè)展示層面上。

這種方式即有利于用戶閱讀,也可以使多步驟的流程更直觀、易懂、易記憶。值得推薦。

04-mobile-application-hint-instruction-tutorials-ui-ux-design.png

另外,我們采用的圖形盡量簡(jiǎn)單易懂,形象具體的。避免讓人產(chǎn)生歧義的圖標(biāo)。反倒會(huì)誤導(dǎo)我們的移動(dòng)用戶,損失設(shè)計(jì)交互體驗(yàn)。

手機(jī)app引導(dǎo)設(shè)計(jì)三:切記與實(shí)際UI界面混淆

必須使引導(dǎo)提示在外觀上與實(shí)際界面元素有著明確的區(qū)分,否則引導(dǎo)提示就是在干擾實(shí)際界面,用戶也會(huì)迷茫,甚至?xí)呀虒W(xué)內(nèi)容當(dāng)做功能界面,試著與其交互。

06-mobile-application-hint-instruction-tutorials-ui-ux-design.png7-mobile-application-hint-instruction-tutorials-ui-ux-design.png

要使提示內(nèi)容與普通的界面元素區(qū)分開來,最簡(jiǎn)單的方式是使用不同的字體。我們通??梢砸姷胶芏嗍謱懽煮w風(fēng)格的提示,確實(shí)可以與實(shí)際UI當(dāng)中的文字產(chǎn)生鮮明的對(duì)比。

 

手機(jī)移動(dòng)端APP界面設(shè)計(jì)之引導(dǎo)設(shè)計(jì)總結(jié):

當(dāng)我們?cè)谶M(jìn)行手機(jī)移動(dòng)APP應(yīng)用的引導(dǎo)設(shè)計(jì)的時(shí)候,一個(gè)重要的原則就是盡可能的保持簡(jiǎn)短。

聚焦于當(dāng)前界面中最主要的交互任務(wù),以圖文并茂的方式提供最易掃描的說明內(nèi)容,避免一連串的提示。同時(shí),還要確保你的提示內(nèi)容不會(huì)與應(yīng)用的實(shí)際UI混淆在一起。

以上這些手機(jī)移動(dòng)APP引導(dǎo)設(shè)計(jì)觀點(diǎn)和內(nèi)容,部分摘自于http://beforweb.com/的《關(guān)于移動(dòng)應(yīng)用的新手引導(dǎo)設(shè)計(jì)》

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