網頁設計與新媒體課程建設

鄧祖龍

【摘? ? 要】網頁設計是指將一系列信息，如文字、圖片、音視頻、圖標符號、表格等進行設計排版，通過互聯(lián)網傳輸，最終以圖形用戶界面的形式被用戶所瀏覽，從中獲取信息。網頁設計誕生于互聯(lián)網時代，發(fā)展至今已經非常成熟。如今移動互聯(lián)網高速發(fā)展，串聯(lián)起各類智能設備與平臺，用戶獲得信息的渠道和方式越來越多樣化。網頁設計如何適應新媒體時代下的發(fā)展，數媒專業(yè)核心課程怎么設置，網頁設計在新媒體課程建設中的重要性以及人才培養(yǎng)等問題，都是值得討論的主題。

【關鍵詞】網頁設計? 移動互聯(lián)網? 新媒體? 學習過程? 課程建設

中圖分類號：G4? ? ? 文獻標識碼：A DOI：10.3969/j.issn.1672-0407.2020.16.170

一、網頁設計

（一）網頁設計

網頁設計是指將一系列信息，如文字、圖片、音視頻、圖標符號、表格等信息進行設計排版，通過互聯(lián)網傳輸，最終以圖形用戶界面的形式被用戶所瀏覽，從中獲取信息。網頁設計可分為網頁界面設計和交互設計兩大模塊，面向數媒專業(yè)其核心課程為網頁界面設計，而交互設計屬于輔助性課程。因此，我們這里討論的網頁設計，更多是從美術設計角度出發(fā)，重視覺方向。網頁的發(fā)布平臺一般為電腦屏幕，在新媒體時代下，網頁設計如何適配新型媒體終端，是直接遷移還是重構設計？為適配多類型平臺，UI設計在傳統(tǒng)網頁設計基礎上進行重構設計與優(yōu)化，但設計思路依然遵循網頁設計的基本規(guī)律。

（二）網頁設計的流程

隨著互聯(lián)網和移動互聯(lián)網的快速發(fā)展，企業(yè)推廣不再局限于傳統(tǒng)的宣傳形式，如宣傳手冊和視頻廣告等。更多的企業(yè)通過網站、小程序或手機APP呈現產品、服務、理念與文化，或向受眾提供功能服務。因此，網站建設是非常有必要的，由于智能手機的高速發(fā)展，其形式也呈現出多樣化發(fā)展，如小程序和手機APP，就是網頁設計在手機終端上的表現形式。

網頁設計、小程序及手機APP設計，需要經歷以下幾個階段：

1.產品需求分析。簡要分析產品的類型與方向，定義產品的用戶群體及特征，繪制原型需求。

2.用戶體驗研究與分析。深度剖析已定義的目標用戶群體，包括年齡，性別、情感需求、行為習慣及心理特征等。針對產品構想出初步的色系搭配及元素控件設計方案。

3.初稿設計。將原型需求與用戶體驗研究分析相結合，設計頁面初稿。包括大概的色系搭配、框架布局、元素控件、圖標ICON等設計。

4.視覺規(guī)范設計及細節(jié)優(yōu)化設計。視覺規(guī)范設計就是對整個產品的顏色、字體、字號、元素控件、圖標ICON、間距及交互效果做統(tǒng)一的規(guī)范，同時進行細節(jié)優(yōu)化設計。

5.協(xié)同前端實現交互效果。設計稿完成后，我們需要協(xié)同前端工程師更準確地還原我們的設計效果，實現最佳的交互式體驗。

6.產品體驗與持續(xù)用戶體驗優(yōu)化。對整個產品做一個線上體驗、界面體驗、交互體驗。遇到體驗不好的問題，我們可以和產品經理、前端工程師共同協(xié)商來解決這些問題。產品正式上線后，收集用戶體驗數據，持續(xù)優(yōu)化界面設計與交互設計，完善用戶體驗。

二、網頁設計學習過程

網頁設計需要大量的素材資源，各類主題與風格千變萬化，因此，要學好網頁設計，學生需要大量的閱讀和練習。整個學習過程可以總結為以下幾個階段：模擬項目、案例采集與分析、項目臨摹、項目實戰(zhàn)。

