收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 1537|回复: 0

[ICON] 设计出好的图标要掌握什么技巧原则?

[复制链接]
发表于 2013-9-12 16:04:52 | 显示全部楼层 |阅读模式
本帖最后由 FaceUIshow 于 2013-9-12 16:07 编辑




    如何设计出好的图标?当我们发出这样的疑问时,其实这当中大部分的意思是,如何设计出视觉上漂亮的图标?在图标设计过程中,视觉设计只是其中的一个部分,在不同文化、不同显示载体、不同产品要求的前提下,图标的设计方式是不同的,呈现出来的最中央是也有所不同。
    从另个角度来说,好的图标设计总有它们的共同点,擅于尝试理解如何思考图标设计的要点,并掌握这些原则,图标设计水平将会有一定程度的提高。

    视觉感受精美、细腻、结构合理
    比如采用写实的表现方式,使用了大量生活中可见的元素来表达功能对应的含义。
    在使用写实风格创作图标的过程中,最为重要的就是元素的设计是否符合真实生活中的情况,包括外形(照相机和摄像机要便于区分)、材料(我们几乎不使用玻璃材质的垃圾桶)、角度(看得出图标代表什么,文件夹用侧面表现就比用正面更易理解)、大小比例(笔不能比文件夹还大)、色彩(地球表面没有大面积的红色)等因素。
    如果脱离了这些条件,会导致图标失真,难以辨别,设计中的细腻感也不复存在。用户在使用这类图标的时候,反映出的操作诉求是“这个图标是照相机,我点击后就可以拍照”。

1.jpg


    兼容各种应用尺寸,主体与细节对比合适
    我们如果针对手持设备进行设计,屏幕的大小是一个挑战,而这个挑战仅仅是开始,如果一个界面产品或者网站需要兼容多个平台的话,那么图标的兼容性会是我们第一个要考虑的问题。
   这就是为什么在图标设计的展示稿中,我们经常把各种尺寸都显示出来。无论是否客户要求,我们应该在设计之初就要考虑到图标在不同分辨率下的应用结果。这样做的目的,不仅是为了兼容软件产品的缩放问题,也是检验图标的可用性是否如我们期待的一样。

    风格统一、整体性强
    一套风格统一的图标是进行图标设计的基本原则,整体性强的设计会比零散的设计更有品质,更容易让用户理解。
    特别是针对企业产品等图标设计,统一的概念从VI阶段就已经贯彻,在图标设计中,我们需要引入一些VI的思想来规范它。
    一套设计精良、统一性足够好的图标,不但能够引起品牌的共鸣,甚至可以进一步带动界面部分的设计,以相同的质感、色系、光照效果等技巧统一整个产品的视觉感受。

2.jpg


    传达含义清晰、准确、容易记忆
    面对图标的设计,业界一直有一个标准:“对于其含义的理解,不需要额外的文字说明。”
    在前面提到的原则的基础上,每个图标用简单的元素表达清晰的概念,并和产品本身进行联系的方式,是我们在图标设计中尤其需要注意的。

    有一定的主题文化蕴含其中
    有主题性文化的图标,一般更具备娱乐性和欣赏性。是的,图标设计本身也是有故事性的,在单独的个体中体现出“道具”的概念,更容易引起用户的兴趣。
    类似风格的图标,我们常见于PC游戏、TV游戏、电影网站等娱乐型产品中,独特的风格以及直观的主题文化宣扬是其成功的法宝。
    主题性的设计有时候更多的是对某一种文化,或者某一种现象的致敬,其中会出现大量复现的元素,当然也有你自己钟爱的元素在其中。

3.jpg


    不同的文化背景和社会背景的用户均可理解
    针对重要的文化事件,采用一个重要的社会现象作为图标设计的背景也是一个引起关注的好方法,其中的难度在于事件本身的把握程度。
    特定的文化事件有其特殊性存在,例如奥运会是一个全人类的省事,但是在中国举办却是全新的体验,这其中不但要融入奥林匹克精神,也需要体现东方气韵和中华民族的特点。在不同的文化背景与社会背景中,做到图标设计意义传达的准确,需要将抽象的内容进一步具象化,而这些具象的元素必须简单,容易识别,容易引起联想。


您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-8-15 21:53 , Processed in 0.109098 second(s), 11 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表