图标设计过程中需要注意的问题

文章描述:那么怎么样才能做出一套好的图标?在图标设计过程中需要注意哪些问题?

图标在生活中运用是显而可见的。例如:男女厕所标志和各种交通标志等。在计算机系统或软件方面的应用也是很广泛。例如:程序标识、数据标识、命令选择、模式信号或切换开关、状态指示等。
下面的例子更形象的说明这个问题。


(图片来源:九铭)
外国人A与中国人B,两人在语言上存在差异对文字的认识是不同的,用图标来表示,会缩短语言描述的距离。所以图标更具有快捷传达信息、便于记忆的特性。那么图标被广泛使用的时候,什么样的图标才是好图标呢?好图标从两个角度去认识:辨识度与精致度。
辨识度:图标能够直观的表现要描述的物体。
精致度:在精美的页面或者系统界面上,精致的图标能提升整个页面的最佳视觉。
那么怎么样才能做出一套好的图标?在图标设计过程中需要注意哪些问题
在《图标设计语言》中作者Yegor Gilyov (来源站点Turbo Milk )曾提到 “如果你需要画几个图标,你需要整体考虑这个站点所有图标,然后再开始使用软件绘制。”如果你的icon全都是粗糙模糊的造型或拙劣的渐变色,那么这个icon很失败,不能当作是“风格的问题”来了事。这样的icon不仅仅会毁掉整个页面的美观,更让被描述的文字降低了被查看的欲望,对你的用户来使用或阅读它是一种极大的痛苦。Icon的细节包含对颜色的使用,对造型的创新,对质感的体现。
Icon的设计步骤

我认为icon设计遵循上面的一个规则,在做icon的前提要先构思好整个icon的风格,有了构思可以开始造型设计接着就是上色,然后对整体的icon进行细节修改。
Icon的要点从学会批评别人开始
曾经有人说过:“批评别人的作品比自己制作一个优秀的作品要容易得多。但如果使用系统的方式去批判,这才是个成熟的分析!”那么怎么学会去批判呢?下面来分享一些批判后总结的例子。

(图片来源iconfans)
上面一些图标看起来很像,这让人很难分辨出哪个是哪个。尤其小图标的时候辨识性差了。如果你不注意说明,你会很容易把这些图标混在一起。图标还是要有差异性,在保全风格统一的前提下要有很好的识别性,可以在颜色上或者造型上做差异的改变。

(图片来源:九铭)
图标应该是轻松被识别的,构建它的元素要越少越好。而上面的插画和图形明显的告诉我们图标的相关性不该是复杂的,可以省略掉相同的对象,凸显出重要的信息。

上面图片形象的说明了图标像素边沿化的问题,左边的图标比较模糊不清,右边的比较清晰。

在做icon时很容易出现一些常见的毛边,导致像素过渡化,最后圆角不柔和。
怎么样处理不柔和的圆角?
在由大icon到小icon的过程中你要重视一些细节的处理,对于这个我创了一句口诀:去多稳造型,边沿移到位。
去多稳造型:大icon到小icon的过程是由细节的减少开始变化,大icon比较注重质感和光泽等,小icon除了保证质感还要清晰可见。在做16像素icon时可以减少一些必要的元素用像素点去代替,去掉多余的阴影与高光。
边沿移到位:小icon的边缘移位主要靠移动像素点来实现,或者增加像素点。

经过处理,上面的图标已经没有了原来的锯齿,有的是柔和的圆角。
当然每个设计师做icon的习惯都是不一样的,这只是我做icon时的一些心得。

时间: 2024-10-29 09:37:40

图标设计过程中需要注意的问题的相关文章

交互设计经验:设计过程中存在太多的矛盾

文章描述:交互设计经验:设计过程中存在太多的矛盾. 在产品团队中经常听到有人表态:"我们要做简洁的用户界面",同时又有另外一种声音传来:"我们要做功能强大的产品".乍一听,简洁意味着用户界面控件精炼,然而少数的交互方式如何表达各类强大的功能?反之,强大意味着功能丰富强劲,必然拥有错综复杂的联系,如何让其界面保持简洁?两者似乎无法共存,这让我突然想到自相矛盾的故事,楚国商人夸耀自己的矛锐利万分,同时自己的盾又坚固无比, "以子之矛,陷子之盾,何如?"

数据库设计过程中一些命名规范

规范|过程|设计|数据|数据库|数据库设计 数据库设计过程中命名规范很是重要,命名规范合理的设计能够省去开发人员很多时间去区别数据库实体. 数据库物理设计包括:表设计,视图设计,存储过程设计,用户自定义函数设计等等. 1.  表设计命名规范:表使用t开头最好能将表根据属性分类并作好编号. 如:编码表可写为tBM001Something  t为表开头,BM为业务类型,001为该类别中的第几个表something是表的名称注释. 2. 视图设计命名规范:视图设计过程中使用v开头,视图命名以制作视图的

