随着时代的发展，互联网视觉设计技术和设计趋势在不断发生变化。本书从互联网的
角度出发，以设计理论和项目实践相结合的方式，介绍了互联网视觉设计的相关知识与操作技能。本书共包括10章，主要内容包括初识互联网视觉设计、互联网视觉设计的基本原则、互联网视觉设计的基本要素、电商视觉设计、微信公众号视觉设计、H5视觉设计、网站页面视觉设计、活动广告页面视觉设计、短视频视觉设计、综合案例—家居类品牌视觉设计。在学习过程中，读者可通过每章的项目，训练设计思维和实际操作力，进而理解和掌握互联网视觉设计中的关键知识。

王旭玮
广东轻工职业技术学院艺术设计学院副教授、硕士
教育部精品课程《标志与VI设计》主讲教师
省级精品课程《字体设计》主讲教师
国家级教学团队“广告设计与制作”成员
主要担任课程：
《书籍装帧设计》、《包装设计》、《广告设计》、《标志与VI设计》等专业设计课程。
出版有《设计解码-标志编》、《书籍设计》、《标志与VI设计与应用》

第 1章 初识互联网视觉设计　/ 1
1.1　互联网视觉设计概述 /　2
1.1.1　什么是互联网视觉设计 /　2
1.1.2　视觉设计在互联网中的体现 /　2
1.1.3　互联网视觉设计未来的发展趋势 /　3
1.2　互联网视觉设计前的准备工作 /　3
1.2.1　了解目标消费者的心理 /　3
1.2.2　分析品牌并收集素材 /　6
1.2.3　明确视觉定位 /　7
1.2.4　布局视觉页面 /　7
1.3　互联网视觉设计思维 /　8
1.3.1　设计思维 /　8
1.3.2　运营思维 /　8
1.3.3　营销思维 /　9
1.4　学好互联网视觉设计应具备的能力 /　9
1.4.1　创造能力 /　9
1.4.2　审美能力 /　9
1.4.3　软件操作能力 /　10
1.4.4　营销文案写作能力 /　10
项目一　运用互联网设计思维分析海报页面 /10
项目二　规划网店活动页面布局 /12
思考与练习　/13
第　2章 互联网视觉设计的基本原则 /　14
2.1　对比原则 /　15
2.1.1　色彩对比 /　15
2.1.2　图文对比 /　17
2.1.3　方向对比 /　18
2.1.4　大小对比 /　18
2.2　重复原则 /　19
2.2.1　重复原则的准则 /　19
2.2.2　重复原则的运用 /　19
2.3　平衡原则 /　21
2.3.1　对称平衡 /　21
2.3.2　非对称平衡 /　21
2.4　节奏与韵律原则 /　22
2.4.1　节奏与韵律原则的概念 /　22
2.4.2　节奏与韵律原则的运用 /　22
项目一　分析网站中视觉设计的基本原则 /　23
项目二　中秋节Banner视觉设计 /　24
思考与练习　/　27
第3章　互联网视觉设计的基本要素 /　28
3.1　色彩 /　29
3.1.1　色彩的属性 /　29
3.1.2　色彩的搭配 /　31
3.1.3　色彩的组合 /　32
3.1.4　色彩的聚焦 /　32
3.2　文字 /　33
3.2.1　文字的字体 /　33
3.2.2　文字的对比 /　33
3.2.3　文字的排版 /　34
3.3　图片 /　35
3.3.1　图片的基本要求 /　35
3.3.2　图片的简单处理 /　36
3.3.3　GIF动图的制作 /　37
3.4　构图 /　38
3.4.1　切割构图法 /　38
3.4.2　韵律构图法 /　38
3.4.3　平衡构图法 /　38
3.4.4　放射构图法 /　38
3.4.5　流程构图法 /　39
3.4.6　物体轮廓构图法 /　39
项目一　规划茶叶海报页面 /　40
项目二　规划“11.11”活动页面 /　41
思考与练习　/　43
第4章　电商视觉设计 /　44
4.1　电商视觉设计的原则 /　45
4.1.1　功能性原则 /　45
4.1.2　可视性原则 /　46
4.1.3　统一性原则 /　47
4.2　网店页面视觉设计 /　47
4.2.1　网店页面的素材准备 /　48
4.2.2　网店页面的视觉定位 /　49
4.2.3　网店图片设计规范 /　50
4.2.4　网店页面视觉设计的基本要求 /　51
4.3　网店首页视觉设计 /　52
4.3.1　网店首页视觉设计要点 /　52
4.3.2　店招模块视觉设计 /　53
4.3.3　首页焦点图模块视觉设计 /　54
4.3.4　优惠券模块视觉设计 /　54
4.3.5　分类导航模块视觉设计 /　55
4.3.6　活动展示模块视觉设计 /　55
4.4　商品详情页视觉设计 /　56
4.4.1　商品详情页的制作规范 /　56
4.4.2　商品详情页的内容安排 /　56
4.4.3　商品详情页视觉设计案例分析 /　57
项目一　食品类网店首页视觉设计 /　58
项目二　坚果商品详情页视觉设计 /　65
思考与练习　/　71
第5章　微信公众号视觉设计 /　72
5.1　了解微信公众号 /　73
5.1.1　微信公众号的类型 /　73
5.1.2　微信公众号的功能 /　76
5.1.3　微信公众号的设置 /　76
5.1.4　微信公众号的视觉设计元素 /　79
5.2　微信公众号的视觉设计流程 /　80
5.2.1　分析消费者需求 /　80
5.2.2　分析竞争对手 /　82
5.2.3　确定设计风格 /　82
5.2.4　完成设计草案 /　82
5.3　微信公众号各版块视觉设计 /　83
5.3.1　公众号封面视觉设计 /　83
5.3.2　公众号Banner视觉设计 /　83
5.3.3　公众号广告视觉设计 /　84
5.3.4　公众号推荐视觉设计 /　85
5.3.5　公众号求关注视觉设计 /　85
项目　“食味坊”微信公众号页面设计 /　86
思考与练习　/　92
第6章　H5视觉设计 /　93
6.1　H5概述 /　94
6.1.1　什么是H5 /　94
6.1.2　H5的类型 /　95
6.1.3　制作H5的常用工具 /　98
6.2　H5视觉设计的基本流程 /　99
6.2.1　做好前期准备 /　99
6.2.2　绘制H5原型图 /　99
6.2.3　设计H5界面 /　100
6.2.4　利用工具制作H5 /　100
6.2.5　分享与发布H5 /　101
6.3　H5视觉设计要点 /　102
6.3.1　创新创意 /　102
6.3.2　统一风格 /　102
6.3.3　注重氛围 /　103
6.3.4　强调真实的用户体验 /　104
6.4　H5视觉设计分析 /　104
6.4.1　版式设计分析 /　104
6.4.2　交互设计分析 /　104
6.4.3　活动设计分析 /　105
6.4.4　动效设计分析 /　106
6.4.5　音效设计分析 /　107
项目　促销活动H5视觉设计 /　107
思考与练习　/　117
第7章　网站页面视觉设计 /　118
7.1　了解网站页面视觉设计 /　119
7.1.1　网站页面的视觉构成元素 /　120
7.1.2　网站页面的视觉设计特点 /　122
7.1.3　网站页面的视觉设计原则 /　124
7.2　网站页面布局与视觉风格 /　126
7.2.1　网站页面布局的常见方式 /　126
7.2.2　网站页面布局形态 /　128
7.2.3　常见的网站页面视觉设计风格 /　129
7.3　网站页面的视觉设计流程 /　132
7.3.1　需求分析 /　132
7.3.2　制作原型图 /　132
7.3.3　确定网站页面的风格与规范 /　133
7.3.4　制作网站页面 /　133
7.3.5　网站页面切片 /　134
项目　设计旅游网站首页页面 /　134
思考与练习　/　141
第8章　活动广告页面视觉设计 /　142
8.1　明确活动广告的目的 /　143
8.1.1　拉新 /　143
8.1.2　留存 /　144
8.1.3　扩大品牌知名度 /　144
8.1.4　清理库存 /　145
8.2　活动广告页面的设计原则 /　146
8.2.1　主题突出 /　146
8.2.2　风格统一 /　146
8.2.3　目标明确 /　147
8.3　活动广告页面的设计要求 /　148
8.3.1　明确活动主题风格 /　148
8.3.2　合理搭配色彩 /　149
8.3.3　合理搭配点缀物 /　151
8.3.4　营造促销氛围 /　151
项目一　分析“中秋节”活动广告页面 /　153
项目二　“化妆品节”活动广告页面视觉设计 /　155
思考与练习　/　159
第9章　短视频视觉设计 /　161
9.1　认识短视频 /　162
9.1.1　短视频的特点 /　162
9.1.2　短视频的发展趋势 /　163
9.1.3　短视频的主要类型 /　163
9.2　短视频的视觉设计流程 /　165
9.2.1　前期准备 /　165
9.2.2　拍摄短视频 /　166
9.2.3　后期制作 /　166
9.3　短视频的拍摄 /　166
9.3.1　短视频拍摄的主流平台 /　166
9.3.2　短视频拍摄的要点 /　167
9.3.3　短视频拍摄的构图 /　168
9.4　短视频的后期处理 /　169
9.4.1　短视频后期处理的主流平台 /　170
9.4.2　为短视频添加字幕 /　170
9.4.3　为短视频添加特效 /　171
9.4.4　为短视频添加贴纸 /　172
9.4.5　为短视频添加音乐 /　172
9.4.6　为短视频添加滤镜 /　173
9.4.7　为短视频添加转场 /　173
项目一　拍摄水果类短视频 /　174
项目二　水果类短视频的后期处理 /　176
思考与练习　/　180
第　10章 综合案例——家居类品牌视觉设计 /　181
10.1　案例分析 /　182
10.1.1　分析需求 /　182
10.1.2　确定风格与方向 /　183
10.2　设计移动端网店首页页面 /　183
10.2.1　前期策划 /　184
10.2.2　家居类移动端网店首页设计 /　184
10.3　设计商品详情页 /　188
10.3.1　前期策划 /　188
10.3.2　沙发商品详情页设计 /　189
10.4　设计网站首页页面 /　192
10.4.1　前期策划 /　192
10.4.2　网站首页页面设计 /　194
10.5　设计品牌活动宣传页面 /　197
10.5.1　前期策划 /　197
10.5.2　微信公众号页面视觉设计 /　198
10.5.3　H5活动页面视觉设计 /　202
10.5.4　网页活动广告页面视觉设计 /　205
10.6　拍摄与处理家居短视频 /　206
10.6.1　前期策划 /　206
10.6.2　家居短视频的拍摄 /　207
10.6.3　家居短视频的后期处理 /　208

设计基础+基本要素+电商+微信公众号+H5+网站+活动广告短视频+综合实战
理论基础+项目实战+综合项目实训
配套资源包括PPT+教学大纲+教案+慕课视频

互联网 视觉设计 Photoshop 新媒体 微信 H5 电商 广告 短视频 高职-计算机-数字媒体应用技术