視覺傳達設計中的網頁交互設計理念

連公博

摘 要：何為視覺傳達設計，視覺傳達設計是指運用視覺表現的手法傳達給用戶的設計方式。較為傳統的傳播媒介是平面類印刷紙質類，現在主要利用各種電子媒介作為媒介。根據相關數據2013年中國互聯網使用人數已過6億。所以互聯網傳播作為新的媒介，與平面類紙質媒介不大相同的地方是它更加強調了“交互設計”理念。

關鍵詞：網頁交互設計；視覺傳達

因時代的進步互聯網絡的快速發展是必然的，作為一種全新的視覺傳播媒介，具有迅速、價廉、及時、傳播面廣的特點。網頁作為互聯網的代表傳播方式之一，它的設計既要有傳統平面該有的設計特點，還要有現代技術的組成，將技術與藝術巧妙的相融為一體的交互性活動。本文嘗試著從視覺傳達設計中文字、色彩和排版對人生理和心理的作用應如何運用到網頁設計的交互式上，幫助設計師更好地利用視覺表現讓客戶達到良好體驗。

在筆者看來，一個好的設計師或互聯網技術人員未必能夠做好網頁設計，因為它不只是光需要設計師的審美或技術人員的開發。一個好的互聯網產品需要產品經理與設計師和技術人員的三方溝通，一個優秀的設計師其實可以勝任產品經理加設計師的工作。所以我們在做網頁設計時，應該以一個產品經理加設計師的思維共同設計。心里的思路應該很清晰，例如我們的客戶群體是哪些、他們有哪些習慣、我的顏色該如何搭配、字體用什么才能吸引讓客戶群體等等，這些都是在進行網頁設計前所要思考的，至于如何正確地匹配到這些選項，還需要我們仔細地探究。

一個好的網頁設計并不是簡單地把文字圖片放上去就夠了，我們需要揣測用戶的心理因素和生理本能，比如說網頁的大小比例、字體大小、圖片大小和整體的排版風格。下面就跟大家淺談下網頁設計中的信息視覺傳達：

1 文字

對于在網頁上的文字設計來說字體的基本要求是可閱讀性，其包括文字的大小、字與字的間距、段與段的間距和行列長短間距等方面的處理。

很少一些網頁對字體進行再次設計，原因是不同的計算機操作系統和字體文件安裝都是不同的，所以必須選取一些常規的字體，否則一部分用戶上的字體就會變成默認字體，這將與設計者本身的設計意圖大大相否。

其次，用戶使用的屏幕顯示也對字體有一定的影響，設計是大多數會采用宋體或黑體兩種字體，從用戶心理感受來說，宋體字較為活躍、生動，閱讀起來不容易疲勞。而黑體字方正端莊，線條粗獷醒目，但在縮小到一定程度時容易模糊，造成識別困難。

2 色彩

色彩設計對于一個優秀的設計來說非常重要，在網頁設計中也是設計的關鍵，在互聯網快速的閱讀中如何第一秒吸引到用戶成為視覺傳播的關鍵。人對色彩是相當敏感的，當他們首次接觸一個網頁時，最先吸引其注意力的就是網頁的顏色，其次是圖像，最后是文字。色彩給其他人的印象特別強烈，所以設計師最容易通過色彩去表達他的設計意念，例如天貓和京東的紅白色主頁的設計，強烈的顏色沖擊了人們的心理視覺給人強烈的購買欲望。

網頁上的顏色主要表現在主導色、輔助顏色和背景顏色這幾個方面。占顏色面積最大的是網頁主色調。主色調像是一幅畫中的主色，在創造特定的氣氛與意境上發揮主導作用。第二大的是輔助顏色，起的作用是強調或調和。網頁的背景色是增加畫面空間感的重要措施。例如，較暗的背景色與鮮明的主導色形成鮮明的前后空間關系。

設計師對不同功能的色彩進行理解和分析，搭配好主色、輔色和背景色的運用比例才能給用戶一個良好的視覺體驗。

3 排版

排版設計在網頁設計中也可以叫做頁面布局，把零散的網頁名稱、導航欄、搜索欄、圖形、文字和符號進行點線面排版。四周的“空間”并不是沒有的，可以留白或留灰，突出頁面主題物讓網頁在使用中更加簡潔和便利。

設計師根據“以虛托實、以無襯有”和信息傳達的要求進行合理排版，此時需要注重用戶心理的潛意識和生理的行為習慣進行排版設計。比如用戶在瀏覽頁面時，第一眼優先注意到的是四周留白的文字，這就是視覺的邊際效應在虛空間的一個體現。從而使設計師設計的平面網頁能夠充分與用戶有所“交互”，使用戶體驗獲得更佳的視覺印象。

4 視覺規律

視覺規律是根據人的視覺心理因素和生理習慣而決定的。人有兩只眼睛但是因為人的眼球原理只允許產生一個視覺焦點，不能同時停留在兩處以上（包含兩處）的地方。因此人們自由閱讀時，都會有一個生理習慣，從上往下和從左往右閱讀。

心理學研究顯示出，在一個平面內人在閱覽上半部分時會讓人感到輕松愉悅，下半部分時則會感到郁悶壓抑。同樣左半部分讓人感到輕松愉悅，右半部分則會感到郁悶壓抑。所以左上部分稱為“最佳閱覽區”。視覺流程導向又分為導向類視覺流程、重心視覺流程、反復視覺流程、散點視覺流程，我們在網頁設計中就可以依據這些用戶的生理和心理的“規律”來進行交互設計，從而使用戶達到良好的使用體驗。

優秀的網頁設計師提供愉悅的交互式體驗，不僅對文字、色彩和排版進行探究設計。網頁上操作面板上的按鈕和開關和導航的分欄等，設計師利用交互性及時讓用戶知道如何操作這是很重要的。那么設計師必須合理地運用示能、意符、約束、映射和反饋這幾個心理學概念進行科學的設計。

參考文獻：

[1] 王愉，隋涌.論網頁視覺要素設計[J].北京印刷學院學報，2005（04）.

[2] 刁學棟，吳彬.網頁設計的視覺信息傳達分析[J].教育信息化，2006（19）.