從平面網(wǎng)頁設(shè)計(jì)師到國際UI設(shè)計(jì)師的進(jìn)階

周健

【摘 要】平面設(shè)計(jì)泛指具有藝術(shù)性和專業(yè)性，以“視覺”作為溝通和表現(xiàn)的方式，以文字、圖片和符號為主要元素，來傳達(dá)想法或信息的視覺表現(xiàn)。UI設(shè)計(jì)則是指在互聯(lián)網(wǎng)和移動互聯(lián)網(wǎng)中，對軟件的人機(jī)交互設(shè)計(jì)、操作邏輯設(shè)計(jì)、界面美觀的整體設(shè)計(jì)等。好的UI設(shè)計(jì)讓軟件的操作變得舒適、簡單、自由，還要讓軟件變得有個性、有品味，充分體現(xiàn)軟件的定位和特點(diǎn)。

【關(guān)鍵詞】平面網(wǎng)頁設(shè)計(jì)；UI視覺設(shè)計(jì)；進(jìn)階

引言

“設(shè)計(jì)”，即英文“design”。“design”一詞來自拉丁文，意思是“上記號”，是為一個構(gòu)想做出方案、計(jì)劃的意思。中文中與此意相近的詞為“意匠”，可見設(shè)計(jì)中創(chuàng)意的重要性。設(shè)計(jì)的種類相當(dāng)之多，設(shè)計(jì)在許多領(lǐng)域都有應(yīng)用，涉及的方面也比較廣泛。例如視覺傳達(dá)設(shè)計(jì)，室內(nèi)設(shè)計(jì)，教學(xué)設(shè)計(jì)、字體設(shè)計(jì)，包裝設(shè)計(jì)等等。

1.平面網(wǎng)頁設(shè)計(jì)

平面設(shè)計(jì)即設(shè)計(jì)其中之一，且與藝術(shù)聯(lián)系相當(dāng)緊密。以“視覺”作為溝通和表現(xiàn)的方式。結(jié)合文字、圖片、符號，傳達(dá)想法和信息的視覺表現(xiàn)。平面設(shè)計(jì)具有藝術(shù)性和專業(yè)性，平面設(shè)計(jì)既可以指創(chuàng)作時的過程，也可以指最后完成的作品。現(xiàn)代平面設(shè)計(jì)是集電腦技術(shù)、數(shù)字技術(shù)、美術(shù)知識和藝術(shù)創(chuàng)意為一體的綜合內(nèi)容，例如名片設(shè)計(jì)、海報設(shè)計(jì)、標(biāo)志設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)、室內(nèi)設(shè)計(jì)，三維效果圖的后期處理、特效制作等等。

平面設(shè)計(jì)的基本元素包括圖形、文字和色彩等。對于圖形的美感，一般從平衡感、對比度、韻律節(jié)奏、協(xié)調(diào)感等幾方面去審視。圖形有動態(tài)的豐富的變化，安全穩(wěn)定的美感，且相輔相成，互相襯托，韻律節(jié)奏和諧，色彩形狀協(xié)調(diào)，主題統(tǒng)一，符合人們普遍的視覺需求。一幅平面設(shè)計(jì)作品的成功與否在于每個元素的設(shè)計(jì)和編排組織的水平。注意可視性、易讀性，應(yīng)主次分明、色調(diào)統(tǒng)一。

2.UI視覺設(shè)計(jì)

在互聯(lián)網(wǎng)時代，越來越多的企業(yè)意識到UI和用戶體驗(yàn)的重要性。UI設(shè)計(jì)是一個非常熱門的職業(yè)，只要涉及互聯(lián)網(wǎng)，移動互聯(lián)網(wǎng)的企業(yè)都需要UI設(shè)計(jì)師，因?yàn)槿瞬啪o缺，企業(yè)往往給這份工作豐厚的辛酬和舒適的工作環(huán)境，但是要成為優(yōu)秀的UI設(shè)計(jì)師可不是一件容易的事，你要具備一定的美學(xué)修養(yǎng)，和提升用戶體驗(yàn)的設(shè)計(jì)能力。早期，行業(yè)UI人才極其缺乏，企業(yè)當(dāng)時也并不了解UI，大量招聘的是美術(shù)類型的設(shè)計(jì)師，隨著行業(yè)發(fā)展和技術(shù)提高，行業(yè)對人才的需求也逐漸成熟，現(xiàn)在越來越多的企業(yè)開始招聘具備獨(dú)立策劃，具有產(chǎn)品設(shè)計(jì)和視覺規(guī)劃能力的UI設(shè)計(jì)人才。

