淺談UI設(shè)計

夏夢

摘要：在做軟件界面設(shè)計的時候，經(jīng)常會遇到一些困擾。該怎么做，怎么做能夠提高用戶對該軟件的興趣，提升用戶體驗，是界面設(shè)計師應(yīng)該考慮的問題和做界面設(shè)計的出發(fā)點。界面美觀、舒適是很重要的，但是更重要的是使用方便，給人的感覺友好、熟悉，又不缺乏個性。

關(guān)鍵詞：UI設(shè)計；交互方式；色彩搭配；語言；一致性

中圖分類號：TP311 文獻標識碼：A 文章編號：1009-3044（2015）07-0295-02

Abstract： When we are doing a software users interface design， often encounter some problem. What to do， how to improve the user's interest in the software to enhance the user experience. Thats the problem that interface designers should consider， and thats the starting point for them to design. Interface aesthetics， comfort is very important， but even more important is easy to use， give people the feeling of a friendly， familiar， but not lack of personality.

Key words： UI design； interactive mode； color matching； language； consistency

UI即User Interface（用戶界面）的簡稱。UI設(shè)計是指對軟件的人機交互、操作邏輯、界面美觀的整體設(shè)計。好的UI設(shè)計不僅是讓軟件變得有個性有品位，還要讓軟件的操作變得舒適簡單、自由，充分體現(xiàn)軟件的定位和特點。由此可見我們需要研究三方面的內(nèi)容，即研究人、研究工具以及人與工具的關(guān)系。

用戶界面作為人與機器交互的媒介，有著非常重要的作用，沒有界面，人就無法操作機器。所以界面設(shè)計的好與壞，直接影響到用戶使用軟件難易程度。好的UI設(shè)計能夠讓軟件的使用變得輕松自如，無需用戶思考和記憶，當用戶在使用某個軟件覺得自己很笨的時候，那就是UI設(shè)計師的工作沒有做好。

我們?nèi)绾文軌蜉敵龊玫腢I設(shè)計呢？

1 交互方式模擬現(xiàn)實

模擬現(xiàn)實的交互方式會給人熟悉親切的感覺，用戶不需要學(xué)習，便能夠理解。UI設(shè)計中不乏這樣的例子。例如，當某個按鈕按下去的時候，呈現(xiàn)比原來更深的顏色，這個就是模擬了現(xiàn)實中光影的效果，不同的高度，對于同一個物體，顏色肯定有所差別。有一個小的手電筒APP，就模擬了現(xiàn)實中的手電筒，所以用戶不必思考它怎么用，因為太熟悉了。用戶第一次接觸，不需要學(xué)習，毫無約束的使用的應(yīng)用，就是好的應(yīng)用。

2 界面設(shè)計要簡單

界面設(shè)計跟平面設(shè)計有很大不同，平面設(shè)計可以隨自己的喜好或者是需要加入一些裝飾，特別是海報招貼的設(shè)計，需要有一些吸引眼球的內(nèi)容或者是色彩。但是界面對于用戶來說是工具，所以好用是工具所要具備的第一品質(zhì)，為了不干擾用戶，不要添加不必要的裝飾。

界面設(shè)計一目了然，安排好每一個頁面的功能排列，重要的功能、次重要的功能、不重要的功能應(yīng)該有序的排列。為了使界面干凈，要適當隱藏一些不重要的功能，但是用戶可以通過有效的方法找到這些功能。

3 圖標的應(yīng)用

3.1盡量使用通用的圖標

用戶已經(jīng)習慣的圖標，我們就不要去試圖更改，使用通用圖標會讓用戶更容易使用，也更容易讓用戶對界面產(chǎn)生親切感。一個陌生的界面的接受程度遠不如一個被大眾熟悉的界面。

3.2圖標的設(shè)計能夠體現(xiàn)所代表事物的特點

當然，除了通用圖標，我們也要設(shè)計能夠體現(xiàn)軟件特點的新圖標。讓軟件有一定的個性和差異性。設(shè)計圖標一定能夠代表事物的特點，讓用戶看到圖標在不用文字解釋的情況下能夠理解它所代表的含義。這樣的設(shè)計使得軟件生動充滿了活力，提升用戶體驗。

