开云体育-克罗地亚国家队与瑞典队大战甲乙，胜负难分

　　Icon设计到底属于UI还是Branding？

　　Michael Flarup是一位多年从事Icons设计克罗地亚国家队与瑞典队大战甲乙，胜负难分的优秀设计师，从精美克罗地亚国家队与瑞典队大战甲乙，胜负难分的高度细节的Icon到简洁的符号化的Icon，克罗地亚国家队与瑞典队大战甲乙，胜负难分他的设计涵盖了多种风格横款软硬件产品领域，在2015年10月他做了一次关于他热爱的Icons设计的分享，Miki酱听译整理，有不准确的地方欢迎指正。

　　

　　译文：

　　Hi~克罗地亚国家队与瑞典队大战甲乙，胜负难分我叫麦克，29岁，首先做一下自我介绍，以便大家了解我和我每天都在做什么。很多人问我是什么Title，在做些什么。

　　首先呢，我是一个设计师，我喜欢使事物变得美观漂亮，我做了各式各样的设计项目，并且我有一个个人的工作室叫做 Pixel Restored，这是我一个自由职业的部分，在这个工作室我接受了来自世界各地的客户，使我可以参与一些很棒的项目，不过这里我不多谈它。

　　

　　

　　这几年，我们共同创立了一家公司，叫做 Robocat，这个也是很难解释我们在做什么的公司。以前我们为软件服务，现在我们也做硬件，和许许多多的不同的事情，总的来说：我们是在构建产品。

　　

　　当我是小孩的时候，老师经常说我“别画画了，注意看黑板！你得专注在你的数学上面，画画可不会有什么出息！”这些年我做了很多很多Icons，这个是对我很有价值的一个icon，也是Robocat发布的第一个icon：Outside，我们为此工作了8个月，在2008年的圣诞节发布了它，获得了3万的付费用户。

　　

　　很明显，这是一个天气的Icon，这个App今天已经有了近400万的用户。

　　

　　我想说设计Icon是很有趣的，多我来说这是项目中最吸引人的一个部分。

　　还有一些简洁的Icon像是这个，所以你要小心得注意每一个形状，每一个颜色，每一个渐变，简洁和每一个细节

　　有些Icon很精美细致，有些很简洁，所有的设计都集中在这一小片有限的画布上，有些很经典，有的很诡异，但是他都具有这种神奇的属性。

　　Icons利用图形来引起用户的注意，相同有限的空间，就像是一场把握用户注意力的竞赛。

　　我真的很喜欢设计Icons，这是一个非常精彩的设计分支，你要传达一个想法和创意，同时也会受到画布的局限和约束，在有限的像素中进行挑战。

　　

　　我想我现在已经设计了上千个Icons，大部分来自于这两个工作室，也有一部分是为了好玩。作为设计师需要尝试各种各样的事情，即使是有点蠢的。

　　

　　我也不是整天都坐在那里设计Icons，我认为比较难的一点是设计Icons而不参与界面设计的情况，所以我也会做一些界面的设计工作。

　　下面是我大概的精力的主要三个部分，很明显大部分精力是放在我的个人生活方面，Robocat也是一个重要的部分，因为我们有一个工作室，有时候需要我呆在那边，还有一些雇员要负责，我有时也做自由职业，比较大的一部分是其他，比如我的女朋友就在这个部分。

　　

　　那么关于我自己的介绍的部分就到这里，我们下面进入正题：

　　

　　

　　什么是Icon？

　　一个事物被符号或者其他东西所代表。

　　这样的定义太抽象了，我们将从一些例子开始讲起；

　　

　　这代表了厕所，我们都同意，对吧，

　　但是并没有一个便池在这个图相中，那么我们如何知道这代表了厕所呢？

　　假想你这辈子从来没见过别的Icon，你是一个来自亚马逊雨林的野人，你还会认为这是一个厕所么？

　　

