Fireworks網(wǎng)頁元素與網(wǎng)頁效果圖設(shè)計目錄

時間：2023-07-08 04:36:02 | 來源：營銷百科

時間：2023-07-08 04:36:02 來源：營銷百科

Fireworks網(wǎng)頁元素與網(wǎng)頁效果圖設(shè)計目錄：第1章　網(wǎng)頁效果圖設(shè)計的一般流程　1

n1.1　網(wǎng)頁效果圖設(shè)計流程概述　3

n1.1.1　創(chuàng)建輔助線　3

n1.1.2　繪制結(jié)構(gòu)底圖　4

n1.1.3　添加內(nèi)容　5

n1.1.4　切片　5

n1.1.5　優(yōu)化　6

n1.1.6　導(dǎo)出　7

n1.1.7　布局　9

n1.2　網(wǎng)站策劃　10

n1.2.1　收集客戶資料　10

n1.2.2　分析網(wǎng)站類型　10

n1.2.3　確定網(wǎng)站風(fēng)格　11

n1.3　各類網(wǎng)站的布局特點分析　12

n1.3.1　資訊類網(wǎng)站　13

n1.3.2　電子商務(wù)類網(wǎng)站　16

n1.3.3　互動游戲類網(wǎng)站　18

n1.3.4　教育類網(wǎng)站　23

n1.3.5　功能型網(wǎng)站　25

n1.3.6　綜合類網(wǎng)站　26

n第2章　網(wǎng)頁的布局　29

n2.1　網(wǎng)頁布局基礎(chǔ)　30

n2.1.1　網(wǎng)頁中的基本元素　30

n2.1.2　網(wǎng)頁的構(gòu)成　33

n2.1.3　網(wǎng)頁的空間與頁面尺寸　36

n2.1.4　頁面元素的分布情況　38

n2.2　網(wǎng)頁的布局設(shè)計　39

n2.2.1　布局方法　39

n2.2.2　確定版面率　40

n2.2.3　網(wǎng)格設(shè)計　43

n2.3　網(wǎng)頁布局的分類　45

n2.3.1　滿版布局形式　45

n2.3.2　十字布局形式　45

n2.3.3　九宮格布局形式　46

n2.3.4　米字布局形式　47

n2.4　網(wǎng)頁布局技巧　49

n2.4.1　黃金分割式布局(完美的比例給人視覺上的享受)　49

n2.4.2　左右對齊式布局(沒有浪費的空間，表現(xiàn)商業(yè)性形象)　52

n2.4.3　全景式布局(用趣味性吸引瀏覽者)　53

n2.4.4　衛(wèi)星式布局(以太陽為中心的衛(wèi)星環(huán)繞型)　55

n2.4.5　照片組合式布局(新世界以全景式自由的展現(xiàn)出來)　57

n2.4.6　包圍式布局(限定范圍的效果)　59

n2.4.7　散開式布局(山水畫般的自由和優(yōu)雅)　62

n2.4.8　單側(cè)齊行式布局(理性與自由共存的版式設(shè)計)　64

n2.4.9　對稱式布局(以中心為基線，左右對稱)　66

n第3章　網(wǎng)頁的色彩設(shè)計　69

n3.1　網(wǎng)頁設(shè)計要素——色彩　70

n3.1.1　色彩決定印象　70

n3.1.2　色彩印象無法更改　71

n3.1.3　色彩無處不在，具有多重效果　72

n3.2　色彩的原理　73

n3.2.1　光與色彩　73

n3.2.2　物體色　74

n3.2.3　色彩類型　75

n3.2.4　色彩三要素　76

n3.3　色相環(huán)的作用　79

n3.3.1　色相環(huán)的構(gòu)成　79

n3.3.2　色相環(huán)中的顏色特點　80

n3.3.3　色彩之間的關(guān)系　81

n3.4　網(wǎng)頁中的色彩　88

n3.4.1　RGB色彩模式　89

n3.4.2　HTML語言對顏色的描述　90

n3.4.3　216網(wǎng)頁安全色　91

n3.5　色彩索引　91

n3.5.1　紅色　91

