跳到主要内容

如何设计应用程序图标

会心如何构建应用程序在应用程序设计中只有一半的战斗力。如果您的创作在应用商店中不突出,那么它的好坏并不重要;没有人会买它。一个美丽,可识别和令人难忘的应用程序图标可以对应用程序的受欢迎程度和成功产生巨大影响。但是创建那个,用户每次看到你的产品时都会首先与之交互的单一设计可能是一项令人生畏的任务。

那么一个人如何制作一个“好”的应用程序图标呢?那有什么意思?不用担心,我已经提出了一些提示和建议,以帮助回答这些问题,并引导您前往优秀的应用程序图标设计。本教程还附带了一个视频,您也可以在下面找到它。

什么是应用图标?

在开始创建图标时,您需要了解的第一件事是应用程序图标究竟是什么以及它必须执行的工作。应用程序图标是产品的可视锚点。您可以将其视为一小部分品牌,不仅需要看起来有吸引力且脱颖而出,而且理想情况下还可以传达应用程序的核心要素。

这些日子里,“徽标”这个词被粗心地抛出。图标设计和标志设计不是一回事。虽然他们肯定会分享类似品牌的品质,但应用程序图标受到很多不同的限制。

虽然它们肯定具有类似品牌的品质,但应用程序图标与徽标不同

对于设计师来说,这是一个重要的区别:徽标是为信头和广告牌设计的可扩展的矢量品牌。图标通常是基于栅格的输出,可以在方形画布中以特定尺寸和特定上下文中定制。方法,工具,工作以及成功的标准是不同的。

从实际角度来看,当您制作应用程序图标时,您创建的是一组多种尺寸的PNG文件 - 从29 x 29px一直到1024 x 1024px - 需要与您的应用程序捆绑在一起。这套精心设计的设计将用于用户遇到您的应用程序的操作系统的许多环境中 - 包括App Store或Google Play,设置面板,搜索结果和主屏幕。

应用程序图标基本上可以在任何能够生成光栅文件的应用程序中制作,但常见的选择是Photoshop,Illustrator和Sketch。像appicontemplate.com这样的免费工具提供了聪明的PSD模板,可以帮助您快速开始。

现在让我们来看看应用程序图标设计的一些最佳实践。

01.使其可扩展

An app icon needs to retain the legibility across a range of sizes

应用程序图标需要保持各种尺寸的易读性

图标最重要的一个方面是可伸缩性。由于图标将在整个平台的多个位置显示,并且有多种尺寸,因此您的创作保持其易读性和独特性非常重要。它需要在App Store,Retina设备甚至设置面板上看起来都很好。

过于复杂的图标试图将太多的东西塞进画布上,这常常成为可扩展性差的牺牲品。应用程序图标设计概念阶段的很大一部分应该专注于思考任何给定的设计是否优雅地扩展。

  • 在1024 X 1024px画布上工作可能具有欺骗性 - 请确保您在设备上以及多种上下文和尺寸中试用您的设计
  • 拥抱简单并专注于单个物体,最好是一种独特的形状或元素,在缩放时保持其轮廓和质量
  • 确保应用程序图标在各种背景下看起来很好

02.让它识别

应用程序图标就像一首小歌,能够在商店或主屏幕的所有噪音中轻松识别它是伟大的图标设计的关键组成部分。就像一首歌的诗歌需要与听众产生共鸣一样,应用图标的形状,颜色和想法也是如此。设计需要在功能和情感层面上创造记忆和联系感。

您的图标将在数以千计的其他图标中争夺注意力,所有这些图标都具有相同的1024px画布以产生影响并确保与查看器的连接。虽然可扩展性是可识别性的重要组成部分,但新颖性也是如此。寻求这些品质之间的平衡是该学科的关键。

  • 平淡无奇,过于复杂的图标是可识别性的敌人。尝试从图标中删除详细信息,直到概念开始恶化。这是否提高了可识别性?
  • 试试你的设计的几个变化。将它们排成一个网格并尝试浏览它们,看看这些设计的哪些方面引人注目
  • 尝试解构您最喜欢的应用程序图标,找出您喜欢它们的原因以及它们用来突出的方法

