html5模版網(wǎng)(www.cmzxujn.cn)的小編打算這周分享一些比較適合初學(xué)者的APP界面設(shè)計教程。也算是對之前關(guān)于APP界面設(shè)計做一次階段性的總結(jié)。

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

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

1、移動APP界面設(shè)計分享：文字閱讀體驗設(shè)計篇

2、APP界面設(shè)計教程：移動界面設(shè)計尺寸篇

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

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

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

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

因為在移動情境中，人機(jī)會話時間更加有限，注意力更容易分散。而人類的短期記憶難以保存太多的內(nèi)容，信息在20秒左右的時間內(nèi)就會開始被遺忘。因此，相比于在一個浮層上一次性展示UI當(dāng)中每個地方的說明，不如一次聚焦在一兩個上面。減少說明的焦點可以使用戶將注意力放在最重要的說明上。一次展示的說明越少，用戶越有可能去閱讀并記憶下來。
同時交互設(shè)計師也要學(xué)會挑選合適的時機(jī)，為用戶提供最重要的引導(dǎo)提示，一次一個，使他們更容易理解和明白。

也要避免接連不斷的展示引導(dǎo)信息，這樣不僅會產(chǎn)生短期加重記憶方面的問題，而且會讓新用戶覺得你的應(yīng)用過于復(fù)雜，望而生畏。
如果需要展示引導(dǎo)的文字太多，可以概括分成幾個步驟來引導(dǎo)，簡化這些文字。
手機(jī)app引導(dǎo)設(shè)計二：盡量使用圖形元素

我們都知道，圖形對于文字更易于記憶和了解。最合理的方式是：

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

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

另外，我們采用的圖形盡量簡單易懂，形象具體的。避免讓人產(chǎn)生歧義的圖標(biāo)。反倒會誤導(dǎo)我們的移動用戶，損失設(shè)計交互體驗。
手機(jī)app引導(dǎo)設(shè)計三：切記與實際UI界面混淆

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

要使提示內(nèi)容與普通的界面元素區(qū)分開來，最簡單的方式是使用不同的字體。我們通常可以見到很多手寫字體風(fēng)格的提示，確實可以與實際UI當(dāng)中的文字產(chǎn)生鮮明的對比。

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

當(dāng)我們在進(jìn)行手機(jī)移動APP應(yīng)用的引導(dǎo)設(shè)計的時候，一個重要的原則就是盡可能的保持簡短。
聚焦于當(dāng)前界面中最主要的交互任務(wù)，以圖文并茂的方式提供最易掃描的說明內(nèi)容，避免一連串的提示。同時，還要確保你的提示內(nèi)容不會與應(yīng)用的實際UI混淆在一起。

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