欢迎访问智唯网络!专业H5响应式营销型网站建设、百度seo优化、网络推广服务!
营销之道 干货分享
了解企业新动态,分享前沿的营销推广干货,成长路上,我们携手同行
网站设计News

一款APP设计的从0到1:视觉还原篇

发布时间:2017:11:16 21:06:39 | 已阅: | 作者:智唯小编 | 来源:智唯网络 | 共 0 条评论

扫一扫
手机访问

本文共有1336个文字,预计阅读时间4分钟
导语
《一款APP设计的从0到1》这是一篇系列文章干货,上次U妹讲的是关于切图标注篇,今天U妹来说一下,视觉还原。

  《一款APP设计的从0到1》这是一篇系列文章干货,上次U妹讲的是关于切图标注篇,今天U妹来说一下,视觉还原。

  

一款APP设计的从0到1:视觉还原篇

 

  这次U妹接着上次的茬继续,继续之前先来看看整个目录(满满的干货)

推荐阅读:你的app中也潜藏着这些冲突吗?

  U妹列了一个小小的目录:

  一、项目立项(点击查看)

  二、项目预估时间(点击查看)

  三、界面设计

  四、切图标注

  五、视觉还原

  六、上线准备

  一款完整的APP,经过这样的一个流程:项目立项启动→设计产品原型→设计效果图→进入开发阶段→开发成功后进入测试阶段→测试将问题反馈给开发人员进行调试→多次测试确认没有bug→提交市场、正式上线。

  我们都知道,无论设计师的标注稿多精确,开发出来的产品,多多少少都会有误差,专业来说就是视觉效果落地还原度,视觉还原度越高,与设计稿越接近,,APP就越精细;反之,就越差。

  所以,就需要我们在这个时候,去配合开发对UI进行调整,来更加的接近我们做的效果图了(简单了说,就是给开发挑毛病,指出和效果图不一致的地方,是不是很开心哈)

  差1px,我也要挑出来(像素眼就是这样炼成的)

  一、设计师如何做视觉还原?

  1. 设计视觉调整文档

  团队较大,建议设计一份视觉调整文章,这样对整个开发进度和效率都是比较高的,因为团队人数多,你不可能跑到iOS开发哥哥那里说一次要调整的地方,然后再去跟Android哥哥再说一次,你有时间,人家不一定有时间,所以设计视觉调整优化文档是很有必要的。

  

一款APP设计的从0到1:视觉还原篇

 

  视觉调整优化文档,要一目了然,需要注明和效果图不一样的地方是哪里,应该改成什么样,是iOS调整、Android调整还是h5调整等,输出为png和jpg图片格式,最好输出为PDF格式,开发看起来也方便,比如你写了一个颜色值,开发就可以直接复制了。

  

一款APP设计的从0到1:视觉还原篇

 

  2. 带上你的板凳,过去和开发一起调UI

  这种方法很适合3-4人的小团队,亲自上阵,口述问题,效率也是比较高的,你需要备好你的效果图和开发后的雏形,有对比才有伤害(有图有真相,不一样的地方就得让开发改)

  二、如何让效果图高还原度落地?

  1、规范的视觉界面设计

  必须按照各平台的UI设计规范去规范的设计界面,用设计规范去知道开发,才是提高视觉还原的的基本前提。

  

一款APP设计的从0到1:视觉还原篇

 

  2、视觉UI控件的规范输出

  在绝大多数的情况下,为了赶项目进度,都是界面先行,设计规范后出,所以要竟可能的保持界面设计和规范是同步进行。

  

一款APP设计的从0到1:视觉还原篇

 

  以u妹目前的项目经验,可以先输出基础控件元素规范,包括(颜色、文字、图标、蒙板、投影、按钮、输入框、或个别控件),规范是一个庞大而繁琐,极需耐心的工作;过程中注重每一个细节的精准与合理性。

  3、规范的切图与精确的标注

  我们的切图和标注,是否规范和精确,直接影响视觉效果的还原度,所以切图和标注一定要做的细致,这样更加有利于提升还原度

  

一款APP设计的从0到1:视觉还原篇

 

  4、多和开发沟通交流

  U妹一直说的一句话:沟通是解决问题的最有效方法,所以多和开发哥哥接触沟通交流,如果有条件允许的话,请与开发坐一起;遇到问题及时面对面协商解决、达成共识、修改、敲定、解决。

  关于视觉还原篇就说到这里,U妹这里说的只是一种工作方法,好的工作方法才能自己事半功倍,在具体工作中也要灵活拥有,一定要多和开发沟通交流,良好的沟通才是解决问题的唯一方法,有疑问题也可给U妹留言,我们下期再见!

  作者:U妹,一个不要命的UI设计师,等你,来撩妹哟

  来源:微信公众号“UI妹儿”(ID:Ifaner)

  本文由 @U妹 授权发布,未经作者许可,禁止转载。

  题图来自 Pexels,基于 CC0 协议

如何建站:
建网站需要准备哪些资料 如何购买域名空间 协助备案 成功案例 真实见证 建站类型有哪些 收费标准 建站流程 制作周期 改版美化 提升有户体验 [建站必看]源码内容交付 联系客服 专业建站

看了这篇文章的人还看了

专业建站 免费排名(有什么疑问的请留言或咨询在线客服)
  • 全部评论(0
    还没有评论,快来抢沙发吧!

上一篇:实战案例!人气APP 最右4.0 全新UI 升级背后的设计思路

下一篇:电商开放平台产品设计(3):供应商开放平台

  • 18900 文章总数
  • 2374237访问次数
  • 建站天数
  • 专业建站优化Jimmy Zhu
    男,从事互联网服务行业10年,专业建站优化,快速建站上排名。欢迎中小型企业朋友一起来交流!!
    相关专题
    • 网站建设咨询
    • 同行价格

      统一报价,无隐形消费

    • 金牌服务

      一对一专属顾问,7*24小时金牌服务

    • 售后无忧

      完善售后,客服经理全程跟进

    建站优化二维码
    建站优化二维码

    截屏,微信识别二维码

    微信号:13825575516

    (点击微信号复制,添加好友)

    优化二维码打开微信