掌握UI設(shè)計(jì)這門技術(shù)必備五大系統(tǒng)，它們分別是技法、規(guī)范、用戶體驗(yàn)、審美和品牌設(shè)計(jì)。

2.1技法

作為UI設(shè)計(jì)師，技法層面是我們必須要面對的門檻，也是我們工作中最重要的技術(shù)手段，一個好的設(shè)計(jì)師，不僅能夠嫻熟的駕馭各種技法技術(shù)，更能夠從中挖掘出有價值的設(shè)計(jì)，探討一些設(shè)計(jì)的思路、思維，展示一個產(chǎn)品設(shè)計(jì)從無到有的過程。動態(tài)的視覺效果是人們獲取信息最自然、最快速、最高效的途徑，如果我們的界面擁有符合用戶感官的動態(tài)效果，將會大大提升我們產(chǎn)品的使用體驗(yàn)，所以一般在UI設(shè)計(jì)中，加入合適的功效，將會使我們的產(chǎn)品流露出獨(dú)有的品牌特色，掌握動效設(shè)計(jì)軟件After Effect是設(shè)計(jì)師的必備技能，并將動效設(shè)計(jì)延展到產(chǎn)品當(dāng)中。

2.2規(guī)范

怎樣設(shè)計(jì)一個合理的UI界面，比如文字的字體、字號，整體配色和頁面布局等等，一個好的UI設(shè)計(jì)，不僅有精美的ICON和炫酷的動畫，往往也會有一份詳盡的設(shè)計(jì)規(guī)范，比如IOS、android、web這些主流平臺，都會有自己的設(shè)計(jì)規(guī)范，這是為了能夠讓用戶體驗(yàn)保持一致性和完整性，并且能夠提高設(shè)計(jì)工作的效率，那么設(shè)計(jì)規(guī)范和流程是UI設(shè)計(jì)師必須掌握的。

2.3用戶體驗(yàn)

用戶體驗(yàn)已經(jīng)是當(dāng)今互聯(lián)網(wǎng)產(chǎn)品競爭的制高點(diǎn)，我們所設(shè)計(jì)的界面中，無處不存在對可用性的影響，往往一個微小的細(xì)節(jié)就可以直接影響到用戶的轉(zhuǎn)化效率，但是當(dāng)我們深入去了解的時候才發(fā)現(xiàn)，很多時候并沒有完美的設(shè)計(jì)，方案之間總是充斥著各種矛盾，比如說，你要設(shè)計(jì)一個流程，如果你增加很多很多的元素或者加長流程的長度，肯定會讓這個流程通俗易懂，但是這么做卻會損失了操作的效率，那怎么做才是最好的設(shè)計(jì)呢，這需要我們對用戶體驗(yàn)有非常全面的了解，才能在決策中把握正確的方向，讓軟件的操作變得舒適、簡單、自由。

2.4審美

Dieter Rams在優(yōu)秀設(shè)計(jì)的十大原則中說到，好的設(shè)計(jì)應(yīng)該就有美感，所以想成為一名優(yōu)秀的設(shè)計(jì)師，就應(yīng)該具備良好的審美，那么美到底是什么呢？而美又有什么價值，那些優(yōu)秀的設(shè)計(jì)到底美在哪里，未來將會怎樣，就我們設(shè)計(jì)師而言，在自我價值、產(chǎn)品價值及用戶體驗(yàn)等方面，該如何的平衡，如何切實(shí)有效的提升自己的審美非常重要。

2.5品牌設(shè)計(jì)

一個品牌的樹立關(guān)系到用戶對這個產(chǎn)品的認(rèn)知程度，是用戶對這個產(chǎn)品和企業(yè)文化價值的一種評價，也是這個產(chǎn)品核心價值和企業(yè)文化的體現(xiàn)，如何識別和分析品牌，如何有效的對產(chǎn)品進(jìn)行分析，對競品進(jìn)行分析？這些必須從品牌色、品牌基因和圖形化元素等等多方面出發(fā)，尋找品牌獨(dú)樹一幟的差異化，去制定并形成一套系統(tǒng)的VI體系規(guī)范，配合產(chǎn)品在視覺規(guī)范和使用習(xí)慣等等達(dá)到體驗(yàn)式統(tǒng)一，不斷的去完善和鞏固品牌的特性。

