Instagram网页版图标更新信息流设计图

1、  但凡是 Instagram 的用户,昨天肯定都看到了 Instagram 更新后的新版图标,三年之后,Instagram 终于放弃了拟物化的图标,换上了迎合时代审美的扁平化图标。不过,大家似乎一致对新图标的大渐变色颇有微词,一时间国内外一片吐槽,重新点燃了社区中「我为 Instagram 设计新图标」的运动。

QQ截图20160719174839

2、  但凡是 Instagram 的用户,昨天肯定都看到了 Instagram 更新后的新版图标,三年之后,Instagram 终于放弃了拟物化的图标,换上了迎合时代审美的扁平化图标。不过,大家似乎一致对新图标的大渐变色颇有微词,一时间国内外一片吐槽,重新点燃了社区中「我为 Instagram 设计新图标」的运动。

3、  于是,Instagram 的设计总监 Ian Spalter 不得不站出来,揭密 Instagram 新版图标背后的故事,标题也取得非常巧妙,叫做「Designing a New Look for Instagram, Inspired by the Community」,我觉得全文最出彩的地方就是标题这里的「Inspired by the Community」,一下子给 Community 背了好大一个锅。

4、  甚至,Instagram 之前这款经典图标的设计师 Cole Rise 也出来为 Instagram 背书,关于新版图标,他是如此评价的:

5、  I love the minimalism. Regardless of the colors behind it, the white shape — the actual bones of the new symbol itself — is beautiful, and I think that can persist over time.

6、  这段话中最大的亮点莫过于「Regardless of the colors behind it」,这潜台词是不是 Cole Rise 本人对背景色也同样持有保留意见呢。

7、  今天,我们就图标与 Logo 展开,谈一谈到底怎样才算得上一个好的图标。

8、  好图标不一定是好看的图标

9、  我非常想先强调这一点,「好图标」和「好看的图标」之间,有时候没有必然的关系。图标甚至在很多时候,是不具有审美意义的,这也是为什么我们有时候会说,设计本身并不是一种艺术。一个好的图标,好看可能只占着非常小的考量因素,那么评价一款图标最重要的标准是什么呢?我个人觉得是辨识度。

10、              想当年,iOS 7 刚推出时,同样是骂声一片,但渐渐的,你只要给主流人群足够时间,他们会自然地习惯,这种习惯背后深层的原因是,对风格和设计语言的接受。但是图标会更艰难一些,毕竟在那么小的尺寸上,设计师很难系统性地展现出成体系的风格和设计语言,这对图标的设计其实提出了更大的挑战。

11、              拿起你的手机,看一看桌面上的那些各有特色的图标,谁不希望能给你留下深刻的印象,在众多图标中脱颖而出,让你能够注意到。其实如果你仔细观察,你会发现当下的图标无非分为这么几类:

12、              强调线条和形状:例如 Airbnb、Keep、即刻、雪球、Uber 等等,无不是从这个角度出发,以一种特定的几何线条,来建立起自己的品牌辨识度。即使回到现实生活中,这样的例子也比比皆是,比如像运动鞋品牌,人人眼前都会浮现出 Nike 的勾。但是,随着消费主义的盛行,越来越多的品牌开始入侵我们的生活,想要建立起一套独立且有区分度的几何形状,已经变得越来越难。于是你看到有些 App,没错我说的就是支付宝、豆瓣、知乎之类的 App,直接简单粗暴地用中文字作为图标的主体元素。

13、              使用意象和标志物:几何形状虽然简单,但的确很难建立良好的区分度,于是你看到另一类 App 走了另一条路,使用具体的意象和标志物。换一种说法,你可以认为拟物设计的时代,包括 Instagram 的经典老版图标,都是采用这种方式:即通过对现实或已经存在事物的映射,建立起自己的品牌标识,最经典的例子莫过于 QQ,小企鹅的形象已经深入人心。

14、              建立品牌色彩:色彩有时候是和前两者共同运用的,比如 Airbnb 粉、知乎蓝、微信绿等等,这些色彩都已经深入人心。不要小看色彩的力量,有些时候仅仅只通过色彩,你也可以建立起对品牌的感知效应。比如我仅仅把这四种颜色排列在一起,我打赌你已经想到了 Google。Instagram 这次的新图标,从某种程度上来说,也是希望通过几何线条 + 大胆的色彩运用,来给人留下深刻的印象。唯一失算之处应该在于,国内的美拍、潮自拍等应用图标的颜色,也如出一门。

