产品开发中的视觉设计

添加评论 2009年12月1日 801 次阅读

产品开发中的视觉设计

视觉设计是产品开发过程中的一个重要的环节,也是用户最直接感观的。

个人根据设计的过程做了一个简单的分析。

1.设计前

了解产品:你可能是流水式的下单作业, 也有可能是项目制的作业,但对产品的理解是做好设计的前提。

竞品分析:主要是从交互方式、视觉层面的吸取。平时多看,多积累,动手时脑海里才有活跃的思绪。

2.设计中

对于视觉方面,很多公司都有一套自己的规范来维持风格的一致性,来加深品牌识别度和减少用户的认识成本。所以这里对视觉元素的具体表现不加以阐述,主要是写一下自己工作中的体会。

颜色:根据产品的性质,用户的人群定位, 还有所处整个体系的位置等,来筛选确定颜色的方案。如果页面很跳, 不“和谐”,加点灰色或许会有惊喜的改观。分享几个颜色工具:Color scheme    COLOURlovers  

文字:一般是12px、14px宋体来做正文,黑体,微软雅黑来做标题或需突出的信息。数字时可以考虑用英文字体,比中文的舒服。这时需要考虑留白、层次分明、与图片的混排、还有整齐,这些都有利于阅读,信息的摄取。 

按钮:如果需要突出可以考虑与主色相对应的对比色,设计时需作出鼠标的各种交互效果。 

布局的分割:个人是把它分为色块和带标题栏的线框这两种方式。国内的大部分网站很多是带标题栏的线框模式再在局部加点色块来调和。 

整体:个人是理解为各个视觉元素组合在一起形成的页面后感受。如:清爽、大气、简洁、平淡。在选取视觉呈现形式上都要往整体去靠, 才可以体现出中心的关键词印象。“想法”太多页面就会“三不像” 

把页面做成“动”的:我想设计师不仅仅是做美化的任务,应该在设计时考虑到各种交互状态效果:页面加载、鼠标的操作、Tab、反馈、浮层…所以在高保真效果图的交付物里,应该包括交互状态的页面。 

3.设计后

检查html页面是否还原效果图的原貌;

上线后跟踪用户的反馈,配合相关人员进行修改迭代。

最后推荐两本书:

《写给大家看的设计书》    

《Web视觉设计》

或许会有一些收益

  1. 2009年12月3日 at 21:12 | #1
    匿名

    很不错。

  2. 2009年12月8日 at 17:14 | #2

    不错…向军哥学习…

  3. 2009年12月12日 at 14:05 | #3

    军哥网站开通,淫河人民发来贺电!

  4. 2009年12月15日 at 14:15 | #4
    无华

    很漂亮

  5. 2009年12月21日 at 17:29 | #5

    不错哦,《写给大家看的设计书》我也刚上个月翻完。

  1. 还没有 trackbacks
订阅评论