设计一直过不了稿怎么办

作者:网站建设公司 来源:佛山网站建设日期:2020-11-11 浏览:

网站建设 - 建站教程 - 网页设计 - 设计一直过不了稿怎么办


在互联网产品的研发流程中,页面的视觉还原是很重要的一个步骤,也往往是问题多的一个环节。如果一些细节问题在这个环节没有被有效地发现并解决,那么后续流程中再去解决这些问题的成本就会呈指数上升。

那么今天我们就来梳理一下,看看前端工程师本身以及上下游的角色之间,都会容易遇到哪些常见的问题。
佛山网站建设

设计师

设计师是贴近产品体验的人,但是术业有专攻,设计师往往更加注重视觉的表现,而容易犯一些美丽的错误:
佛山网站建设

1,以原生 APP 的体验类比 H5 页面设计

我们都知道,原生 APP 的体验非常流畅,界面也非常华丽,所以设计侧也尽量向原生 APP 的体验靠拢。但是现实往往很残酷,许多 APP 的体验换到 H5 上实现就惨不忍睹,比如一个包含复杂操作的浮层,在各种低端机上可以说是漏洞百出。所以这里,建议设计师可以多比照其他 H5 网站的表现来进行设计,而不要经常比照 APP 的体验。

2,设计稿都是的状态

是的,设计稿上面往往体现的都是的状态。而前端开发人员往往要考虑各种溢出状态,多个超出、折行、撑开等等。这些情况多数在设计稿上不会体现,往往要到开发过程中再去确认细节,比较浪费时间。

3,活字用了非系统字体

所谓活字,就是直接以文本形式展示在页面上,而不是用图片模拟的文字。对于这部分字体,我们一般会采用系统字体中的一种,不会因为几个特殊字体而去加载一套中文字体文件。如果是英文字体,还可以考虑在高级浏览器下的自定义字体,不过也要考虑优雅降级,以及字体的版权问题。所以老大问:为毛跟设计稿不一样?我们只能说,没这字体啊... 这里建议,即使是设计稿,活字也要用系统字体,否则就是坑啊,看着好看又实现不了。

4,版本不清晰

设计出的稿子,往往是一段时间的规划功能,再去跟产品确认。而产品一般会说,这个先不要,那个先不做。但当真正去掉之后,所有这些间距调整,颜色背景影响等等,还是要再跟设计师确认。所以如果可能的话,应该每次需求只突出变更部分,而不是一个大而全的稿子。

5,这个应该这么切

关于这个问题,已经无力吐槽了,这页面真的不是切出来的。你说这么切那么切,你切个给我看看?分明是撸出来的嘛~


前端开发
佛山网站建设

前端开发,也有称页面仔,切图仔,在还原设计的过程中,容易遇到的问题就更多了:

1,不考虑溢出

关于溢出这里有个基本的法则,就是只要是动态输出内容,或者有用户输入的,就一定要考虑溢出状态的展示。文字溢出,列表溢出等等。当拿到设计稿时,确认好布局之后,就是各种溢出状态的确认了。

2,不分析设计稿就动手写代码

作为新手拿到设计稿之后,往往都想很快写代码,因为写代码才有快感。殊不知,页面结构的分析就跟程序架构一样重要,分析透彻才能兼顾各种情况以及部分的需求变更,所谓磨刀不误砍柴工,结构分析一定要先做的。

3,不考虑增删元素的状态

稍微大一点的公司,往往是多个需求并行,所以设计稿可能有超前的部分,或者中间由于各种原因实现不了的功能。作为一个合格的前端工程师,在实现页面的时候,就要做到一些可能变动的部分就算删掉也不会对页面造成大面积影响。

4,不考虑可维护性

能自适应的地方尽量用自适应,以便应付需求变更。比如多个楼层,宽度调整,加个icon等等。举个简单例子,比如一个框框中间有个居中的按钮,很多新手是直接用 margin-left 来定位的,这样如果外层框框宽度调整,这个 margin-left 值就得跟着调整。虽说调个宽度也不麻烦,但是当开发大型复杂页面的时候,这些联动的小改动也足够搞死人了。

