移動應(yīng)用程序APP視覺設(shè)計因素應(yīng)用分析

趙玲莉（華南理工大學(xué)計算機(jī)所教學(xué)站 510240）

APP移動應(yīng)用程序是當(dāng)下人們生活的一個熱點(diǎn)，很多事情都可以通過終端APP的操作完成。比如淘寶手機(jī)端APP，打車APP，電影票購買APP，還有大學(xué)生專用的課程課表APP等，這些都非常方便了我們的生活。拋開技術(shù)問題而言，這些APP看似很方便，卻有很多設(shè)計的不足之處，導(dǎo)致在同類APP下載中，用戶人數(shù)比較少。而且，當(dāng)下所有的移動終端設(shè)計都在談?wù)撊绻層脩臬@得優(yōu)雅的用戶體驗(yàn)以及不斷的強(qiáng)調(diào)交互設(shè)計的重要性，然后卻忘卻了使這一切成為可能的因素，那就是移動應(yīng)用程序的外觀視覺設(shè)計。移動APP實(shí)際上是綜合了很多學(xué)科的技術(shù)，但是如果沒有完美的外觀設(shè)計，再好的技術(shù)也成為毫無意義的擺設(shè)。而不論是一開始就優(yōu)秀得讓人驚訝的設(shè)計師還是循序漸進(jìn)越來越好的慢熱型設(shè)計師，在設(shè)計APP時，總是有很多東西可以參考，并且是保證APP移動應(yīng)用程序外觀的完整性和審美性的一些基本要求。

1.對比。良好的對比關(guān)系對于移動應(yīng)用程序非常關(guān)鍵，因?yàn)樗鼤苯佑绊懙接脩舨榭丛O(shè)計的方式。對比是指不同或者類似的元素相對于彼此是怎樣顯示的。如果設(shè)計中的內(nèi)容看起來非常相似，那么用戶就不知道應(yīng)該先看哪里，看到的幾乎就是一堆亂糟糟的RGB值。所以，在設(shè)計中，應(yīng)當(dāng)對一些元素設(shè)置優(yōu)先級，不同的元素應(yīng)該很明顯的看出他們的不同，不應(yīng)該讓用戶產(chǎn)生混淆，從而忽略了你想要的表達(dá)。

2.重復(fù)。要使用戶信任和熟悉你的應(yīng)用程序，就需要使用戶感到使用的舒適感。就視覺設(shè)計而言，可以使用應(yīng)用程序的編排樣式來達(dá)到目的。手段就是可以通過相似元素的重復(fù)使用，從而讓用戶快速建立熟悉感。

3.對齊。對齊是視覺設(shè)計中常用的方法，在移動終端設(shè)計也非常重要。元素應(yīng)該對齊到哪里呢？包括對齊到其他元素，網(wǎng)格，黃金比例框架等，沒有對齊的界面元素和構(gòu)建看起來就像出錯一樣，沒有穩(wěn)定的基礎(chǔ)。不需要特別過多的技能就可以正確排列元素，設(shè)計師們早就習(xí)慣了拖入水平和垂直的輔助線，而不僅僅是目測。對齊這個原則的應(yīng)用在iPhone的應(yīng)用程序中可以找到比較好的范例。

4.接近度和分組。在設(shè)計中應(yīng)該把相似和相關(guān)的元素組織在一起，構(gòu)成一個聚合的整體。這樣做的好處是用戶可以更快的瀏覽項(xiàng)目的聚合，并且更容易確定元素之間的的關(guān)系。相關(guān)元素的分組是非常重要的，錯誤的分組會導(dǎo)致客戶的混淆。

5.光線的選擇。如何使用漸變的合適的光影，如何使用邊緣的高光色，也是在設(shè)計中需要考慮的問題。優(yōu)秀的用戶界面設(shè)計的秘訣在于，在屏幕上的二維物體看起來想再三維的空間里，并且他們像現(xiàn)實(shí)里面一樣有體積，表面的性質(zhì)和棱角。三維的效果讓用戶體驗(yàn)感大大提升。同時還要注意設(shè)計中光源的位置對文本的閱讀的影響。注意漸變、邊緣高光、塊光澤、陰影等對圖標(biāo)等的影響。我們一般考慮光源來自上方，首先會照射到按鈕的頂部，相對而言，頂部的顏色會更加明亮。同時，按鈕的邊緣在接近邊界之前具有淡淡的，細(xì)微的高光，指示光源自然的反射的邊緣的銳度。添加邊緣高光可以容易的使形狀凸出，可以使主形狀與其便捷和周圍的區(qū)域形成更強(qiáng)烈的對比。

6.考慮清楚版式的關(guān)系。任何設(shè)計中版式都是為內(nèi)容服務(wù)的，APP設(shè)計中也不例外。要注意和諧和平衡，一旦放置了一個文本塊，就必須重視它在設(shè)計中的作用。為了使之有效，需要給它提供足夠的空間，并且必須與周圍的元素和頁面本身之間進(jìn)行平衡，使得圖像和文字一樣獲得設(shè)計的活力。

7.設(shè)計移動應(yīng)用程序在某些方面比較容易，但是在其他方面則比較負(fù)責(zé)和困難。容易是指因?yàn)槠聊槐容^小，內(nèi)容相對少，更容易進(jìn)行設(shè)計和管理。但是問題是能夠設(shè)計的元素比較少，發(fā)揮的空間也比較小，所以在處理像素時就需要注意以下點(diǎn)：盡量使設(shè)計保持逼真，設(shè)計師要精確到每一個像素，盡量簡化界面，確定什么是必須的，什么是需要隱藏的；要理解清楚那個圖標(biāo)是必須的，那個是用途是錯誤的；不要把界面控件放在不方面的位置；文字是程序很重要的內(nèi)容，要小心應(yīng)對。

設(shè)計不可能一觸而就，它需要時間和許許多多的實(shí)踐經(jīng)驗(yàn)的積累。在設(shè)計中要重視構(gòu)思的過程，構(gòu)思是產(chǎn)生和探索想法和概念的過程，也是捕捉可視化信息的過程。設(shè)計師可以從草圖方式開始構(gòu)思，借用草圖來實(shí)現(xiàn)初步的構(gòu)思，草圖非常適合于協(xié)作、討論和交流想法，雖然不是正式的，或者是看上去比較粗糙，但是的確可能比較形象的表現(xiàn)我們的設(shè)計理念和想法，在不斷修正后，就可以實(shí)現(xiàn)電腦化的設(shè)計。所以，設(shè)計師在設(shè)計過程中要多多考慮各方面的要求和想法，做到不浪費(fèi)設(shè)計，設(shè)計到恰到好處。

[1]SmashingMagazine著，陳宗斌譯.眾妙之門網(wǎng)頁UI設(shè)計之道.人民郵電出版社，2012.12.

[2]貍雅人編著.PHOTOSHOP職能手機(jī)APP界面設(shè)計.人民郵電出版社，2013.1.

[3]王巧伶等編著.APP手機(jī)界面創(chuàng)意設(shè)計新手通.機(jī)械工業(yè)出版社，2014.7.