　　不，你肯定不会，这个图像表示的只是一个男人和女性的图形，厕所的概念是你从常理中习得的，这里代表厕所是一个抽象的概念。图像没有明确的告诉你有一个厕所在这儿，但是你能够理解这个意义，是通过日常的使用

　　这种方式我们叫做 Idegram（表意符号）

　　它指的是，你通过常规的经验能够认识和理解一个抽象的概念。

　　再来看另外这个

　　这个不太常见，只是在某些地点才会出现的标识，有人能够认识他吗?

　　（下面观众：不能带狗）

　　这里有一个狗，还有一个禁止的图形

　　这种方式我们叫做 Pictogram（象形符号）

　　指的是用图画去描绘你想要表达的实际的事物，表达的是实际的事物，两者是有区别的。

　　

　　这种方式在现在电脑的时代不太适用了，我们后面会看到，今天很多事物都是Idegrams，因为我们试图传达的东西越来越多都是很抽象的，

　　了解两者的区别，你可以更好的使用它，或者便于你和别的设计师聊天的时候装个逼。

　　

　　Icon是新鲜的事物吗？

　　绘画有着很久的历史，我们用图画去讲故事，通过图像去传输意思，hieroglyphs象形文字是一种图形的文字；petroglyphs岩石雕刻是人们在石头上作画来传递意思，所以人类用图画表达意思有着非常悠久的历史。

　　

　　

　　

　　这个图表（来自google）是Icon这个词使用的频率，可以看到70年代开始激增，Icon被用在各处。

　　为什么会这样，因为我们进入了一个电脑和图形界面为主流的时代，我们可以到处使用Icons，甚至可以超越了语言的障碍。

　　

　　比如这个，按下按钮，然后你会得到一个培根（场下妹子：哈哈哈）；

　　

　　我们经常可以用Icon来描述一些很抽象的概念。

　　

　　比如这些瑞典Icon（宜家的说明书）

　　

　　不过越来越多的Icons的用在界面上，我们使用这些视觉上的定位和这些布局的分割，使它们能够描述一些抽象的概念。

　　

　　我想提到的更重要的一点，关于你的手机，智能手机，它真正带领Icons的一个新的时代。

　　你的智能手机的整个系统是全新的比如App Store，一小块图标中蕴含着巨大的力量。

　　

　　下面进入我们今天的正题

　　首先第一点： Icons不是logos

　　我看到很多人犯了这个错误，事实上大部分是客户啦，我在我的pixel曾经写了一个大长篇文章来回复。

　　logo是品牌设计的重要的一部分，而他们俩并不是一个设计门类。Icon是电脑时代最常用的一个表达方式，它是在方块的画布上，需要有各种各样的尺寸文件输出，匹配不同的分辨率会有不同的尺寸，你需要一一匹配。而logo是需要有拓展性延展性的，会展现在各种各样的地方，当你交付一个logo的时候，你希望它会展示在广告牌上或者印刷品上，这跟Icon是非常不同的，两者的约束条件也不同，Icons是基于像素的，你在设计的时候可能还会考虑其他的事情。

　　不过谁会在乎这些区别呢，icon还是logo，但是你们是在这个领域工作的，所以你们需要很明确的去区分这两个不同的东西, 当你在设计的时候，你需要非常清楚地分辨两者的区别和共通点，以及实际制作的过程，和交付的文件形式。

　　

　　下面我们来聊一下界面Icons

　　（你们一定知道我很想谈谈关于AppIcons 所以这里我们快速的讲下这部分）

　　在今天我们看到的界面中有非常多的Icons，有的好有的不太好，画面上的界面中就有很多的图标，有很多图标用于标头栏，它们单独的出现，你不需要解释整个信息的意思，它们就像是一个个视觉的标记，很多时候你可以通过一扫而过非常容易的辨认它们，通常是描述一个抽象的概念并且你需要通过学习去了解这件事情。

　　比如这个“分享”的Icon，没有方法能叫一个以前从来没见过这个Icon的幼儿园小朋友一下子就认出“哦，这是分享”。