n3.5.2　橙色　93

n3.5.3　黃色　94

n3.5.4　綠色　96

n3.5.5　藍色　97

n3.5.6　紫色　99

n3.5.7　黑色　101

n3.5.8　白色　102

n3.5.9　灰色　103

n3.5.10　色彩索引配色法　104

n3.6　色調(diào)的變化效果　104

n3.6.1　鮮艷的色調(diào)　105

n3.6.2　亮色調(diào)　105

n3.6.3　淡色調(diào)　106

n3.6.4　中間色調(diào)　106

n3.6.5　淺濁色調(diào)　107

n3.6.6　暗色調(diào)　107

n3.6.7　深色調(diào)　108

n3.7　色彩的四種功能　108

n3.7.1　主色　108

n3.7.2　背景色　109

n3.7.3　融合色　112

n3.7.4　強調(diào)色　113

n3.8　實用配色網(wǎng)站推薦　114

n第4章　Fireworks圖像處理關(guān)鍵技術(shù)精講　117

n4.1　Fireworks基本操作技巧集錦　118

n4.2　矢量繪制關(guān)鍵技術(shù)　120

n4.2.1　兩種方法繪制圓角矩形　120

n4.2.2　防止對圓角矩形變形的時候圓角改變　121

n4.2.3　巧妙消除路徑邊緣的鋸齒　122

n4.2.4　多種方法繪制虛線　123

n4.2.5　制作網(wǎng)頁效果圖中的清晰小字　124

n4.2.6　使文字按照路徑排列　125

n4.2.7　制作電視掃描線的效果　126

n4.2.8　自定義紋理　127

n4.2.9　添加和修改漸變色填充　128

n4.2.10　巧妙制作漸隱的線條　130

n4.2.11　解決圖標縮小后變形的問題　132

n4.3　圖像處理關(guān)鍵技術(shù)　134

n4.3.1　蒙版的3種用途　134

n4.3.2　選區(qū)和路徑的轉(zhuǎn)換　143

n4.3.3　制作圖像條形碼效果　146

n4.3.4　Fireworks中的外掛濾鏡　148

n4.3.5　制作淡彩鋼筆畫效果　151

n4.3.6　制作特殊的漸變色效果　153

n4.3.7　制作網(wǎng)格化圖像效果　154

n4.3.8　制作老照片效果　157

n4.3.9　使用【曲線】命令校正圖像的色彩　158

n4.3.10　使用【色階】命令調(diào)整圖像的色彩　165

n第5章　Fireworks網(wǎng)頁制作關(guān)鍵技術(shù)精講　169

n5.1　GIF動畫制作關(guān)鍵技術(shù)　170

n5.1.1　使用Fireworks制作補間動畫　170

n5.1.2　巧用'補間'技術(shù)作圖　171

n5.1.3　巧做網(wǎng)頁LOGO中的光描動畫　174

n5.2　Fireworks行為相關(guān)關(guān)鍵技術(shù)　176

n5.2.1　使用Fireworks制作交互按鈕　176

n5.2.2　使用Fireworks的行為實現(xiàn)圖像翻轉(zhuǎn)特效　179

n5.2.3　把Fireworks中的交互效果添加到網(wǎng)頁中　183

n5.3　切片和優(yōu)化的關(guān)鍵技術(shù)　187

n5.3.1　在Fireworks中對圖像進行優(yōu)化　187

n5.3.2　選擇合適的圖像優(yōu)化格式　188

n5.3.3　巧妙去除GIF圖像周圍的白邊　192

n5.3.4　導(dǎo)出效果圖切片　192

n5.4　Fireworks效率工具問題集合　198

n5.4.1　巧妙執(zhí)行重復(fù)的操作　198

n5.4.2　對大量的圖像素材進行批量處理　201

n第6章　網(wǎng)頁的LOGO設(shè)計　205

n6.1　LOGO設(shè)計的基本構(gòu)成要素　206

n6.1.1　LOGO中的線條　206

n6.1.2　LOGO中的形狀　208

n6.1.3　用線條和形狀構(gòu)成LOGO　209

