或许你已经熟悉了蓝色的支付宝,粉粉的 Airbnb 以及拥有魔性渐变的 Instagram。许多应用都对图标进行过改版,快速变化的时代让我们早就记不起他们原本的面貌。这篇文章和大家一起回到最初的起点,呆呆地站在镜子前……

第一版 Instagram 图标由 CEO Kevin Systrom 参照 Polaroid OneStep SX-70 相机画出,伴随 Instagram 1.0 版本发布。后来 Systrom 看到工作伙伴 Cole Rise 一个个人项目的 icon,非常适合 Instagram。于是 Systrom 邀请 Cole Rise 制作一款「脱离宝丽来相机形象的图标」,经过微调后进化为最著名的一版图标。

左上角的四色条成为 Instagram 的形象标志。几年后,在各家都匆忙来到扁平化的时候,Instagram 却拖了许久,拿出了疑似 Photoshop 内置渐变的图标,遭到国内外网友的吐槽与戏谑,从病毒传播来讲很是成功。


闭着眼睛都会感觉到陌陌的新图标是和 Instagram 学坏了。虽然说陌陌在我们的印象中和 Tinder 很像,但其官方的定位却一直发生着变化,这次视频社交是陌陌的新方向,也放弃了经营多年的蓝色形象。

最喜欢改图标 App 得主。前段时间 Medium 闷声更新了第三版图标。其图标变化也伴随着网页设计风格的变化。如果从图标上来 Medium 这些年的进程,大概就是:「大家好~ 我变了~ 我又悄悄变回来了。」我仍然喜欢最初那个简简单单的 Medium。

京东已经成功让人们忘记了 360buy.com 这个容易和奇虎以及 XBOX 想到一起去的域名。大概在在淘宝商城成功进化为猫店的时候,京东理所当然的变成了狗店(误)。前段时间京东对他们的吉祥物做出了些许调整,视觉上从一只金属狗变成了塑料狗。图标也随之改动。

倍受美国年轻人欢迎的阅后即焚应用 Snapchat 的图标是一只小幽灵。图标改版后笑脸被去掉,变得诡异了一些。不过这样的设计可能另有企图,比如 Snapchat 中的头像必须是这样的:


几乎所有的播客应用都喜欢用波形图案作为图标。Castro 2 的新图标算是很有传承性。

Uber 内部设计团队功力还是很强的,相比其他网约车应用一直感觉很高端。在这次大型 Rebranding 之后的图标,对于中国用户来说可能有些像钱币。但实际上是来自应用界面中的元素:目的地(方形),用户(圆形),道路(细线)。第二版的图标与司机端的图标也有一些呼应,但最新版则去掉了各种装饰元素以及颜色。


作为收购 Uber 中国的公司,同样经历了一次大型 Rebranding。标志性的橙色的一保留,更名为「滴滴出行」,看来是要搞一些比打车更厉害的事情。

支付宝经历过一次配色上的变化。我倒觉得那一抹橙色也挺好看的。这不重要,重要的是往图标上加红带子的习惯可是很久之前就有的。

变化最大图标得主。最初版本的 Airbnb 直接使用标志中的 a 作为图标,蓝 + 银的配色。新版图标可以说和旧版一点关系都没有,配色,字体,标志全换了一遍。官方用一定篇幅阐释了新图标的寓意,但还是引来一些抄袭的质疑。哈哈,行吧。


没有资料显示 Google 地图图标中的这个地点存在于现实之中。在 Google 新版 LOGO 推出之前,Google 更加喜欢使用小写 g 而不是开头的大写 G 作为小标识。

微信图标和 iOS 内置的通讯应用肯定是亲戚,摆在一起毫无违和感,连成长路线都一样。当然了,某种程度上来讲这也符合微信的产品定位。


QQ 的图标展现了这几年人们的审美变迁:这只企鹅不仅被拍成了纸片,减肥还有一定成果,收起了笑脸。这样一看最初版的 QQ 图标都有些陌生了。

星号与点都是常见隐藏密码的方式,按照官方博文的解释,新图标更有登录的感觉,也更加适合显示在密码输入框的后面。


同样是密码管理应用,1Password 采用更加具象化的钥匙孔作为图标。拟物版图标中的金属环反光效果非常细致。新版本的图标风格大概,并没有完全扁平,而是用完全不透明的形状去描绘反光效果。

这枚图标出自著名设计室 Iconfactory 之手,日历掀起的光影效果绝对对得起 Fantastical 这个名字。而且图标最上方的两个金属环也和界面是统一的。后来的扁平版本也保持了炫酷的翻页特效。

Iconfactory 自己出品的 Twitter 客户端,个人认为是众多蓝鸟图标中画的最好的一个。早期的图标拥有诸多羽毛细节,最新的图标也不是完全拍平,而是质感的改变,更加鲜艳卡通化。


第三方 Twitter 的图标几乎都在这只鸟上做文章。Tweetbot 这只鸟好像是一只喇叭嘴的机械鸟。图标中眼睛的形状来自其制作者 Tapbots 的标志,这家公司出品的所有应用都含有相同的眼睛形状。

当然,我们熟悉的图标不止这些。快速变化的时代,让最初版本的图标资源都很难找。通过这些图标,让我们怀念那个 3.5 寸屏幕,光影细腻的时代。