icon的设计原则有哪些?

风格统一?大错特错

现在很多视觉设计师一味的追求icon的绘制风格,这本没有错,独特的风格可以让icon在界面中脱颖而出,形成记忆点,但如果界面中所有icon都风格统一那将是识别/阅读的大灾难。

设计注意事项

设定目标 弄清楚icon的属性,是产品icon还是功能icon,如果是产品icon,便需要弄清楚是哪个平台,ios还是安卓,再去阅读官方出的开发者文档,根据标准去设计你的icon。



是阅读性的还是提示性的,不同属性的icon在视觉上都会有不一样的设计。以推特为例:

这里的icon既有识别的作用,又是功能按钮,这样就必须考虑它的几种状态(当前、按下、激活)。

这里的icon只是辅助阅读的作用,所以它从颜色、形态上会比文字轻。


icon是用来代替“某”些文字的

为什么要代替文字呢?因为有些文字变成图形后方便识别,甚至可以形成图腾,扫一眼就知道这个icon是什么意思了,但并非所有文字都需要用icon去代替,例如:

人类最原始的造字方法就是象形文字,随着文字的发展,象形文字的局限性越发增长,因为有些抽象的事物是用图形代替不了的,需要通过绘画不断解释它,才能达到意会。随之,中国以象形文字为基础,经过数千年,演变成了汉子,汉子的造字方法有会意、指事、形声、转注、假借。会意,通过组合多种象形来说明其意思,例如上面是小,下面是大,组合起来就是三角形,便是“尖”;指事,在象形的基础上添加指事符号,例如(上、下、刃);形声,通过在一个母体上标声,例如(胫、径、颈、经、陉),就是从母体声符“巠”上来进行标声。转注,两字同一部首、二字声音相近、可以互相解释,如“考”“老”同属“老”部而又可以互训(“考,老也。”“老,考也。”);假借,依照它的声音“假借”一个“同音字”来寄托这个“词”的意义,例如:“长”是长发,借为长久之长。图形界面就如象形文字一样,它会非常出效果,但也会有一些局限性。(图标简史详情可阅读(UI简史二 《图形时代》|UI|教程|邵飞Design - 原创文章 - 站酷 (ZCOOL)

弄清楚icon存在的意义,不同类型icon应该如何应用,不盲目追求视觉上的刺激感而忽略了icon的本质。


素材分享—设计尺寸

你需要主流平台(ios和Android)的图标尺寸,有商城,桌面,设置等不同尺寸,均可在最新版的sketch预设模板中找到。


素材分享—图形识别

给大家几组知名品牌的VI设计手册,其中包括logo定义,视觉设计定义,希望你能从这些资源中汲取图形设计的创作思路。




获取方法

关注微信公众号:rulvbb(如履薄冰)

在公众号内 回复 “设计规范” 即可获取



©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,972评论 25 709
  • 你以为生活不易 却不知 有人已经耗尽力气 你或许奄奄一息 却不知 生活从没多少怜悯 它总是慢慢压下来 发现时 只有...
    舞秋风_7dc9阅读 437评论 0 1
  • 黄金秋里圈黄牛, 稚童无状闹不羞。 抱碗憨笑油如蜜, 晚风吹月树梢头。 (常记得这样一个场景,在秋收时的傍晚,把饭...
    玩笑的熊阅读 259评论 18 4
  • 初入公司不久,就恰逢公司推行迎庆24周年文化周,并开展了为期两天一夜的户外拓展训练,在那短短的两天时间里集中训练,...
    游来已久阅读 266评论 0 0
  • 1. 看到这句话是在朋友圈,室友嚷嚷说“班上有个男生的女朋友过来了,还在朋友圈秀恩爱”,抱着八卦必看的心,打开了朋...
    文长长阅读 6,224评论 17 82