5,不仔细看设计稿

常见的错误就是,设计稿上有边框,但是颜色太淡没看到。或者设计稿没边框,由于迭代样式,加了深色背景,忽略了边框没有去掉。还有一种情况就是设计稿上的色块是盖住边线的,但是实现的时候没有盖住,就导致那一部分看起来像凹进去一样。

6,看出 1px 没那么难

很多新人都觉得要对齐 1px 的差距好难,听上也有点吹毛求疵了。但是你想想,假如你是设计师,辛辛苦苦做出来个设计稿,哪哪都对不齐,你不会觉得不爽?其实只要你认真仔细看,再加上一些练习,差几像素几乎一眼就可以看出来。实在不行感觉不确定,可以截图到 PS 里面放大,再用参考线对比。

7,不考虑可扩展性

很多时候我检查页面还原,无非是多加几个项目,多填些文字先试试看,但是很多人这一关都过不了。加了项目,要么就是没有设置多行时候的下边距,要么就是再多一行边框变了,或者结尾的项目又要单独设置样式。加了文字,就直接顶出去毁了结构。

好了,吐槽这么多大家一定已经够了,相信大家在工作流程中都会遇到各种各样的细节问题,还有一些反反复复一遍又一遍遇到的问题,比如忽然一阵捉急的跑来:这个页面怎么乱了啊啊啊,麻烦快看看~~~答:ctrl+0,你放大了...... So,你有没有什么想吐槽的呢?


企业网站建设一条龙
找零度飞易网络公司-fslingdu所做php网站建设方案网站设计网站制作北京上海深圳龙岗衢州兰州常州东营南通济宁桂林淮安烟台长春无锡天津昆山苏州合肥洛阳昆明天津唐山泉州惠州万州新乡商丘台州哈尔滨太原摄影海口随州学校商丘广东湖南广西江西海南广州企业中小企业武汉南山罗湖福田虎门肇庆汕尾汕头广州佛山成都杭州济南重庆福州西安厦门昆山沈阳青岛徐州郑州南京南宁长沙大连淄博石家庄南昌温州珠海番禺顺德三水高明中山东莞合肥江门嘉兴西宁大良容桂伦教勒流陈村均安杏坛龙江乐从北滘祖庙石湾南庄等地区企业网站建设(广告)公司提供专业做网站价格规划书及营销型网站制作,网站建设基础知识

网站建设费用

网站制作电话:137 1543 1176

网站开发QQ:378780108

E-mailsale@fslingdu.com如何制作网站QQ :378780108

网站建设服务

网站建设公司零度飞易是一家专业网站设计,网站制作、seo优化,网站推广,网站建设的佛山网络运营公司。零度飞易在家具网站建设小家电网站建设服装网站建设电器网站建设机械网站建设等行业的网站设计、网络运营都得到行业认可,在上海深圳北京广州佛山中山东莞地区有着良好的口碑品牌的网站建设公司。我们的使命是打造创新型的网站建设企业,能轻易地开展“互联网+”业务、实现“互联网+企业”的企业愿景。

Hi,Are you ready?

准备好开始了吗?
那就与我们取得联系吧

有一个互联网项目想和我们谈谈吗?您可以填写右边的表格,让我们了解您的项目需求,这是一个良好的开始,我们将会尽快与你取得联系。当然也欢迎您给我们写信或是打电话,让我们听到你的声音!

零度飞易 互联网整合营销

地址:佛山市顺德区大良凤翔商业广场二座670

业务QQ:378780108

策划专线:13715431176

E-mail:sale@fslingdu.com

合作意向表

您需要的服务

现有网站改版
我需要做微信营销
建设全新的企业网站
要找长期合作公司,需要年度服务
我需要做购物商城
我需要做系统平台

您最关注的地方

对功能要求比较高
对设计创意要求比较高
需要可以购物支付
搜索引擎排名

价格预算

1-3万3-5万5-8万8-10万10万以上大型项目需要招标