n6.1.4　LOGO中的英文字體　210

n6.1.5　LOGO中的中文字體　212

n6.2　40種常用LOGO設(shè)計技巧　217

n6.3　Web2.0風(fēng)格LOGO設(shè)計要素　226

n6.4　實用LOGO設(shè)計網(wǎng)站推薦　228

n6.5　LOGO設(shè)計案例分析　229

n第7章　網(wǎng)頁的導(dǎo)航設(shè)計　233

n7.1　網(wǎng)站的欄目構(gòu)成　234

n7.2　導(dǎo)航的視覺設(shè)計　236

n7.3　導(dǎo)航的交互設(shè)計　240

n7.4　沒有'導(dǎo)航'的導(dǎo)航——搜索　241

n第8章　網(wǎng)頁的通欄設(shè)計　243

n8.1　網(wǎng)頁通欄概述　244

n8.1.1　網(wǎng)頁中的通欄　244

n8.1.2　網(wǎng)頁通欄的設(shè)計形式　246

n8.1.3　網(wǎng)頁通欄的尺寸　247

n8.2　圖像素材的選擇　247

n8.2.1　說服力的強弱　248

n8.2.2　內(nèi)容的相關(guān)度　250

n8.2.3　發(fā)掘圖像背后的故事　251

n8.2.4　色彩的層次　252

n8.2.5　與眾不同　252

n8.2.6　幽默詼諧　253

n8.2.7　唯美主義　253

n8.2.8　戲劇化　254

n8.2.9　強調(diào)臉部　254

n8.3　圖像裁剪的技巧　256

n8.3.1　將圖像轉(zhuǎn)化為相同的尺寸　256

n8.3.2　制作不同比例的圖像　257

n8.3.3　統(tǒng)一人物肖像的尺寸　257

n8.3.4　對人物肖像進行裁剪　258

n8.3.5　裁剪掉無關(guān)的部分　260

n8.3.6　調(diào)整圖像的角度　260

n8.3.7　放大后裁剪　261

n8.3.8　只保留局部　262

n8.3.9　改變圖像傳遞的信息　263

n8.3.10　一圖多用　263

n8.3.11　突破空間　266

n8.3.12　邊緣的處理　267

n8.4　圖像設(shè)計的技巧　269

n8.4.1　添加邊框　269

n8.4.2　疊加效果　270

n8.4.3　添加元素的效果　271

n8.4.4　剪貼簿效果　272

n8.4.5　卷曲效果　273

n8.4.6　制作'拍立得'效果　276

n8.4.7　異形邊緣　276

n8.4.8　小圖銳化　279

n8.5　通欄廣告的設(shè)計技巧　279

n8.5.1　選擇合適的素材　279

n8.5.2　環(huán)境背景設(shè)計　280

n8.5.3　產(chǎn)品的展示　281

n8.5.4　字體的選擇和設(shè)計　282

n第9章　簡單風(fēng)格的小型網(wǎng)站設(shè)計　285

n9.1　案例分析　286

n9.1.1　頁面布局形式　286

n9.1.2　添加文字和圖像　289

n9.2　案例實現(xiàn)　293

n9.2.1　制作效果圖　293

n9.2.2　切片、優(yōu)化和導(dǎo)出　296

n9.2.3　布局頁面　299

n第10章　標準型網(wǎng)站設(shè)計　311

n10.1　案例分析　313

n10.1.1　頁面布局形式　313

n10.1.2　頁眉的設(shè)計　314

n10.1.3　通欄的設(shè)計　316

n10.1.4　內(nèi)容區(qū)域的設(shè)計　318

n10.1.5　頁腳的設(shè)計　319

n10.1.6　字體的選擇　320

n10.2　案例分析　320

n10.2.1　制作結(jié)構(gòu)底圖　320

n10.2.2　頁眉設(shè)計　324

n10.2.3　通欄設(shè)計　325

n10.2.4　制作內(nèi)容區(qū)域　327

n10.2.5　制作頁腳　328

n10.2.6　切片、優(yōu)化和導(dǎo)出　330

n10.2.7　布局頁面　334

n……