效果图设计经验分享

时间:2014-09-14
  整合:将几个关键界面整合在一张图上,如上图所示,百度手机浏览器Android版的效果图,将起始页、输入状态、进度条读取、未读取等状态进行了整合。这样做方便需求方根据交互流程图对照,能够对软件有比较整体的感觉。 任何设计都不是孤立存在的,放在一起更能够让需求方明白设计师的整体考虑,尽可能减少一个界面、一个细节效果修饰的近乎完美,但是在整套界面中搭配存在不和谐的情况。也能够让需求方明白你有全局考虑的意识。

  动态效果:越来越多的软件设计从添加动效这个角度提升用户使用感受,动效可以使界面与界面间切换看起来更为衔接和流畅,但是如何能够让需求方或者开发方明白设计师希望表现得动效是怎样的。这个时候如果能够在效果图初稿阶段稍许添加一些,就可以让需求方在第一时间感受到效果,用尽可能少得成本有所体现。如上图所示,某软件的效果图中,就简单展示了拨盘滚动、更多相关信息滚动等效果。当然效果初稿确认后,如果需要更为真实的动效,还需要制作动态 Demo,更为高阶的效果展示暂时不予讨论。

  情景化:正如上面所说,每个设计元素都不是孤立存在的一样,效果图也是可以有思想和生命的。如上图所示,百度手机浏览器Logo设计的效果图,完成这样已经完成第一步了,100%的效果展现+设计思路。

  设计是很感性的,除了专业的理论用以支撑和说服外,如何才能让设计师在设计过程中想要传达和表述的意境,想要带给用户的使用感受最直观的传达……那只完成第一步就远远不够了,这时可以在第一步的基础上,辅助一些情景化的效果图,将设计师心中的想法直观的表现出来。如上图所示,百度手机浏览器的小熊 Logo,他是活的,他可以悲伤、可以快乐、可以蹦跳、甚至可以飞翔……这样做为了能够说明,这个Logo在未来有很好的延展性。

  他不是孤零零的哦!在这个世界上他又自己的朋友!这样做是为了说明,除了日常以标准样式出现外,在特定的节日或者根据特定的人群,他是可以个性化定制的,为后期运营打下了很好的基础。

  作为一款产品的Logo,最终在产品应用上的展现是他的使命。如上图所示,效果图充分展现了Logo在未来使用的各个场景的效果:启动界面、桌面图标、桌面Widget等。一方面能够让设计师在考虑之初,仔细审核设计是否可以应用于各个场景,是否需要根据场景做相应的变形;另一方面,也可以让需求方直观的感受到,设计在未来应用中的实际效果。

  他不仅不是孤零零的,有自己的朋友,他甚至有自己生活的事业,他是一只冲破了第一宇宙速度的熊,他高高在宇宙看着地球上的一切一切……

  通过上述第一步、第二步的工作,需求方能够通过效果图清楚明白在设计过程中都考虑过什么,设计配上、界面布局等等一切都是有理由的,他们能够和设计师感同身受,这个时候推动效果被最终使用的几率就大大增加了,虽然看似多花了时间,但是后期不断调整修改的时间会大大减少。很多时候并不是背后的"神"们有多难搞,而是在思想上没有同步,设计师没有明白需求方要的究竟是什么,需求方也没有最终明白设计师究竟想表达的是什么。

  效果图展现进阶Taps:

  1. 有相互关联的几个关键界面,放在一整张图上面予以一并展示

  2. 涉及到动态交互的,提供简单的动态效果

  3. 设计是感性的,通过情感化的效果图让需求方明白在设计过程中都做了哪些思考……

  在上述Tips的后面,我添加了……,是因为这样还是远远不够的,后续还有更多可以为效果图做的事情。设计作品就像是设计师的孩子,而效果图则是这个孩子第一次接受世界审视的机会,如果你真爱自己的孩子的话,就请好好包装,让效果图不再是冷冰冰,而是可以传达你的思想和感受的载体,给效果图赋予思想和生命吧!

  • 共2页:
  • 上一页
  • 2/2下一篇
    上一篇:手机搜索特性分析 下一篇:网页界面设计中的明暗

    相关文章

    最新文章