1.模擬項目。學習初期，采用模擬項目的訓練方式，在設計過程中去發(fā)現問題、解決問題。以模擬某品牌網站為命題，結合品牌形象、品牌定位、產品信息、圖片素材等資源，自行設計一套該品牌形象網站的主頁面效果圖。主要會出現的問題包括：設計風格與品牌定位出現偏差、網頁布局單一缺乏變化、排版問題、字體應用問題、色彩搭配紛繁復雜等問題。

2.案例采集與分析。品牌網站建設是展現企業(yè)形象、介紹產品和服務、體現企業(yè)發(fā)展戰(zhàn)略的重要途徑。通過收集和整理各個行業(yè)的企業(yè)網站或品牌網站，了解掌握多樣的設計風格和主題表現形式，分析總結各類型網站設計的特點，包括布局樣式、版式設計、圖片處理、圖文編排、色彩構成、多媒體及交互設計等細節(jié)表現。學設計一定要多看多想，學習優(yōu)秀的設計理念和表現手法，規(guī)范設計流程，強化細節(jié)表現，從而提高自身的設計水平。

3.項目臨摹。選擇符合最新設計趨勢的優(yōu)秀案例進行臨摹，每一個元素都參照原作進行重繪，圖片素材則需要重新匹配。在重繪過程中，深度對比學習布局與比例、板塊切割、對象對齊、字體字號、字距與行距、圖形符號、色彩對比等具體參數，量化參考數據，強化自身對設計規(guī)范和參數標準的認識，有利于今后設計的規(guī)范化和標準化。

4.項目實戰(zhàn)。參與實際商業(yè)項目制作，協(xié)同公司設計師完成項目的主頁面和二級頁面設計。通過與商務策劃人員討論提案，與設計師交流設計方案，配合前端后端落實修改客戶反饋意見，在真實的項目建設中得到更多的鍛煉。

三、網頁設計與課程建設

隨著互聯(lián)網及移動互聯(lián)網的高速發(fā)展，計算機和智能終端的普及，傳統(tǒng)的平面設計已經不能滿足新媒體時代對視覺信息傳播的需求，動態(tài)的、交互的體驗式視覺傳播方式正在廣泛流行。越來越多的企業(yè)需要通過網站、小程序或手機APP展現產品、宣傳企業(yè)理念與文化、與客戶交流互動、提供線上線下服務。因此，市場對于設計人才的需求發(fā)生了巨大的變化，單純的平面設計師已無法實現企業(yè)對視覺設計的所有需求。未來，越來越多的行業(yè)需要UI設計人才，主流的設計方向會是高端網頁設計和移動終端界面設計。因此，UI設計師將是中國新媒體設計產業(yè)中最為搶手的人才之一。

網頁設計作為新媒體視覺傳播的必要方式，它所涵蓋的設計面非常廣，包括圖片處理、廣告設計、色彩構成、版式設計、圖標設計、字體設計與應用、交互設計等?？v觀整個數字多媒體課程體系，網頁設計課程的位置和作用都是至關重要的，很好地銜接了前期基礎課程和后續(xù)專業(yè)課程，起到了承前啟后的作用。前置課程包括二維軟件學習、三大構成、版式設計等，其學習成果都能在網頁設計中得到很好的展現，體現了基礎課程的重要性。后置課程圖標設計、UI設計則是在網頁設計基礎上的擴展，圖標設計與UI設計多應用于手機、平板等智能終端，載體雖然發(fā)生了改變，但設計流程卻和網頁設計基本一致?；狙永m(xù)功能布局、圖文排版、元素控件、圖標ICON、顏色搭配等核心設計元素不變，改變的是交互方式、設計規(guī)范及參數。因此，我們可以看出網頁設計在整個課程體系建設中的地位是非常重要的，是專業(yè)核心課程，為后續(xù)的UI設計課程提供了良好的基礎支撐。

四、結語

網頁設計在新媒體課程體系建設中有著重要的地位，起著承前啟后的作用。既能體現前期課程的學習效果，又能為后續(xù)的專業(yè)課程擬定方向，打好基礎。學好UI設計的前提是學好網頁設計，學好網頁設計是需要大量閱讀和練習的，其學習的過程與方法需要教師去提煉總結，改進教學方法，才能使學生更好地學習一門課程與技能。