网页设计师页面设计过程中也要注意页面性能

一名网页设计师在做具体设计的时候应该考虑的问题有哪些?业务,产品,信息结构,交互,视觉--别忘了还有页面性能.我所崇尚的其实一直都是小作坊似的创业团队协作开发模式,大伙儿能快速沟通,就算设计师没关注到页面性能这一点,前端同学也能迅速提醒他,因为他俩就无时无刻不在一起.而现在在标准项目流程中,大家的沟通成本成倍增加了,除非是与世隔绝的闭关(就算是闭关,前端同学多半也在陪着开发),前端同学很难在页面设计过程中就和设计师沟通页面性能的问题. 页面性能不仅仅是前端同学的问题 页面性能的重要性不再赘述,就

网页设计过程中应该注意的十个问题

1.不要滥用Flash Adobe公司的这项动画技术让互联网变得更为强大,从Nike公司非常夸张的首页动画到众多广告商使用的网页Banner.但是这项技术非常容易被滥用,过多的动画不仅没有实用性而且还会拖慢用户的网页浏览器. 2.不要让广告遮挡了网站内容 的确,广告对网站的生存来说是至关重要的,但研究表明,弹出广告和整页的广告一旦遮挡了网站内容,那它们的效用会大打折扣,同时也会影响读者是否会再来光顾.一个能够根据读者的要求进行伸缩的广告会更合适一些. 3.不要让网页看起来杂乱无章 网页是一个大杂

交互设计过程中如何思考

这两天的状态很好,人在什么都不在乎的情况下越是能完全放空自己.可以从业务.原型中抽离出来,重新审视自己的作品.当然,交互原型不能作为评判一个设计师的标准,它们只是在项目过程中辅助表达设计的产物.最有价值的是,在线稿背后形成一套思考方法,指导你去做设计.之后便是有自己的评判标准,帮助你去衡量设计的优劣.所谓的设计有理有据,大致如此.下面是一些输出,来消灭那些"我觉得-" 1 思考的过程 做一个设计或者重新设计时,应该从哪里开始 首先,从设计目标开始,确定用户最想看到的是什么. 然后,将信

在产品设计过程中描述一个完整的需求场景

编者按]本文作者朱晨,供职腾讯CDC.对于交互设计师而言,描述应用场景是在对产品需求进行分析时最简单直接的阐述方式. 在文中,作者将应用场景描述为需求场景,这种讲法更加形象.因为对场景的描述就是一个分析用户需求的过程,解读这个过程可以更容易的对用户需求做出分解并从中找到吸引用户的关键. 需求场景是一种更接地气的分析和描述用户需求的方法(个人偏爱"需求场景"这个词).它应该拥有这样的结构: "在某某时间(when),某某地点(where),周围出现了某些事物时(with wha

网页设计流程中常见问题

  问题一 .和客户沟通的不够充分,导致设计方向出现偏差. 这个问题是在设计流程中出现最多,也最容易导致客户和设计师产生矛盾的问题.最终的结果是客户觉得怎么修改设计都不能让自己满意,而设计师却不胜其烦,认为客户太难说话,原因其实就出在双方的沟通上. 作为客户来说,很多时候他们对于期望的设计产品脑子里往往只有模糊的概念,只能交代给设计师一个过于粗略的设计方向,甚至有些客户提出"先做一稿出来我再看"的要求.遇到这种情况,设计师要清楚客户自己的设计需求是不明晰的,而作为设计师来说,这时就需要

Android 2.0环境下的图标设计原则

创造一个统一外观,感觉完整的用户界面会增加你的产品附加价值.精炼的图形风格也使用户 觉得用户界面更加专业. 本文档提供了一些信息,帮助你如何在应用界面的不同部分创造图标来匹配Android2.x框架下的普遍风格.遵守这些原则会辅助你为用户创造一个流畅而统一的体验. 为了使你创建图标的工作进行的更加快速,你可以下载Android图标模板包.更多信息请浏览Android图标模板包的使用. Android系统被设计在一系列屏幕尺寸和分辨率不同的设备上运行的.当你为自己的应用设计图标时,必须知道,你的应

《Axure RP8 网站和APP原型制作 从入门到精通》一1.2 典型的设计过程

1.2 典型的设计过程 典型的设计过程和需要付出的努力程度,见图1. 当然,实际的努力程度将取决于每个具体项目的复杂程度和整个团队间沟通协作的效率.不过,图1给我们列出了在每个不同的阶段所需的交付物都有哪些. 我们来进入细节,仔细检查每一步的设计过程.我会解释每个阶段的目标,提供一些有用的提示和常用的技术,并且描述应该在什么时候进入下一个阶段. 1.2.1 研究 设计的第一阶段不是设计,而是询问一系列问题(研究),见图2.这听上去可能会令人惊讶,不过静下来思考两分钟,你会认识到设计之初本该如此.