如何为Android上的产品设计一款合适的图标

迷南。 2022-08-12 10:29 110阅读 0赞

[![f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg][]][f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg 1]

如果你已经完成了你的app，你一定会马上向其它人宣布这件事情。但是你需要注意一个很重要的问题，那就是app的图标。你的图标可能在项目启动之 前就已经设计好了，但我不喜欢这样，如果app没有完成实际上图标也没什么用了。如果你不是一个设计师，图标的确是很让人头疼的事情。

但总有一些方式可以让工程师们也能独立的设计出不错的图标。我们以Andriod应用为例，现在就来为你的产品设计一款合适的图标。

## 准备 ##

在设计之前，你应该看看[iconography reference guides][]，这是Android开发者官网上一篇关于图标设计的教程。

> *提示：这个链接中的设计是Android 4.4 Kitat的风格。如果你想设计Android L风格那就不能完全指望它了。*
> 
> 谷歌在2014年6月26日的I/O 2014开发者大会上正式推出了Android L，可以说是Android系统自2008年问世以来变化最大的升级。

[![0cc7f4ae-6f65-4344-8166-35e38e9bf6ea.jpg][]][0cc7f4ae-6f65-4344-8166-35e38e9bf6ea.jpg 1]

Android L 会生成和KitKat不同风格的图标， Material Design简化了设计，主打干净排版和简单布局的设计风格，同时融入了丰富的色彩，具有更强的指向性。另外，它还支持多种设备，如手机、平板、电脑、电视等等，几乎涵盖了整个Android产品线，具有高度统一性。

[![21db1c5f-acee-460e-84c8-b2812ea7cfc7.jpg][]][21db1c5f-acee-460e-84c8-b2812ea7cfc7.jpg 1]

让我们根据这Android L的风格来创建一个图标。

## 创建一个图标 ##

这时假设我们已经有了一个大概的图标模型，在这里我决定使用一个比较特别的图标，我在开源库中找到了Open labs的图标，就像下图一样，我打算在它的基础上做出Android L的风格。

[![a9716d67-ba4e-4828-88b1-993c82602677.jpg][]][a9716d67-ba4e-4828-88b1-993c82602677.jpg 1]

我们不需要这些文本，把图标扣出来就行了。然后要做的就是选择颜色，颜色的选择也有很多讲究，色彩太多可能会造成混乱，我们必须照顾任何大小时的图标，大家应该都知道，最麻烦的是标签卡上的小图标。

[![f1439565-aeaf-4a3b-933d-f85d4dfa8ae1.jpg][]][f1439565-aeaf-4a3b-933d-f85d4dfa8ae1.jpg 1]

我们通过空间和色彩来改变它，我们会在各个情况中使用图标，所以它也应该有几种细节上不太相同的图标，比如在通知栏中显示图标的时候，有边框就不太合适，这里下图第一个图标将会是很好的选择。

我们还可能需要圆边和填充的方边框，可以通过阴影来来增强效果，操作上就是把一定范围的区域颜色加深。

经过简单的处理，图标变成这样：

[![075a9760-398d-47b9-8fda-cdd5ca2e23b8.jpg][]][075a9760-398d-47b9-8fda-cdd5ca2e23b8.jpg 1]

像你看到的一样，你可以在不同的地方选择合适的图标，它们看上去很有立体感。

最后可以保存成512\*512的PNG格式（Android中可用的最大图标分辨率）。通过一些第三方工具可以保存为各个大小的版本即可。

[![f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg][]][f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg 1]

你也可以通过Android版本的Eclipse来直接自动在资源文件夹中生成大小不同的图标。

# 如何实践? 使用Material？ #

不得不说，我们还需要等待几个月才能享受到Material设计和Android L的魅力。但是你可以提前准备一下，想一想要为哪个app设计一个Android L风格的图标，最后大概要做成什么样子。

via [如何为Android上的产品设计一款合适的图标 ][Android_]

[f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg
[f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/f5e6b699-4d1b-492a-9f3f-2f694c2942b0.jpg
[iconography reference guides]: http://developer.android.com/design/style/iconography.html
[0cc7f4ae-6f65-4344-8166-35e38e9bf6ea.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/0cc7f4ae-6f65-4344-8166-35e38e9bf6ea.jpg
[0cc7f4ae-6f65-4344-8166-35e38e9bf6ea.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/0cc7f4ae-6f65-4344-8166-35e38e9bf6ea.jpg
[21db1c5f-acee-460e-84c8-b2812ea7cfc7.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/21db1c5f-acee-460e-84c8-b2812ea7cfc7.jpg
[21db1c5f-acee-460e-84c8-b2812ea7cfc7.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/21db1c5f-acee-460e-84c8-b2812ea7cfc7.jpg
[a9716d67-ba4e-4828-88b1-993c82602677.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/a9716d67-ba4e-4828-88b1-993c82602677.jpg
[a9716d67-ba4e-4828-88b1-993c82602677.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/a9716d67-ba4e-4828-88b1-993c82602677.jpg
[f1439565-aeaf-4a3b-933d-f85d4dfa8ae1.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/f1439565-aeaf-4a3b-933d-f85d4dfa8ae1.jpg
[f1439565-aeaf-4a3b-933d-f85d4dfa8ae1.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/f1439565-aeaf-4a3b-933d-f85d4dfa8ae1.jpg
[075a9760-398d-47b9-8fda-cdd5ca2e23b8.jpg]: http://www.gbtags.com/gb/networks/uploadimgthumb/075a9760-398d-47b9-8fda-cdd5ca2e23b8.jpg
[075a9760-398d-47b9-8fda-cdd5ca2e23b8.jpg 1]: http://www.gbtags.com/gb/networks/uploadimg/075a9760-398d-47b9-8fda-cdd5ca2e23b8.jpg
[Android_]: http://www.gbtags.com/gb/share/3902.htm