網頁創(chuàng)意與藝術設計》是高等職業(yè)教育數字媒體專業(yè)群教學資源庫配套教材。 “網頁藝術設計”是網站建設技術形態(tài)的延伸,是一門以視覺藝術為主要表現形式的課程。 《網頁創(chuàng)意與藝術設計》將用戶體驗、創(chuàng)意設計引入網頁藝術設計中,按照網頁設計的總體流程展開內容,從網頁藝術設計的內容、原則和特點等方面在理論上進行深入探討,并對網頁藝術設計的具體技巧進行了細致分析。 《網頁創(chuàng)意與藝術設計》在知識層面涵蓋了網站用戶體驗、用戶研究、網頁創(chuàng)意設計、網頁版式設計、色彩設計、文字設計、圖形圖像設計等內容,其教學重點是基于用戶體驗,圍繞網頁藝術設計進行各設計要素和設計法則的講解、分析和運用。 《網頁創(chuàng)意與藝術設計》內容豐富,結構清晰,技術參考性強,適合作為高職高專院校及職業(yè)學校相關課程的教材,還可以作為相關培訓機構的參考教材,以及網頁設計工作者和愛好者的自學讀物。
隨著互聯(lián)網和數字技術的發(fā)展,網頁設計逐漸演變?yōu)橐环N視覺語言,是集創(chuàng)意、技術、美感于一體的創(chuàng)新活動。它可以根據客戶的需求向瀏覽者傳遞信息。如何在浩瀚的網頁海洋中,讓設計出的網頁取得驚鴻一瞥的精彩效果,從眾多的網頁中脫穎而出,吸引到更多的受眾人群,贏得用戶的瀏覽和信任,這就需要考慮瀏覽者的使用體驗。如果沒有把網站用戶體驗的相關細節(jié)處理好,會直接影響網站的轉化率,這一現象在電子商務類型網站方面尤為明顯。
網頁設計具有技術性與藝術性融合的特征。一方面,網頁設計綜合了多個設計軟件的運用,各種設計元素(如圖像、動畫、文字和流媒體等)都是通過網頁編輯軟件進行整合,從而形成網頁。另一方面,隨著網絡信息的增加,人們對網頁的形式具有了較高的要求,出現了一些注重網頁藝術效果的作品,網頁設計就此發(fā)展成為一門藝術,具有了自身的藝術語言。
本書在內容編寫方面,遵循網頁創(chuàng)意藝術設計的規(guī)律,根據網頁設計的基本流程,從用戶需求出發(fā),以提高網站用戶體驗為核心進行網頁創(chuàng)意設計。具體內容包括網站用戶體驗、用戶研究、創(chuàng)意設計、網頁版式設計、網頁色彩設計、網頁文字設計、網頁圖形圖像設計、網頁創(chuàng)意設計綜合案例等內容。學習過程建議采用“鑒賞、臨摹、創(chuàng)意、設計、制作”5個步驟,著重培養(yǎng)學習者的創(chuàng)意藝術設計能力,將網頁作為一件藝術作品進行設計與制作,實現技術與藝術的融合。本書每章都附有一定數量的優(yōu)秀案例和訓練題目,方便學習者進行鑒賞、臨摹、創(chuàng)意、制作。最后一章將本書的主要知識點融入到完整的案例教學中,使讀者可以全方位地鞏固和掌握網頁創(chuàng)意設計方法。
本書由楊欣斌任主編,劉文娟、于洪波、李曉、黃蓉、于成龍任副主編。
由于時間倉促,疏漏之處在所難免,懇請讀者批評指正。
第1章 網頁藝術設計概論
1.1 網頁藝術設計概述
1.2 網頁藝術設計的獨特性
1.2.1 媒體性
1.2.2 技術性
1.2.3 藝術性
1.2.4 交互性
1.3 網頁藝術設計的構成要素
1.3.1 文字
1.3.2 圖形圖像
1.3.3 色彩
1.3.4 多媒體
1.3.5 版式
1.4 網頁設計的基本流程
1.4.1 確定網站主題
1.4.2 根據需求分析繪制原型圖
1.4.3 設計分析
1.4.4 設計分解
1.4.5 快速構思創(chuàng)意并繪制草圖
1.4.6 網頁設計效果圖
1.4.7 交互動態(tài)效果圖
1.4.8 案例分解
1.5 優(yōu)秀網站鑒賞
1.5.1 電商類網站
1.5.2 企業(yè)類網站
1.5.3 文化教育類
1.5.4 休閑生活類
1.5.5 旅游類網站
1.5.6 科技類網站
1.6 小結
第2章 網站用戶體驗
2.1 網站用戶體驗基礎
2.2 用戶體驗的概念
2.3 用戶體驗的構成要素
2.4 網站用戶體驗的優(yōu)化方法
2.4.1 感官體驗優(yōu)化的方法
2.4.2 交互體驗優(yōu)化的方法
2.4.3 瀏覽體驗優(yōu)化的方法
2.4.4 情感體驗優(yōu)化的方法
2.4.5 信任體驗優(yōu)化的方法
2.5 用戶體驗訓練
2.6 小結
第3章 用戶研究
3.1 用戶研究概述
3.1.1 用戶研究定義
3.1.2 用戶研究的內容
3.1.3 用戶研究的目的
3.2 用戶研究的方法
3.2.1 問卷法
3.2.2 用戶訪談法
3.2.3 焦點小組
3.2.4 卡片分類法
3.3 用戶研究案例——網易印像派首頁改版
3.3.1 項目背景
3.3.2 解決方案
3.4 用戶研究訓練
3.5 小結
第4章 網頁創(chuàng)意設計
4.1 網頁創(chuàng)意設計概述
4.1.1 什么是創(chuàng)意
4.1.2 創(chuàng)意思維的原則
4.1.3 網頁創(chuàng)意過程
4.2 網頁創(chuàng)意設計方法
4.2.1 借鑒創(chuàng)意法
4.2.2 情景(情感)映射創(chuàng)意法
4.2.3 思維導圖創(chuàng)意法
4.2.4 頭腦風暴與逆向思維創(chuàng)意法
4.3 創(chuàng)意思維的種類
4.3.1 聯(lián)想思維
4.3.2 發(fā)散聚斂
4.3.3 現實映射
4.3.4 元素組合
4.4 創(chuàng)意思維訓練
4.5 小結
第5章 網頁版式設計
5.1 網頁版式設計概述
5.1.1 網頁版式設計的概念
5.1.2 網頁版式設計中的點、線、面
5.1.3 網頁版式設計的視覺流程
5.2 網頁版式設計的方法
5.2.1 網頁版式設計的原則
5.2.2 網頁版式設計的表現手法
5.3 網頁版式設計實踐
5.3.1 綜合分析
5.3.2 素材收集
5.3.3 繪制骨骼圖
5.3.4 定制初稿
5.3.5 定稿
5.4 網頁版式設計案例與分析
5.4.1 門戶類
5.4.2 教育類
5.4.3 企業(yè)類
5.4.4 餐飲類
5.4.5 藝術類
5.4.6 休閑類
5.5 網頁版式設計訓練
5.6 小結
第6章 色彩設計
6.1 網頁色彩的理論基礎
6.1.1 色彩的屬性
6.1.2 光的三原色與印刷三原色
6.1.3 HTML語言對色彩的描述
6.1.4 網頁安全色
6.1.5 色彩的心理效應
6.2 網頁色彩的搭配方法
6.2.1 網頁色彩搭配的原理
6.2.2 網站主題色的搭配
6.2.3 配色印象空間
6.3 網頁色彩的實踐
6.3.1 明確網站的目的和用戶需求
6.3.2 按商業(yè)活動分類
6.4 網頁色彩設計案例與分析
6.4.1 地區(qū)風格與配色
6.4.2 行業(yè)風格與配色
6.5 網頁配色訓練
6.6 小結
第7章 文字設計
7.1 網頁文字的基本概論
7.1.1 網頁文字的表現形式
7.1.2 網頁文字的運用
7.1.3 網頁文字編排的基本形式
7.2 網頁文字的設計方法
7.2.1 網頁文字的設計技巧
7.2.2 網頁文字的創(chuàng)意變形
7.3 網頁文字設計實踐
7.4 網頁文字設計案例與分析
7.5 網頁文字設計訓練
7.6 小結
第8章 網頁圖形圖像設計
8.1 網頁圖形圖像設計概述
8.1.1 網頁圖形圖像的構成要素
8.1.2 網頁圖形圖像設計原則
8.2 網頁圖形圖像設計方法
8.2.1 同構
8.2.2 替代
8.2.3 聯(lián)想
8.2.4 寓意
8.2.5 情感渲染
8.2.6 夸張
8.2.7 幽默
8.2.8 層次空間
8.2.9 直觀
8.3 網頁圖形圖像設計實踐
8.3.1 網頁Logo設計
8.3.2 網頁背景及主圖設計
8.3.3 網頁超鏈接設計
8.4 網頁圖形圖像設計案例與分析
8.4.1 門戶類
8.4.2 教育類
8.4.3 企業(yè)類
8.4.4 餐飲類
8.5 網頁圖形圖像設計訓練
8.6 小結
第9章 網頁創(chuàng)意設計綜合案例
9.1 確定網站項目主題
9.2 進行用戶研究,確定網站定位
9.3 網頁創(chuàng)意設計
9.4 搜集篩選素材
9.5 確定視覺語言、元素及動態(tài)展現
9.5.1 “拍印網”頁面元素設計
9.5.2 “數字媒體藝術專業(yè)網站”頁面元素設計
9.6 整體設計與表現
9.6.1 “拍印網”整體設計
9.6.2 “數字媒體藝術專業(yè)網站”整體設計
9.6.3 “室內設計網站”整體設計
9.7 小結