　　所以，当我们使用Icons而没有文字标签的时候，别担心不能直接的表达出它的意思，这种情况我们称之为：神秘的肉，因为在你知道他是什么之前，你必须去尝一下。

　　也就是说，在你知道这个东西是什么之前，你需要点击一下它，这也是我们设计界面中极力避免的情况，这是一个非常不好的体验，因为你点击之前你根本不知道会发什么。

　　所以，你在界面中使用Icon时候要注意判断清楚：

　　一个概念是所有人都能清楚理解不需要文字标签的，那么我们没有必要使用文字；

　　还是之前提到的那种，需要一些帮助和学习来认识这个概念，

　　不过智能手机随处可见的今天，人们已经可以完全认识到这个是分享了，你在使用没有文字的icons时候你要非常谨慎才行。

　　我想在界面中使用Icons可以帮助户界面更整洁，并且界面有很好的视觉标签可以帮助你更加快的记忆和识别一些非常抽象的概念，除此之外，还可以迅速的处理信息，如果全部写上文字，那么你就得阅读所有的东西。

　　

　　下面我们来聊聊App Icons，我谈大部分来自手机平台的Icons

　　主要是，我的大部分背景显然能看出来我做了很多手机平台的Icons

　　

　　如果要放置这两种Icons的话，一种是服务于功能的，一种则是服务于品牌宣传。

　　界面的Icons更多是用来表达功能传达概念，服务于视觉标识，就像我们之前看到的，

　　而App Icons是非常不同的用处，它们需要很多的测试，传达很多的信息；

　　所以，App Icons不是logo，但是它也具备品牌宣传的功能，所以你需要考虑这方面；

　　App Icons代表了整个应用，应用的功能，使用起来的体验和感觉，代表着这个应用的本质和核心。

　　人们通过这个App Icons去认识这个应用的公司品牌，并且能够明白它是什么类型的应用。

　　它可能是扁平的，也可能是超高细节的，或者仅仅是我们工具箱中的那种，只要他能够表达出创造者的信心和吸引力。

　　

　　

　　

　　那么，当你花费了八个月的时间在一个App Icons上面，并且创作了一个独特的符号，然后被质疑能够能更“漂亮”的时候，你可能就要精神崩溃了。

　　那么究竟怎么样一个好的App Icons，如何评判呢？

　　

　　首先，一个好的Icons需要具备可延展性

　　因为Icons会展示在各种地方，界面中平台中，Icons会在不同的地方展现需要有各种尺寸。

　　你可以看到很大Icon在Appstore，还有很小的Icons在你的手机主页上，以及更小的设置中的App Icons，甚至是安卓平台的不同分辨率下，这些都是同一个Icon，但是他们需要不同的限制条件和尺寸。

　　所以过于复杂的Icon，试图用细节填满整个画面的Icon绝对是不好的，延展性适配性就会比较差，对于Icon在各个平台和尺寸下都能够保持美观漂亮是非常重要的。

　　

　　然后我们来看一下一致性：

　　比如有个非常漂亮的App Icon，但是你打开应用发现这个Icon跟应用完全不同，甚至完全无关，这将是一个非常不好的体验。

　　我认为一个好的Icon还要具备的一点是，这个Icon将会代表这个应用，它就像是一个小小的窗户，当你在平台上看到这个Icon，它应该能够传达应用所要表达的东西，它们需要具备相同的视觉语言，需要确保这个Icon的视觉要素是参考并来自这个应用本身的。它们有着直接或者间接的关系，甚至涉及到一些应用的主要功能。

　　比如你的App中有星星的设计语言，那么你的Icon也保持用到这个星星。当然有很多方式去影响Icon，这只是一个例子。

　　

　　当然，还有一点，独特性：

　　在设计的时候，你大可以找一个参考去模仿，或者做自己的风格，或者将两者糅合，

　　你要知道你的Icon经常竞争的对象是大量的其他应用，确保有明显的独特性才能让人记住并脱颖而出。

　　

