面试不在尴尬—网页设计师需知的工作流程

网页设计工作流程

对于即将毕业或者将要从事网页设计的同学来说，很多人对于网页设计的流程非常的模糊，不清楚具体网页设计在工作中要做哪些工作，如何做才能成为一名优秀的网页设计师。那么今天，来给大家分享一下网页设计的一个具体的流程，帮大家去梳理一下网页设计师日常的工作流程细节。

01

接到需求

说到需求，一般这个需求来源于哪呢？对于一个比较正式的公司来说，都会设置PM（产品经理）这个岗位，产品经理会在前期将客户对网站的需求收集过来，按照一定的层级进行划分，搭建一个网站的整体的框架，就相当于建房子的时候将房子的整个框架搭建起来。那么当PM搭建好这个框架以后，就会将它交给我们网页设计师，一般会用原型图或者文档的形式。（如下图）

02

原型分析

当我们拿到原型图以后网页设计是什么工作，需要去分析它的结构：

1.看看每一个页面里面有什么内容

2.页面内容之间的层级关系是什么样的

3.观察它们每一个页面之间的逻辑关系

4.每一个功能与功能之间的联系

03

确定风格，制定规范

当我们把整个网站的框架分析一遍，了解了里面的具体细节以后，就可以开始考虑它的整体视觉了。在这里，首先我们要考虑的就是整个网站的设计风格，风格的确定我们可以根据前期调研结果来参考，比如：我们的目标用户主要是谁？男性用户还是女性？80后还是90后等等网页设计是什么工作，这些都可以作为网站风格确定的一个参考。

风格确定了以后，我们还需要来制定整个网站的设计规范。这个地方需要说一下就是，很多公司或者设计师是先设计出网站以后再制定设计规范的，目的是后期做版本更新或者迭代的时候有依据，这样不会导致后面的设计师或者后续版本与前期的差别太大。所以到底是先设计还是先制定设计规范，具体看在公司里面时间截点的把控。如果前期时间比较充足，我们可以先制定网页的设计规范，如果时间比较紧，我们可以后期再来制定网页的设计规范。

这里列举一下一般设计规范包括哪些，当然不止这些咯，下去自己查了...

04

板式设计，丰富视觉

当我们把以上所有都完成了以后，就可以开始打开软件来设计网站的视觉效果了，在设计的时候，也是有条理的。首先我们可以按照栅格化的方式排好板式布局，其次再去添加内容元素，该设计图标就去设计图标，该添加图片的地方添加图片等等。这样就能够出一个版的视觉效果图了，这种图一般会被叫做设计稿，此时我们需要将设计稿发给PM或者设计总监审阅一下，问下他们的意见，如果他们提出了一些建议，我们可以给他们讲述一下设计思路，那么如果他们还是不满意的话，就需要我们再回去调整了，直到他们同意签字才算是完成设计稿。

05

标注切割，命名打包

当设计稿签字通过以后，我们就可以进行标注切图的工作了，这个工作就比较简单了，因为网页不会设计到几倍图的关系，所以我们只需要设计的时候多大图，切多大的图就可以了。当我们切完图了以后，特别需要注意的是一定要规范命名，因为这些图是需要交给前端工程师的，所以我们的命名是能够让他们看的懂得。最后，我们要养成整理的习惯，将我们的文件分类整理，放在不同的文件夹里面。

06

编码上线

当然这一部分工作并不是所有设计师都会做的，可能一部分网页设计师以后工作中需要承担前端编码的工作，那么就可以自己照着设计图去敲代码了。

总结：

那么以上给大家总结的就是网页设计师的整个工作流程了，当我们去做网页设计的时候可以按照这六个步骤去执行。当然，具体情况还需要根据在公司的情况去应对，不会差别太大。所以希望不管是没做过网页设计师的同学还是即将从事网页设计师的同学都不要害怕，因为这些我们都是熟练掌握的。