iOS图标设计9个秘诀

  • 经验类型经验/观点原作者:原作者

  • 经验属性原创文章
  • 经验版权署名-相同方式共享
55656 13 170 2014-11-17

iOS图标设计原则及方法,非官方版更实用。

每一个应用程序都需要一个美丽的,令人难忘的在App Store中和手机的主屏幕上突出的图标。

1 易识别

一般情况下,避免使用一个有2种含义的图形元素或着费解的一面。例如,邮件程序图标使用一个信封,而不是农村的邮箱,一个邮包,或邮局的象征。 

2 保持简洁

保持简洁,尤其要避免添加过多的图形元素到你的图标。寻找一个表达你应用程序的本质的表达简单、造型独特的1个元素,并谨慎添加细节。如果图标的内容或形状过于复杂,细节就会变得更加复杂,并且在更小的尺寸可能会很模糊。iOS的自带应用程序图标都很简洁,就算设置中的小尺寸依然清晰可见。

3 抽象化

创建你的应用程序的主要思想的抽象解释。避免使用照片或截图作为应用程序图标,因为照片的细节在很小的尺寸是看不到的。通常情况下,最好以艺术的方式来解释现实, 因为这样做可以让你强调这个问题,你希望用户注意的方面。 

4 专注于一个独特的形状

最好的应用程序图标都是独一无二的,整洁,有魅力,令人难忘。有的有很多颜色或功能梯度,但这些图标的中央设计元素应该是一个醒目的形状,你马上识别。 

5 避免使用大量文字

如果你可以逃脱使用任何文本,那么它可能是最好的办法。尝试使用只是一个符号或标识的应用程序图标。这个伟大的例子包括Ness , Pocket and Pinterest。 

6 谨慎使用颜色

在一般情况下,最好只使用1~2种主色调。虽然你可以做很多漂亮的颜色,但很难决定。

7 超椭圆

图标的圆角不再是准确的半径值,iOS 7以后的应用程序图标都使用超椭圆的形状。虽然App Store提交不需要圆角裁剪,只需 apple  官方会进行处理。由于苹果没有公布形状的官方模板,你将不得不使用一个非官方的模板,因为你要在其他地方很有可能要用到裁决后的超椭圆的图标。 

8 网格系统

苹果开发出黄金比例的网格系统(文章附件提供下载),它可用于尺寸和正确地对准上的图标元件。苹果多数图标的按照网格系统进行规范话设计,也为设计师们提供了方向。当然你也可以随意打破规则,如果你的图标不采取新的网格系统的情况下看起来依然很不错。 

9 重新设计为iOS

该应用程序的图标是你的应用程序的品牌的重要组成部分。如果你已经有pc端的产品图标存在,建议你重新设计为iOS。你可以在原来图标的基础上适当的提取图形和配色元素加以简化进行设计。

浅草域整理,转载注明出处。

参考资料:《iOS人机界面指南》、“six tips from apple on how to create better-app-icons”、“how to design beautiful ios app icons,according to apple”、“the iOS design guidelines-ivomynttinen”。

全部评论:13

  • lmein

    2017-04-14 09:40

    http://pan.baidu.com/s/1qWjWpwo

  • 春花花Neptune

    2017-03-22 18:01

    大神链接能再发一遍吗?

  • 莱奥纳丶东

    2017-02-06 14:45

    赞, 链接 能再发一遍吗

  • 段希奇

    2016-06-23 14:32

    @浅草域: 是的 视觉上的优化很重要

  • 浅草域

    2016-03-09 16:30

    @段希奇: 参考线给出来的是黄金比例线,也只是参考;不同尺寸下要进行优化,还是要对齐到像素。

  • 段希奇

    2016-03-07 16:44

    @屋顶上的游骑兵: 以64px为一个单位,即a=64px。那么大正方形的边长的一半=8a,大圆半径=7a,中圆半径=4.25a,小圆半径=3a。 引用自知乎“pido,交互设计”在“如何评价 iOS 7 图标的新栅格系统(grid system),好在哪里? ”中的回答,大家自行脑补一下。。。

  • 屋顶上的游骑兵

    2016-02-02 16:32

    链接失效了,跪求新链接

  • 何家公鸡何家猜何家母鸡唂唂唂

    2015-06-19 09:12

    链接失效。。。

  • Pieces

    2015-01-11 21:06

    啊啊啊啊啊 附件链接失效了 = =

  • SWANdesign

    2014-11-19 22:30

    收下

  • 宋小牛

    2014-11-18 15:22

    很不错

  • nothing_ash

    2014-11-18 12:05

    翻译是google翻译直接翻的么?语句竟然这么敷衍且不通顺。

  • 临星lx

    2014-11-18 11:03

    感谢分享,有所帮助

更多作品

发表评论

取消

点击右上角
分享给朋友吧

分享到

取消

每人每天仅限5票,快给你心仪的作品鼓励的一票。

投票