15、              随着扁平化设计语言的流行,越来越多的图标都开始采用线条形状 + 品牌色彩的方式来设计图标。这带来了一个最直接的挑战,越来越难以形成自己的辨识度。虽然说扁平化和极简主义两者之间并不完全等同,但是,很多人追求一个极简的性冷淡般的图标,这样的期望是不切实际的。辨识度本身是违反极简主义的,一个商业品牌绝不想自己隐藏于无形之中。试想,Macbook 盖上为什么要有苹果 Logo?甚至在 Macbook Pro 等机型上还有背光灯。如果按照「如无必要,勿增实体」的观点来看,这个 Logo 存在,甚至还必须发光的唯一必要性,就是建立起面向消费者的品牌辨识度。

16、              当然,越来越多的公司也开始另辟蹊径地尝试一些其它办法来建立起品牌和 Logo 的辨识度。比较常见的做法,目前主要是加入动效和建立个性化元素的情感绑定。例如,Google 的新版 Logo 在发布时,就为自己的 Logo 加入了动画元素;Uber 的新版图标,不仅仅在应用启动时有非常动感的效果,针对不同的城市,还特意准备了不同的纹路和色彩。遗憾的是,手机桌面上的图标只能是静态的,当然,你也没法想像,要是整个手机桌面上的图标,都一起跳动起来是一种什么样的体验。

17、              当设计师在设计图标时,他们在想什么

18、              当时 Uber 的新图标发布时,同样是一片吐槽,不过,设计师真的会在乎用户的意见吗?

19、              这个问题比较容易解答:他们不在乎。前面提到了,好的图标不一定是好看的图标,这一点作为设计师肯定深有体会。事实上,几乎每一次品牌升级和图标更新,肯定都会受到现有用户的反对和吐槽,这一点都不奇怪,人本身对旧有的既定事物就抱有一定的依赖感,而在你看到这个全新的设计之前,设计师可能已经经历了无数稿的重绘,天天对着新图标,他们已经习惯了,甚至看吐了,于是他们坚定地认为,假以时日,你一定也会习惯的。

20、              此外,令我印象非常深刻的事情:Uber 的新版图标共有 55 位设计师的参与,虽然不知道 Instagram 的新图标是多少设计师的结晶,但是一个小小的图标,真的需要这么多的设计师吗?

21、              很多人会天真地以为:你看那些设计师写的博客里面,各种背后的故事,讲述他们是如何将文化理念融入进自己的图标当中的,这种工作肯定很烧脑吧。事实上,一个小小的图标,怎么可能包含和传达什么文化或者理念,真没有这么神奇。

22、              那么,他们大部分的时间在干什么?这两张图能很好地说明。除了一稿一稿地重绘方案外,当确立了一个主要方向后,他们大部分的时间,都在确保图标和 Logo 的全平台辨识度。

23、              没错,这些 Logo 和图标不仅仅只是停留在你的手机桌面上,他们还可能出现在网页上、海报上、实体店里、包装盒上等等地方,它们会需要适应不同的大小和尺寸,适应不同的屏幕色彩和分辨率,适应不同的周边物体和色彩风格,适应各种实体物料的印刷和制作……如果不是设计师出身,你可能没有注意到:一个 1028*1028 大小的图标,并不只是简单缩小一点,就能变成一个 80*80 的图标,当少了那么多像素后,图标上的许多细节和纹理都需要重新处理。

24、              图片来自 PingWest

25、              像 Uber 的这四个字母,你可能觉得平淡无奇,但是想像一下,如果 iPhone 包装盒上的 iPhone 字样中的「i」,如果只是随便使用了 Arial 字体,那它就不会是现在这样的小圆点,而会是一个小方块,你能感受到这么细微的不同,却能带来如此巨大的感官差异吗?

26、              为什么说 Instagram 的新图标是合理的设计

27、              回到 Instagram 的新图标,如果一定要我给出一个评价,那么它是一个达标的,并且合理的设计。所谓达标,通过这样的线条和色彩组合,的确保留了较高的辨识度。而合理则是一个更有趣的话题,试想一下,如果你是 Instagram 新版图标的设计者,你会何从下手?

28、              首先,Instagram 经典图标是一个相机,相机的元素不能丢吧?按照常用的手法,要不就是把现有的图标直接拍扁,这是最省力也最偷懒的做法;要不就是把相机给高度抽象化,通过线条的形式表达出来。

29、              从 Instagram 公布的设计视频来看,显然他们有考虑过第一种方案,但是我相信任何有追求的设计师,都会自我否决这种没有想像力的方案。

30、              而如果从线条入手,相机的线条,不仅仅是 Instagram 这样的图片社区,许多摄像类的 App 同样也都是相机的抽象。想必希望仅仅通过线条的运用来创造一个独特的辨识度,是一件不可能完成的任务,这时候唯一理性的做法,就是搭配上色彩的运用:于是 Instagram 最后给出了如此大胆的渐变色方案。

