网页设计的流程及思路 PPT

17
第二阶段 构思，调用资料 草图 填充内容 内容的置入
18
将资料内容结构化，包括首页、栏 目页、内容页、功能页以及各个页面中 的版块及栏目
19
第三阶段 制作，套用规则 版式布局 配色 处理图片/动画
20
根据网站的版式分为两大类：
形象网页：多用于网站的形象宣传页面，它的特
点是页面的布局结构自由，页面中以图像或者是Flash 为主，文字较少。这种页面的主要针对于形象宣传性 质的网站，偏重设计性。
内容网页：多用于网站的内容页，大型的门户网
站多采用这种类型的页面版式。其特点是文字信息多， 页面中的图像相对较少，整个页面按不同的布局划分 为多个区域，主要的作用是为了传达文字信息。
21
“内容页面”的版式一般可分为： 1.水平分割 水平分割，强调的是层次感和精确感，并有助于不同 信息的分类；水平分割的同时还应当考虑到分割的面 积，水平不均匀分割，如果上半部安置标题或导航， 则面积较小；上半部安置主体内容，则面积应适当加 大， 2.垂直分割 垂直分割和水平分割有很多相似点，把水平分割的页 面旋转90°即为垂直分割效果。
（颜色版式）——（每个板块）——细节
2、沟通——审稿——定稿
12
五、网页制作（写成页面）
13
六、调整出彩
14
思路
15
第一阶段 收集资料 ？如何收集资料 ？收集哪些资料
16
资料来源：客户、素材库
资料主要包括客户公司的图片、产品图 片、广告图片、以及内容文字资料等等。 一般情况是,客户会提供部分资料,更多的, 图片我会去素材网站找找。
22
3.水平垂直分割 水平垂直分割是上面两种分割形式的综合运用，整个页面 中既有水平分割的部分，又有垂直分割的部分，互相交织 构成一种网状结构。这样的页面给人一种非常稳定的感受。 4.变化分割 变化分割是在水平分割和垂直分割的基础上，添加斜线和 曲线的效果，这样的页面版式结构给人自由、运动和时尚 的感觉。
网页设计的流程及思路
1
问题： 1、接到一个项目，你要去做什么？ 2、流程是怎样的？
2
流程
3
一、沟通了解（知己知彼，百战不殆）
4
要了解的内容
1、客户的需求及要求（收集客户资料） 2、同行业此类网站的调查（网上查询、 搜集资料） 3、总结此类网站的鲜明特点及最新动态
5
二、确定网站的主题、内容及风格
23
在实际的创作之前，可以在网上参考相关的页面布局作为 参考，网页设计最大的优势就是你所要设计的网页，在网 络上都能找到参考的页面。可能有些人喜欢完全的“原 创”，人为过多的参考别人的设计就是“抄袭”。但是对 于大多数初学者来说，这种必要的“借鉴”是必不可少的， 见多识广，积累到一定的程度，把别人的精华拿为己用， 这是提高自己设计能力的一种最快的方法。
6
包含的内容
1、确定主题 2、版块及栏目 3、色彩，也就是主色调 4、风格，以网站的类型为基础确定风格
7
三、绘制草稿
8
大家有疑问的，可以询问和交流
可以互相讨论下，但要小声点
9
包含的内容
1、尺寸的选择 2、版式 3、将主要内容填充
10
四、平面设计——制作、定稿
11
包含的内容
1、制作的流程 先整体——后局部——再细节
推演到咱们网页设计上来说,就是这 样一些工作:处理图片、细节、色彩、 排版构成、用户体验等等。
27
wk.baidu.com
24
第四阶段 用户体验 细化 出彩
25
如果把网页设计简单的比作烹饪,这四个阶 段也就是说这么几回事儿: 1.顾客提出相关要求; 2.店方去思考如何做出一道客户称道的佳肴 3.店方准备好烹饪所需的材料; 4.炒菜;
26
而最后的炒菜,需要解决问题就是: 在分析结果的指导下,怎么样去把材料 变成一道色、香、味俱全的美味?