边练边学：网页UI商业项目设计实战

　　本书详细讲解了不同类型Web端UI商业项目的设计理论、设计思路以及实际案例制作过程。全书共8章，具体包括网页UI设计概述、营销类企业网站首页UI设计、教育类企业网站着陆页UI设计、招聘类网站专题页UI设计、游戏类企业网站改版UI设计、企业网站信息管理后台UI设计、平台类商城UI设计以及电商类店铺首页UI设计。全书采用案例驱动的方式，让读者掌握不同行业、不同类型网站的设计规范和设计方法，并能够按照企业需求制作完整的企业网站。本书适合作为高等院校相关设计专业的教材，也适合UI设计爱好者和Web端界面设计人员阅读。

　　课工场是专注互联网教育的生态平台，汇聚了中国和北美数百位来自知名互联网企业 的行业大咖，向寻求就业和技术提升的人群提供直播、录播、面授等多模式教学场景，并通过遍布全国的线下服务中心提供成熟的学习服务，形成完善的“互联网+ 教育”解决方案。同时，课工场也为高校、企业、行业提供教育技术赋能，依托Transformer 智能教育生态平台，打造智慧校园、企业大学、行业培训的教育场景，提供一站式教育解决方案。

第 1章　网页UI设计概述　1
学习目标　1
本章简介　1
1．1　网页概述　2
1．1．1　网页的常见分类　2
1．1．2　网页UI的构成元素　5
1．1．3　网站开发的基本流程　8
1．2　网页UI设计相关理论　11
1．2．1　网页UI设计的基本流程　11
1．2．2　网页布局的基本原则　15
1．2．3　网页配色的基本方法　16
1．2．4　网页图像的应用原则　19
1．3　网页切片　21
1．3．1　网页切片概述　21
1．3．2　网页切片的编辑　23
1．3．3　常用的切片技巧　27
本章作业　29
第　2章 营销类网站首页UI设计　31
学习目标　31
本章简介　31
2．1　项目介绍　32
2．1．1　项目概述　32
2．1．2　首页UI设计要求　32
2．2　营销类网站首页UI设计相关理论　33
2．2．1　营销类网站概述　33
2．2．2　营销类网站的特点　33
2．2．3　营销类网站首页UI设计技巧　34
2．3　项目设计规划　35
2．3．1　项目需求分析　35
2．3．2　项目功能和层级梳理　38
2．4　网站首页UI设计实操　40
2．4．1　头部区域设计　40
2．4．2　轮播图区域设计　42
2．4．3　主要内容区域设计　44
2．4．4　页脚区域设计与首页切图　46
本章作业　48
第3章　教育类网站着陆页UI设计　49
学习目标　49
本章简介　49
3．1　项目介绍　50
3．1．1　项目概述　50
3．1．2　着陆页UI设计要求　50
3．2　着陆页UI设计相关理论　51
3．2．1　着陆页概述　51
3．2．2　着陆页的页面结构　56
3．2．3　着陆页的常见分类　63
3．3　着陆页UI设计方法　64
3．3．1　着陆页的展现形式　64
3．3．2　着陆页的布局类型　67
3．3．3　着陆页的配色原理　67
3．4　项目设计规划　69
3．4．1　项目需求分析　69
3．4．2　项目功能和层级梳理　71
3．5　网站着陆页UI设计实操　73
3．5．1　首屏区域设计　74
3．5．2　主要内容区域设计　76
3．5．3　次要内容区域和底部区域设计　78
本章作业　82
第4章　招聘类网站专题页UI设计　83
学习目标　83
本章简介　83
4．1　项目介绍　84
4．1．1　项目概述　84
4．1．2　专题页UI设计要求　84
4．2　专题页UI设计相关理论　85
4．2．1　专题页的常见类型　86
4．2．2　专题页的常见结构　87
4．2．3　专题页的常见风格　91
4．3　项目设计规划　93
4．3．1　项目需求分析　94
4．3．2　项目功能和层级整理　95
4．4　专题页UI设计实操　98
4．4．1　首屏区域设计　98
4．4．2　主要内容区域设计　102
4．4．3　页脚区域设计　104
本章作业　106
第5章　游戏类网站改版UI设计　107
学习目标　107
本章简介　107
5．1　项目介绍　108
5．1．1　项目概述　108
5．1．2　网站改版UI设计要求　108
5．2　网站改版UI设计的相关理论　108
5．2．1　网站改版的原因　108
5．2．2　网站改版的原则　110
5．2．3　网站改版UI设计的流程　111
5．3　项目设计规划　112
5．3．1　项目需求分析　112
5．3．2　项目功能和层级梳理　115
5．4　网站改版UI设计实操　116
5．4．1　首屏区域设计　117
5．4．2　主要内容区域设计　119
5．4．3　次要内容区域和底部区域设计　121
本章作业　124
第6章　企业网站信息管理后台UI设计　127
学习目标　127
本章简介　127
6．1　项目介绍　128
6．1．1　项目概述　128
6．1．2　信息管理后台UI设计要求　128
6．2　后台产品UI设计相关理论　129
6．2．1　后台产品的常见类型　129
6．2．2　后台产品的界面结构　131
6．2．3　后台产品的界面特征　132
6．3　项目设计规划　135
6．3．1　项目需求分析　135
6．3．2　项目功能和层级梳理　136
6．4　OA系统UI设计实操　140
6．4．1　登录页设计　140
6．4．2　内页设计　142
本章作业　143
第7章　平台类商城UI设计　145
学习目标　145
本章简介　145
7．1　项目介绍　146
7．1．1　项目概述　146
7．1．2　项目设计要求　146
7．2　电商平台UI设计相关理论　147
7．2．1　电商平台的常见分类　147
7．2．2　电商平台的常见功能　149
7．2．3　电商平台页面的基本结构　153
7．3　项目设计规划　160
7．3．1　项目需求分析　160
7．3．2　项目功能和层级梳理　162
7．4　平台类商城首页UI设计实操　163
7．4．1　首屏区域设计　164
7．4．2　商品展示区域设计　166
7．4．3　页尾区域设计　168
本章作业　168
第8章　电商类店铺首页UI设计　171
学习目标　171
本章简介　171
8．1　项目介绍　172
8．1．1　项目概述　172
8．1．2　项目设计要求　172
8．2　电商类店铺装修相关理论　172
8．2．1　店铺首页　172
8．2．2　商品详情页　180
8．2．3　商品关联页　184
8．2．4　商品列表页　186
8．3　项目设计规划　188
8．3．1　项目需求分析　188
8．3．2　项目功能和层级整理　190
8．4　电商类店铺首页UI设计实操　191
8．4．1　首屏区域设计　192
8．4．2　商品展示区域设计　194
8．4．3　页尾区域设计　197
本章作业　198