　　下面我们来讨论下，Bad Icons

　　

　　首先是误导:

　　Icon跟所使用的应用差之千里，用非常漂亮高清图片比如美女，来吸引人，其实跟App的内容完全不相干，这是非常错误的一种设计方式，这种方式也到处可见。

　　让我们赶紧抛弃这种做法，设计适合自己App的icon，当然这不代表你必须直接的去表达内容，但你可以在设计Icon的时候多去考虑这个问题。

　　

　　下一个使我很难容忍的，使用文字，这是一个大忌

　　千万不要这样做，只有少量的产品能够适合这种做法。

　　我认为这里有一个逻辑是，如果你使用了文字这个工具来表现，你就无法完全再同时用充分的图形这个工具表现

　　图像和文字是两个不同的表达工具，来传达意思，如果你把这两者混在一起，结果依然是一个图示的画面 ，因而，就会非常不集中，在某些分辨率下，整个App Icon的文字句子都混在一起，你很可能根本无法阅读它，比如在手机的主页面。

　　当我看到这样的Icon都感觉设计师失去了能够清晰表达他设计意图的机会。

　　但是有时候，这个做法是ok的。

　　你可以注意到比如facebook是使用了字母的，如果你使用的这个文字元素已经变成了一种标识，一个字母或者少量的字母，这时候，这样做也许是可行的。

　　我不是说不能这样做，我是指不要这样写上“best app”

　　真的没有必要这样，比如我看到很多Icon（大多可能是客户的要求），他们写着自己公司的名字，你Icon的下面在平台或者屏幕会写着这些文字，你没有必要再icon上重复写这些。

　　

　　最后一点，不要做半成品素材

　　有许多的Appstore 或者google play上的Icon，是苍白或者无聊的设计，你的Icon是你阻止用户使用的第一道门

　　就像你建造的房子的门口一样，它不应该是丑陋的，应该值得被投入精力处理的非常精彩。

　　这是整个软件体验中很重要的一个部分Icon是跟用户有着强力连接的一个部分。

　　当用户在第一次看到你的应用的时候，在使用你的应用或者思考你的应用时候，

　　如果他不得不把你的icon给去除掉，那么真是太失败了。

　　Icon需要能清晰地传达你的App是关于什么的，并让它能够成功。

　　

　　让我们快速的看一些完整的icon设计

　　这就是我说的，把他们混合在一起来看看，能让你的设计更好更突出。

　　你可以看出这堆icon都是关于同一件事情，再想想你是不是可以做出什么很棒的设计

　　我常常被问，怎么能成为一个icon设计师的，我想这是一个机缘巧合的事情。

　　设计icon是很有趣的，很棒的一件事。

　　还有一个情况是很多人忽略的，

　　假设你在进行一个很烂的项目，或者为很烂的客户在工作，

　　你常常会想，我要赶紧做完这个，然后你做了很屎的一个设计，你觉得谢天谢地终于结束了，我要开始做些很棒的东西了。但是并不会有机会找你的，你还是会获得越来越多的烂项目。你做的越多，其他人就会看到的越多。

　　如果是我，我就会放弃它，然后做更多我觉得有意义的

　　像我很喜欢做icon，然后做了一大堆，人们就会看到这些icons。

　　于是当有人需要一个icon的时候，就会有人找到我了。

　　所以 你做什么样的工作，你就会成为那样的设计师。

　　我想这是很多很多人忽略掉的一点，好的项目可能总是在周围，也许你可以试试先让它实现，

　　比如你给自己做一个icons，或者免费的去做一些再设计，甚至临摹一些你觉得非常喜欢的icons，做一些很有趣的设计，就像我做的星球大战那些。

　　然后把它们发布出来，你才能获得更多的相关的工作机会，最后你做的足够多足够好以后，有些客户就会愿意给你付钱了。

　　谢谢大家ヽ(??▽?)ノ

　　

本文 zblog模板 原创，转载保留链接！网址：https://5f1r.com/post/1312.html