任何一个网站的制作,都会经过“网站策划—交互设计—视觉设计—前端制作—后台制作—上线测试”六个环节,其中网站设计的核心任务则落在了“视觉设计”这个板块,而网站的交互设计、前后端及测试全部都是为最终呈现给客户的视觉设计而服务的。

1. 交互设计

这一阶段的工作通常由专业的交互设计师来完成,当然也时常可由产品经理兼职。 交互设计师得根据解析出的 PDR 需求文档,合理地组织网站框架,建立一级、二级导航栏目,规划网站内页的浏览路径,以及页面跳转关系。通常会用到 Sketch、或 OminiGraffle、mindnote 等软件来梳理页面逻辑及框架结构,以完成交互设计稿的绘制。以便网站受众在浏览过程中能高效、愉悦地获取到他们想要的信息。如果是页面不多,可在白板上或几张 A4 中完成这个环节的工作;页面巨多,则要将交互稿整理出图,打包为电子手册,方便下一工作环节的实施。

2. 视觉设计

现在该网页设计师正式出场了,这一环节中,设计师主要根据交互设计稿,确定网站内页的具体设计规范,包括网站颜色 VI 的选用、字体字号大小、以及素材的编排、选取及处理、每一根线条、每一个像素,都是由作为准网页设计师的你来把控了。将所有页面设计稿完毕后,标注好尺寸、颜色等数值信息,输出必要的图片、icon 等资源,打包好后一并交给 Web 前端工程师。

3. 前端制作

这个环节的主角是 Web 前端工程师。其主要根据网页设计师出具的设计稿,运用 HTML、CSS 代码实现页面重构和页面逻辑跳转,运用 JavaScript、JQuery 等技术优化网站浏览体验,以及网站界面交互动效、功能实现的制作。相信你的程序员定能给你办得稳妥妥的,当然在这个过程中会遇到些许问题,作为网页设计师的你要及时与之沟通,一起将界面的细节做到 99% 还原设计稿。

4. 后端制作

实现后端数据的逻辑处理,比如数据的提交存储、更新修改、查询等。这个环节的主角是Web后端工程师,通常要用到 PHP、java、C 语言或 C++ 等编程技术。

5. 测试上线

在网页重构及后端制作完成后,将代码模板套入 CMS(内容管理系统)完成本地测试,以检验其可靠性。在排除 bug 问题后,就可准备上线了。买个域名和服务器,做些必备的服务器配置工作,完成 DNS 解析,将域名和服务器连接起来,最后再运用 FTP 工具上传资料到服务器。于是该网站就可以正常访问了。

 

文章转自网络,并不代表本公司全部认同以上观点。— YAHUI.ME