設(shè)計(jì)表達(dá)是UI設(shè)計(jì)的基礎(chǔ)，提升設(shè)計(jì)品味和品牌價值是UI設(shè)計(jì)的核心，熟練掌握優(yōu)秀的用戶體驗(yàn)設(shè)計(jì)思路是UI設(shè)計(jì)的目標(biāo)，掌握UI設(shè)計(jì)知識體系，趣味實(shí)戰(zhàn)ICON設(shè)計(jì)和制作華麗的動效，熟悉主流平臺的UI設(shè)計(jì)規(guī)范，熟練掌握完整的APP設(shè)計(jì)流程，提升設(shè)計(jì)品味和品牌價值，最終掌握優(yōu)秀的用戶體驗(yàn)設(shè)計(jì)思路，提升UI設(shè)計(jì)自信心。

3.從平面到UI的進(jìn)階

處于數(shù)字信息化時代，在網(wǎng)絡(luò)生存環(huán)境中如何獲取信息、分析信息、整理信息；運(yùn)用批判性思維提升信息素養(yǎng)。掌握文字處理、表格設(shè)計(jì)、圖文排版及演示文稿設(shè)計(jì)等常用軟件，是成為職場精英的第一步。

3.1圖形界面設(shè)計(jì)

對于圖形界面設(shè)計(jì)，必須掌握Photoshop軟件的界面構(gòu)成與計(jì)算機(jī)圖像設(shè)計(jì)的基本知識，熟練掌握摳圖工具、修補(bǔ)工具、鋼筆工具等各種圖像處理工具的使用。掌握CorelDRAW矢量圖形繪制軟件的界面與工具，矢量圖形繪制的技巧以及表格工具、印前與輸出的相關(guān)應(yīng)用，書籍與長文檔的制作。

3.2WEB界面設(shè)計(jì)

對于WEB界面設(shè)計(jì)，則要掌握使用Dreamweaver軟件建立站點(diǎn)、添加頁面元素、使用CSS樣式及交互行為。并且將Flash動畫制作技術(shù)應(yīng)用其中。熟悉WEB標(biāo)準(zhǔn)化布局，詳細(xì)了解HTML/HTML5語言語法與常用標(biāo)簽的用法，包括布局標(biāo)簽，表格標(biāo)簽，表單標(biāo)簽等。掌握CSS語法與常用屬性的詳解，使用CSS對網(wǎng)站中各個模塊進(jìn)行修飾美化，對頁面布局結(jié)構(gòu)進(jìn)行深入的分析，并能處理瀏覽器兼容的問題。

結(jié)語

不論是平面設(shè)計(jì)，還是UI視覺設(shè)計(jì)，都是設(shè)計(jì)藝術(shù)的一部分，不僅要有形的美，還要有意的度，除了要從美學(xué)的角度去考慮，還要從設(shè)計(jì)師的角度去考慮怎樣運(yùn)用各種藝術(shù)形式來表現(xiàn)其獨(dú)特的設(shè)計(jì)思路，以最終的作品傳達(dá)給觀眾。具有美術(shù)基礎(chǔ)知識，素描速寫能力，掌握色彩與視覺的關(guān)系等色彩學(xué)基礎(chǔ)知識，對于設(shè)計(jì)作品都是必不可少的。任何一個好的設(shè)計(jì)作品，不僅給受眾以豐富的信息和美的享受，而且可以使其品味其中的意韻，在文字與形式的秩序氛圍中，能夠再創(chuàng)想象空間，得到情感的升華，所有這些都源于作品的靈魂----創(chuàng)意。它的靈感來源于生活的體驗(yàn)和智慧的啟迪，將創(chuàng)意思維進(jìn)行形態(tài)置換，將創(chuàng)意思維轉(zhuǎn)化為圖形樣式，這些都是作為一名設(shè)計(jì)師必須具備的能力。

【參考文獻(xiàn)】

[1]數(shù)碼創(chuàng)意，平面廣告創(chuàng)意，中國鐵道出版社，2013年9月

[2]UI設(shè)計(jì)師微專業(yè)，中國藝術(shù)教育，2016（05）

[3]張媛.UI設(shè)計(jì)中的視覺表現(xiàn)，大眾文藝，2013（11）endprint