在制作网站或者制作WebAPP前端开发和设计师关系比较紧密,通常情况下是由设计师完成了设计,然后把设计图交给前端工程师,前端工程师来实现这个设计方案,所以设计师在把设计图PSD文件交给前端工程师的时候就有一点必要的规范,才能让前端工程师减少切图的工作量,节省时间然后可以去做更多的事。
我在做前端的时候发现了一些问题,这些最好成为一个给设计师和前端工程师交接的一个标准,我想了一下大概的一些对于设计师的要求
1.PSD文件内部文件夹要清楚,每一个独立模块作为一个文件夹。许多小的文件夹最后构成一个大的页面,文件夹标题要写下这个模块的名字,这样可以提醒前端,这里是个什么样的。
2.PSD文件内部元素切好图片交给前端工程师。写代码比做设计慢的多,往往设计师改动一下现实效果,动动鼠标的事,对于前端来说,就可能改变很多代码,前端会PS切图就可以,但一般情况下,除非很简单的一个小图片,不然图片太多,前端不是设计师,切图会很慢。
3.切图要保证清晰度的情况下,尽可能的图片要小。这一点对于设计师和前端都重要,2014年中国的平均网速只有3.45MB/s,所以遇到一些图片较多的页面,图片尽可能的压缩,不然做出来的页面,用户用起来很痛苦,心急的人会没等加载完所有的图片就会关了这个页面,下次估计再也不想来访问这个页面了。
4.设计师如果想要修改设计方案,最好立刻通知一下前端,让前端有个心理上的准备。如果即将修改的部分还没写,前端就可以绕过去,先做其他的部分,节省了时间;如果已经写了,提醒一下,让前端可以对于自己手里的工作由各时间上的重新安排。 通知到了之后,设计师尽快把新的东西在PSD文件上修改好,重新交给前端,而不是口头上通知,口头上的修改意见要形成一个可见的PSD文件。
5.双方在交接的时候,设计师应该对前端说明PSD文件的哪些地方需要动态效果,前端当然也要记下来。最好是写下来,因为好记性不如烂笔头嘛,然后前端要想清楚这个需要动态效果的地方,需不需要背景透明的PNG图片,每个PNG图片需要大概的尺寸,让设计师切图出来。
6.字体是一个比较重要的问题,主要是字体样式的问题.设计师的电脑上肯定有很多的字体文件,在PSD文件里展示出来,视觉上的效果很不错的,但是因为用户或者前端工程师没有这个字体,实际上用户看起来,会觉得平淡无奇,影响设计师的效果。 一种方案是设计师把他在当前页面用到的所有的字体的文件发给前端一份,前端首先在电脑上写出来页面,如果放在服务器的时候,要把这些字体文件放在服务器,这样用户也可以正常使用。 另外一种方案是特殊字体的地方做成一张图片,背景透明与不透明,需要前端给出意见,图片的话,不用太多字体文件,省了一些麻烦
7.设计师与前端多交流,现在有很多的特殊效果很炫,但是中国的很多用户还是用的IE浏览器,而IE9及以下的浏览器对于HTML5和CSS3的特效支持性比较差,在IE浏览器中基本看不出效果,所以前端要考虑到浏览器的兼容性;还有一个页面太多的特效会降低阅读性,视觉效果会适得其反,那么双方就应该做一些调整,也可能是设计是让步,也可能是前端的让步,不管谁让步都是为了这个项目,设计师如果懂一点HTML的知识那就更好,更容易理解前端的想法
8.响应式设计应该先出来方案,双方应该沟通一下,响应式的视觉效果,然后设计师把三种设计方案做出来,然后告诉前端有了哪些不同的改变,一般响应式的设计方案就包含三种设备:PC 、平板、手机。只设计PC方案,然后要求前端做响应式,那么在手机上的视觉效果一定不是设计师想要看到的
以上的内容是站在前端的角度来看的,有很多都是我的想法,如果有什么问题,可以提出来,多交流双方的意见才能相互理解
网友评论