31、              至于一小部分用户吐槽新版图标和应用内的界面改版风格脱节,这个指责真的是无理取闹了。Ian Spalter 在博文中,对这一点还是有非常直接的回应:

32、              While the icon is a colorful doorway into the Instagram app, once inside the app, we believe the color should come directly from the community’s photos and videos. We stripped the color and noise from surfaces where people’s content should take center stage, and boosted color on other surfaces like sign up flows and home screens.

33、              作为一个图片分享社区,自然在 App 内应该尽可能地让应用本身趋向于无形,将用户的注意力全部集中在社区中的图片上,不然还指望 Instagram 在各处都抹上那抹粉红渐变不成?

34、              当然,回到图标本身,说它是一个合理的设计,同时也意味着,这是一个 think inside the box 的设计,如果它想成为一个大胆革新的设计,从第一步就应该抛弃相机这样的核心元素,才能够真正有发挥的余地和空间。

35、              评价一个图标和 Logo,最有效的方法就是时间,像可口可乐的 Logo 经久不衰,而 Instagram 官方也提到,他们在设计这版新图标之初,就不想要今天的方案,当一年过后回过去看时,又觉得需要再一次更新图标。

36、              那么,你觉得 Instagram 的新图标,能坚持多久?

37、              幸好smartisan os有重绘图标

38、              05-14 15:141

39、              呵呵你逗我

40、              google的logo不得不说很独特,每次的涂鸦和那几个经典的颜色都能联想到Google

41、              05-14 13:111

42、              沉睡昨天的梦

43、              真心不如之前的

44、              05-14 11:553

45、              Catalyst

46、              UBER新图标刚出来简直无法接受,现在每次打开UBER,那个动画,很享受

47、              05-14 10:123

48、              志豪Bruce

49、              新标志好像滚筒洗衣机

50、              05-13 19:562

51、              蕭cross

52、              真是有点够了

53、              早在去年 11 月,Instagram就对外宣布将关闭其信息流 API,由于信息流是用户使用 Instagram 的重要部分,这一改动导致所有第三方 Instagram 客户端均缺失了最核心的部分。官方给予开发者半年的「缓冲期」,今天(6 月 1 日)就是这一改动的最终期限,也就是说自今天起,此前使用第三方 Instagram 客户端浏览信息流的用户,将无法再正常使用了。

54、              也许有人会认为,Instagram 这么做是为了迫使用户回到官方平台上浏览照片,从而增加广告收入。Instagram 现在对于创收非常认真。但和 Twitter 关闭第三方客户端时不同,Instagram 的第三方客户端并不怎么受欢迎。Instagram 表示目前 Instagram 的月活跃用户数为 4 亿,而最流行的 Instagram 第三方客户端只有不到 200 万用户。关闭这些第三方客服端并不会给 Instagram 增加多少广告收入。

55、              Instagram 官方称,这将“围绕 Instagram 的真实体验,为 Instagram 允许范围内的开发者创建更具可持续性的环境”。糟糕的应用不会让用户流失,但会分流好应用的用户。另外,Instagram 将有更多精力去优化其仍然提供的 API.

56、              为了让测试过程变得更容易,Instagram 还将推出一个新的开发测试沙盒,开发者可以在这个沙盒中测试所有 API, 并添加最多十名测试用户。

57、              随着 Instagram 的进化,它必须在继续开放和专注于自身平台上做出选择。忽略第三方应用可以让 Instagram 加速创新,比如 Instagram 最近推出了趋势和地点搜索,改进了私信功能。

58、              虽然这些变动会影响 Instagram 在开发者心目中的形象,但这却可以让 Instagram 更好地适应快速变化的视觉通讯领域。有利又有弊,辩证地看待吧。

 

59、              和我国没有半毛钱关系

60、              06-01 21:557

61、              鬼人家族族长–Ghost-People

62、              新图标也还好吧,正因为这样才有很多人创作它们。。今天看见一对小乌龟壳就是新旧图标。。萌翻了

63、              06-02 00:306

64、              leung_yeauwing

65、              可是中国还是不可以用啊

66、              06-02 21:020

67、              Scott77298447

68、              关了你又不出iPad 版,让ipad怎么用

69、              06-02 01:454

70、              太阳微风

71、              试用了,感觉没什么特色

72、              06-02 00:230

73、              森林哥_

74、              除了被墙了和新版图标 其它不予议论

75、              06-02 00:102

76、              Kunlun_Z

77、              新版挺漂亮的,除了图标

78、              06-01 23:57