3.3圖標的設(shè)計不能太過復(fù)雜

雖說圖標的設(shè)計能夠體現(xiàn)所代表事物的特點，但是設(shè)計不能太過復(fù)雜，要簡約。好的圖標設(shè)計既要有特點，有親和力，又能讓界面很干凈。

4 色彩的搭配

色彩，是一種很好理解的情感。從出生起，我們就從周圍環(huán)境中學(xué)習其他人對色彩的理解和應(yīng)用。例如，每逢節(jié)慶到處都是紅色，即便幾十年來沒有人直接告訴你，你也會在腦海中不經(jīng)意的記?。杭t色代表喜慶、歡快、幸福、吉祥。春天看到綠色是件挺自然的事兒，如同北方人冬天看見下雪一樣平凡無奇。成長過程中，我們會潛移默化地理解綠色為“新生”的色彩代言人，白色是飄零、純潔的象征......

但是有些顏色代表的意義非常復(fù)雜，像藍色，我們首先想到的可能是藍天大海，很開闊，但卻還有一種神秘的孤獨感，特別是在電影和漫畫中，它常常被當作憂傷和孤僻的色彩被使用。而藍色也被看作是最嚴謹?shù)念伾芏喔呖萍脊鞠矚g把藍色作為公司的標準色使用。那么，色彩擁有如此復(fù)雜的意義，怎么使用呢？這就需要搭配。相同的顏色，搭配的比例不同，搭配的位置不同，就會產(chǎn)生不一樣的感情色彩。

不要超過3種顏色是所有色彩原則的基礎(chǔ)。

4.1黑白灰優(yōu)先

如果你沒有很好的配色，那就先選擇黑白灰吧，如果搭配得當，黑白灰的設(shè)計看上去層次也是很豐富的。

4.2在黑白灰基礎(chǔ)上添加一種色彩

如果你覺得黑白灰單調(diào)，可以在黑白灰的基礎(chǔ)上加入一種色彩，可以在大面積的黑白灰上面加入小面積的顏色。這樣的搭配高雅，又不失活力。

4.3使用同一色系進行色彩搭配

如果使用色彩來搭配，那么一個頁面最好使用同一色系的顏色來進行搭配，這樣就不會出現(xiàn)不協(xié)調(diào)的問題。

4.4可使用互補色進行搭配

只要比例得當，互補色的搭配一樣可以收獲很好的視覺效果。

4.5使用鄰近色進行色彩搭配

一種顏色的純度比較高的時候，另一種顏色純度低或名度低的，這樣搭配出的效果會比較好。

以上只是一些基礎(chǔ)的色彩搭配，初學(xué)者，如果能做到以上幾點，相信界面設(shè)計也一定不會差。

5語言的使用

5.1 語言使用的一致性

同一事物的說明要使用同一個詞語，否則會給用戶造成不必要的困擾。例如，如果你使用了“查找”，就不要在同樣的情況下使用“搜索”。

5.2 語言使用的準確性

使用語言一定要準確，不要產(chǎn)生歧義，不要讓用戶思考。

5.3 語言使用的通俗性

不要使用專業(yè)術(shù)語，是的用戶根本不理解語言的意思，要時刻記住，我們的軟件是給廣大用戶使用的，而不是給我們的專業(yè)技術(shù)人員使用的。

5.4 語言使用要體現(xiàn)出情感關(guān)懷

盡量不要使用“警告”“禁止”等不友好的語言，可以使用“溫馨提示”“請不要......”以及一些比較時尚的網(wǎng)絡(luò)用語?？傊?，語言上的使用，要給用戶親切、友好、輕松的感受。

6 總結(jié)

上訴所講的這些內(nèi)容是在設(shè)計當中非常實用的，掌握上述原則你就可以做出很不錯的界面設(shè)計。當然，要想成為好的界面設(shè)計師，更要不斷的學(xué)習和實戰(zhàn)，在實戰(zhàn)中獲取更多的技巧。

參考文獻：

[1][美]Theresa Neil.移動應(yīng)用UI設(shè)計模式[M].北京：人民郵電出版社，2013.

[2]梁景紅.寫給大家看的色彩書①——配色基礎(chǔ)[M].北京：人民郵電出版社，2011.