今天我們根據(jù)前輩在設(shè)計(jì)app的時(shí)候，留給了我們5條非常有用的的設(shè)計(jì)經(jīng)驗(yàn)與注意事項(xiàng)。html5模版網(wǎng)(m.suosuyi.cn)就分享下這些。

第一條要點(diǎn)：構(gòu)建APP模型線(xiàn)框圖

談到設(shè)計(jì)主要有兩點(diǎn)：用戶(hù)體驗(yàn)(UX)和用戶(hù)界面(UI)設(shè)計(jì)。

體驗(yàn)設(shè)計(jì)主要涉及應(yīng)用的開(kāi)發(fā)目標(biāo)以及開(kāi)發(fā)者希望用戶(hù)從中獲得什么樣的體驗(yàn)。UI設(shè)計(jì)主要涵蓋色彩、材質(zhì)以及字體等可視化的因素。

在設(shè)計(jì)iPhoneapps過(guò)程中這兩者是要點(diǎn)，并且UX和UI的關(guān)系是密切相關(guān)的。不過(guò)，開(kāi)發(fā)者的設(shè)計(jì)不是從視覺(jué)化效果開(kāi)始的，而是從線(xiàn)框圖開(kāi)始的。線(xiàn)框圖是iPhone apps設(shè)計(jì)創(chuàng)意的大綱。

個(gè)人喜歡用鋼筆和紙來(lái)畫(huà)簡(jiǎn)單的線(xiàn)框圖，也有開(kāi)發(fā)者喜歡用axure，Illustrator或者BalsamiqMockups軟件工具。

開(kāi)發(fā)者所關(guān)注的是如何讓?xiě)?yīng)用的功能更好地融合，選擇什么樣的截圖展示給用戶(hù)以及用戶(hù)如何操縱應(yīng)用。作為設(shè)計(jì)師，就要先畫(huà)按鈕，然后寫(xiě)下文本，讓整個(gè)過(guò)程變得直觀。以便于我們掌控整個(gè)設(shè)計(jì)流程與設(shè)計(jì)的細(xì)節(jié)。

第二條要點(diǎn)：APP相關(guān)按鈕設(shè)置與設(shè)計(jì)大小

這是提高應(yīng)用適用性的最關(guān)鍵部分。提高每個(gè)按鈕的可觸空間，應(yīng)用設(shè)計(jì)對(duì)象是手指而不是鼠標(biāo)。蘋(píng)果推薦至少使用44x44px以確保用戶(hù)與應(yīng)用、游戲之間的交互效果。

不過(guò)這并不意味著虛擬按鈕要很大，因?yàn)槭种赣|摸范圍可延伸到可視化按鈕范圍之外。這可以降低用戶(hù)多次點(diǎn)擊進(jìn)入帶來(lái)的挫敗感，尤其要注意當(dāng)你有幾個(gè)位置比較接近的按鈕時(shí)，要確保多個(gè)按鈕可觸范圍不會(huì)重疊。

第三條要點(diǎn):每個(gè)APP屏幕僅有一個(gè)主要目標(biāo)( 要突出層次感)

當(dāng)為應(yīng)用設(shè)計(jì)屏幕畫(huà)面時(shí)要緊緊圍繞你希望用戶(hù)完成的那個(gè)目標(biāo)。比如，iPhone郵件應(yīng)用列表中，用戶(hù)的首要目標(biāo)是能讀到郵件內(nèi)容，用戶(hù)的第二大注意力才是寫(xiě)郵件。

一款成熟的iPhone應(yīng)用Commit設(shè)計(jì)方面很好地體現(xiàn)了這一原則，雖然屏幕上還有其他按鈕，不過(guò)開(kāi)發(fā)者設(shè)計(jì)了一個(gè)大的橙色按鈕以確保用戶(hù)完成，沒(méi)有完成的用戶(hù)注意力也被吸引到開(kāi)發(fā)者這一主要設(shè)計(jì)目標(biāo)上。因此，開(kāi)發(fā)者的設(shè)計(jì)要僅僅圍繞、并且突出強(qiáng)調(diào)自己認(rèn)為最重要的那部分，同時(shí)弱化第二以及其他不重要目標(biāo)的視覺(jué)效果，這樣開(kāi)發(fā)者的首要目標(biāo)才會(huì)變得更清晰。

第四要點(diǎn)：盡量避免或重復(fù)默認(rèn)按鈕樣式

5.信息量大時(shí)添加額外視圖

 蘋(píng)果的這類(lèi)設(shè)計(jì)在iPhone上隨處可見(jiàn)，增加額外視圖可以避免用戶(hù)迷失在大信息量中，同時(shí)也讓他們更直觀有效地進(jìn)行選擇。