03.保持一致

在与应用程序图标交互的体验与其代表的应用程序交互之间创建一致性时,可以说些什么。我觉得好的图标设计是应用程序的全部内容的延伸。确保两者相互支持将创造一个更难忘的遭遇。

在用户的脑海中塑造一个时尚,统一的应用程序图像可以提高产品满意度,保留率和病毒式传播性。简而言之:确保您的图标与应用程序的本质,功能和设计和谐协调是一个巨大的胜利。

  • 确保应用程序和图标之间一致性的一种方法是使界面和图标的调色板保持一致,并使用类似且一致的设计语言 - 绿色界面加强绿色界面,例如
  • 虽然并非总是可行,但是一种加强应用与图标之间联系的方法是将图标的符号直接与应用的功能相关联

04.追求独特性

Icons can be detailed or simplistic, just make sure that they’re creative, interesting and accurately convey your intentions

图标可以是详细的或简单的,只需确保它们具有创造性,有趣并准确地表达您的意图

这几乎不用说了,但试着做出独特的东西。模仿风格或潮流是完全正常的,但要把它变成你自己的。您的应用程序图标会不断与其他图标竞争以吸引用户的注意力,而脱颖而出可能是设计的完美有效参数。独特性是设计中棘手的一部分,因为它不仅依赖于您的技能,还依赖于其他试图解决类似任务的人的选择。

  • 考虑一下其他人在你的空间里做了什么,然后尝试不同的方向。始终做你的研究 - 世界不需要另一个复选标记图标
  • 如果你想保持独特,单色背景上的单一字形可能是一个难以理解的路线。玩弄不同的颜色和成分,并挑战自己寻找新的和聪明的比喻
  • 颜色是重新定位概念的一种伟大且经常被忽视的方式

05.不要用文字

这是我最喜欢的宠物之一。只有在最稀有的场合才能在app图标中使用单词。如果你不得不撤回另一种抽象工具 - 书面文字 - 我会说你没有充分利用你的图画武器库。

单词和图片是单独的表示工具,并且将它们混合在一起应该是图形表示通常会导致混乱和不专心的体验,这更难以解码。是否真的没有更好的方法可视化应用程序而不是干燥的单词?每当我在应用程序图标中看到单词时,我觉得设计师错过了更清楚地传达他们意图的机会。

  • 没有必要在图标中包含应用程序名称 - 它通常伴随着界面中的图标。相反,花时间想出一个很酷的图案概念
  • “但是,Facebook的应用程序图标中有'f',”我听到你说。如果你正在使用一个单数字母,并且你觉得它是一个好的(和独特的)合适的,那么这封信就会失去它的“罗嗦”特质,并成为它的标志性特征。但是,这通常是例外而不是规则
  • 您在广场上的公司徽标和名称绝不是一个好的解决方案。你有一个在约束条件下运作良好的标记或字形吗?如果没有,你可能最好提出一些新的东西。请记住,图标和徽标不一样,不应强制进入相同的上下文

06.让它脱颖而出

在App Store和Google Play上,有很多平淡无味的图标设计。您的图标是您与用户之间最强大的连接。这是他们在App Store遇到你时首先会看到的。这是他们每次使用您的应用时都会与之互动的内容。这是他们想到你的应用时会想到的。

任何缺乏深思熟虑,适合且有吸引力的解决方案的东西都是未能利用您最大的视觉资产。您的应用程序图标不应该是事后的想法,它应该是该过程的一个有效部分。

应用程序图标是集中设计的微小部分,并且在创建它的过程中有一些非常吸引人的东西。无论它们是细节的还是简单的,传统的还是创造性的,这些图标都具有一个统一的特性:它们在相同的有限空间内,在完全公平的竞争环境中抓住人们的注意力。这是一个特定的挑战,答案始终在同一个像素内。

毫无疑问,使用单一的图形设计来表达您的应用程序可能会令人生畏,但我希望我在此概述的技巧将使您更有信心迎接挑战。现在出去做一个梦幻般的应用程序图标!

本文最初发布于net,这是世界上最畅销的网页设计师和开发者杂志。在这里订阅

阅读更多:



翻译字数超限