关于icon和logo设计的一些讨论

不明觉厉

表示很期待看到这样的讨论，虽然我不是设计师，艺术细胞也不多。

logo 是越简单越好啊，不管是线条还是颜色，比如IE6, gnu emacs, 火狐的logo就稍嫌复杂

圆角矩形是为追求整体效果，instagram限制为矩形照片也是同样

我的想法：

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
- numbers，能一眼看出是处理数字和图表的

为什么iPhone UI上所有的icon都限制为圆角矩形？
-为了树立风格形象，让人们看到圆角icon都觉得是iPhone上的，如果没有这个规定，恐怕 iPhone 上的图标就更杂乱无章了

为什么adobe套装里的icon都做成那个样子？
-参见上一条 + 缩减成本 + 让设计风格能脱离设计师而得到延续

Mac官方App中最打动你的icon是哪个？
-计算器

NEXT的logo是不是丑得跟狗屎一样？
-是，但能让人记住

为什么世界五百强中大部分的Logo都很“难看”？
-只要能让人记住，在不同的场合下都能（比如只能黑白、线条、低分辨率、触摸等情况）认出品牌，即便你觉得难看，但他确实是个好设计。

锤子镰刀是个好设计，但国徽就不是了。

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
Numbers

为什么iPhone UI上所有的icon都限制为圆角矩形？
给人感觉好，并且全部是统一的，能给用户很好的体验

为什么adobe套装里的icon都做成那个样子？
简单，和iphone的图标一样能给人很统一的感觉

Mac官方App中最打动你的icon是哪个？
貌似还真木有发现

NEXT的logo是不是丑得跟狗屎一样？
绝对的，但是在那个时候的人肯定感觉不太一样。就和现在看到以前的那个彩色apple logo一样

为什么世界五百强中大部分的Logo都很“难看”？
简单，经典，并且图标都是多年以前设计的~

明天我会贴出我的想法。

1. numbers
2. 统一
3. 色彩简单,风格统一, 辨识度高
4. 不知道什么算最打动,看了就想哭吗? :P
5. 确实很丑
6. 跟时代有关, 印刷水平也不是很高

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
Keynote (很喜欢这个调子和纹理)

为什么iPhone UI上所有的icon都限制为圆角矩形？
没有锐角，对手指来说有种安全感

为什么adobe套装里的icon都做成那个样子？
模仿马克笔屁股上的标记

Mac官方App中最打动你的icon是哪个？
Xcode（标有preview红绸带字样的版本）

NEXT的logo是不是丑得跟狗屎一样？
很丑，也可以说是时代气息。

为什么世界五百强中大部分的Logo都很“难看”？
因为很多都有历史了，而且这些logo出现的媒体多种多样，要考虑显示屏以外的各种载体。

其实用透明无边框的正方形来限制 logo，同样能起到整齐的作用。

iPhone/iPad 的外形都是圆角的诶，这是软件对硬件的视觉呼应

Mac 官方 app 里面 icon 设计最打动我的是 iCal 的，理由是它能在 Dock 上面动态更新日期……

@rthur369
今天该贴啦

@wudoo59 我觉得原来的彩色apple logo也挺好看的。

原来做设计的，都是给做设计的看的

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
Pages
为什么iPhone UI上所有的icon都限制为圆角矩形？
最早iphone的样子是圆角的
为什么adobe套装里的icon都做成那个样子？
玩厌主流风格了
Mac官方App中最打动你的icon是哪个？
None
NEXT的logo是不是丑得跟狗屎一样？
是不是狗屎不知道,反正是屎
为什么世界五百强中大部分的Logo都很“难看”？
都还不错~!

来玩一下

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
这样的太多了，没什么视觉刺激。

为什么iPhone UI上所有的icon都限制为圆角矩形？
一致性，圆角是产品外观上的一个元素，为了统一。

为什么adobe套装里的icon都做成那个样子？
一致性，风格化。

Mac官方App中最打动你的icon是哪个？
一样，果系的高光高质感，太普遍了。

NEXT的logo是不是丑得跟狗屎一样？
是

为什么世界五百强中大部分的Logo都很“难看”？
难看好看太容易判定，就不能作为一个判定LOGO的标准了。

pages

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
Keynote

为什么iPhone UI上所有的icon都限制为圆角矩形？
统一性

为什么adobe套装里的icon都做成那个样子？
统一性，强化使用者的印象，让用户看到两个字母+纯色背景的图标就想到Adobe

Mac官方App中最打动你的icon是哪个？
Safari

NEXT的logo是不是丑得跟狗屎一样？
是

为什么世界五百强中大部分的Logo都很“难看”？
Logo只要易于识别就可以

你们觉得iWork 3个icon里哪个最好。 Page, Keynote 还是 Numbers?
Page和Keynote很难分出上下来，Numbers稍微差点。

为什么iPhone UI上所有的icon都限制为圆角矩形？
圆角矩形不锐利 有Button的感觉 统一，看着不乱，雏型是Dashboard的Widget.

为什么adobe套装里的icon都做成那个样子？
Adobe貌似说过作为创作工具，简单点也不错，整体颜色参照了色环的概念，这个貌似cs就沿用到目前了。

Mac官方App中最打动你的icon是哪个？
放在一起很多都不错，很难挑出那个最好。

NEXT的logo是不是丑得跟狗屎一样？
NEXT的logo 就是那个类似盒子的吧，设计师是Paul Rand 设计了IBM等很多大公司的logo.是Steve Jobs找他做的 10W刀

为什么世界五百强中大部分的Logo都很“难看”？
有不少也不错的。

我不觉得NeXT的Logo丑得跟狗屎一样
我也不觉得世界五百强大部分的Logo都很难看

“明天我会贴出我的想法。”？

mac官方里最喜欢Google Maps的，虽然马上就没有了。

500 强还有 Rand Paul 这样被你一巴掌全打死，学设计的表示很愤怒。与其这样一些问题，不如多看点书，多翻点资料，了解一下为什么他们这样设计，为什么他们值 10W，而中国的大多数设计都值个蛋。

这几天比较忙没顾上。看这帖子里连愤青都出来了。

* 你们觉得iWork 3个icon里哪个最好。 Pages, Keynote 还是 Numbers?

虽然page和keynote拥有非常精致的造型和拟真效果，但是就icon设计而言，Number要超过它们。 Number脱胎于现实中的物体但又不是完全模拟它们，形象更简洁有力。
从表意性上，Numbers 对图表工具的概念进行了成功的提取和抽象，相信任何人第一次见到这个icon的时候都能认出它是一种什么工具，但墨水瓶（Pages)的象征性太模糊，演讲台（Keynote）是一个人们不熟悉的且特征不明显的事物。人们在通过icon形象识别出工具用途时要更困难。
从辨识度上，透视和视角的选用形成了很强的立体感，配色也非常鲜明。这些都提高了你从dock条上把它辨识出来的几率。它的小尺寸表现也好于其它两者。
Icon的成功更多取决于它是否能有效表意（功能、用途或者非常鲜明的个性特征）并且具有很强区分度，容易认出并建立关联。而不是在于它是否材质更漂亮或更拟真。


* 为什么iPhone UI上所有的icon都限制为圆角矩形？

有一些设备的UI上的icon允许透明通道，也就是允许icon是各种形状的。这显然让设计师有更大的发挥余地，能够创作出更漂亮的作品。
但是iPhone的桌面是一个访问频率非常高、空间有限、icon放置密度非常高的环境。icon之间的间距没法很大，如果不统一上面几十个icon的形状，会导致一个非常杂乱的界面，icon之间也会彼此干扰。（虽然Launch Pad也是这种罗列icon的方式，但拥有较大的空间和间距，情况会好一点。）所以规整统一的形状可以带来良好的节奏和协调的感官，同时也可以和设备的整体外形相呼应。
此外，设定这一“游戏规则”也平均了icon们的风格和水准。目前app stone上已经上架了10W个应用，也就有10W个icon，设计水平参差不齐。但统一的形状和Apple官方icon设计所引导的风格，让最差的设计师也不会做出烂得超过底线，影响整个设备UI的icon来。即使你啥都不会，选一个背景色，在上面放一个字母，也能成为你的icon，而且效果也不太坏。所以在IOS设备上你不会看到那种一堆icon里突然冒出一个特别土带着粗大的锯齿边和蹩脚阴影的刺眼玩意。
从IOS的开发定位来看，Apple一直都选用的是一个平均化但是最能保证整体效果的方案。让一个工程师，仅仅利用默认控件，也能做出可用可看的App。
设计和艺术的区别之一正是“设计是带着镣铐跳舞”。
游戏规则的设定，就是为了保障整个游戏的可玩性和所有玩家的利益，我想对所有icon外形的限制（包括HIG中对许多控件及交互方式的限制）就是整个平台设计策略的一环。

* 为什么adobe套装里的icon都做成那个样子？



cs2在04年发布，cs3在07年发布。这3年间Adobe做了很多重要的战略调整，事件之一是收购了Marcomedia，并且更强调工具之间的兼容性，并提供一些平台化工具。Adobe需要推出更多套装，并在里面包含更多应用。从提供工具变成了提供工具箱。
CS3刚出来的时候，对icon设计进行了重大的改变，当然获得了大量恶评，理由都是一个丑。就单个icon来看，CS3的PS图标比CS2差几个级别，adobe不是找不到好设计师，为什么要这么做。



看完这张图就明白了。adobe的设计工具都比较难以根据功能来提取出一个具象概念，只好用羽毛，花朵，树叶这种很“精神层面”的的物体来表示。当套装变得更大，设计师桌面上需要放下更多adobe应用的icon时会出现什么状况，他的鼠标会在几个icon之间移。当然假以时日，反射弧会被建立，也会通过摆放位置来进行记忆，但对于新用户而言，这无疑是一个悲剧。



展示这张图不是为了说明adobe的新icon们在色相环上的分布，而是为了说明有它们工具数量的庞大。

CS3系列后的新icon虽然不好看，但无疑极为直观，无需建立对象及其象征物之间的关联，这不是表意而是直接对着你喊出来，“我是PS"。文字带来最快速的反应。
风格强烈，你可以轻易识别出它们是属于一个adobe的。
此外它最大化利用了系统中icon的尺寸限制，一整个大色块。所以你会发现它们无论是在dock条还是windows桌面上，都是抢眼的。

设计过程中如何做决策，美的标准是什么，我借用一下《data visualization》一书中的观点：novel （创新)， informative (这里可以理解为否实现设计的功能，传达出需要传达的信息）, efficient （能否有效地达成设计诉求）, aesthetic （是否有视觉魅力）。受众、目标和情境是设计开始之前必须回答的问题，一个不能保障可用性（有效达成目标，满足需求，适配于使用情境）的设计，再好看再创新也是失败的。Adobe的选择也正是基于这一点。

* Mac官方App中最打动你的icon是哪个？
Automotar. 这是一个通过点击拖拽这些操作在不同应用间创建工作流（批处理）的工具。这用一个拿着管道（连接件)的高科技机器人来表示最非常恰当的。精密、冷酷、充满魅力的质感，直接就是苹果的气质的体现。
它打动我是因为它是一个被人格化的icon，也是mac 官方icon中唯一一个拟人化的设计。用一个令人爱不释手的高科技机器人来表达一个编程工具。automation代表了apple script的最高成就，这种东西对于编程语言的意义，相当于GUI对桌面系统。它利用高水平的技术和工设计，提供了生产率，降低了使用门槛和成本。这正是高科技机器人带给我们的。这个形象是不是也让你作为一个普通人也有兴趣去尝试编写程序。比terminal的icon给你的心理压力小多了吧。
这个设计在可用性和美观的标准之上，体现对情感的传递。它建立的不仅仅是效用，而是喜爱。很多时候 ，感性认识比理性认识对于人们做出决定更为关键。



新版的icon更换了质感，简化了材质上的细节， 加深对比度和整体颜色，强化了轮廓。我感觉是一个从 炫目、模拟真实质感->更简洁和抽象、和环境能搭配 的变化过程。新版的在小尺寸下表现也更好。


* NeXT的logo是不是丑得跟狗屎一样？

很多人都知道它是Jobs请Paul Rand花了10W刀设计的。



首先我觉得它并不好看。但是好看绝对不是一个LOGO设计是否成功的唯一标准。

首先试图追溯Paul为什么要这样设计NeXT的logo



这就是NeXT cube， NeXT computer的机箱，它最大的特征就是 方正（据说Jobs花了很大代价追究8个角的锐利，就像用尺规工具在纸上画出来的那样干净准确）、极简（用色纯粹，没有多余的线条和装饰）。这个工设放到30年后来看都毫不逊色。



这是NeXTSTEP / OPENSTEP 1.0 (released in 1989)。该 GUI 的图标很大，48×48像素，包含更多颜色，从1.0开始支持彩色，已经可以看到现代 GUI 的影子。

比较一下同年代的其它GUI水准。

Windows 2.0x (released in 1987)



OS/2 1.20 (released in 1989)



Desktop Computer操作系统之GUI发展http://blog.csdn.net/greenhand_/article/details/7787861

N e X T 这4个字母的颜色，搞设计的同学应能容易联想到CMYK，现在找不到原设计图了，没法取到精确色值，但我推测都是满值的。大红 M100%Y100%, 绿色 C100%Y100%， 黄色Y100%， 品红M100%。
我的一个在苹果工作过的朋友，在那个年代见过NeXT的LOGO，他的印象是颜色非常艳丽饱满，这也正是Paul想传达给消费者的关于这个产品的特征。在当时的印刷平均条件下，Paul的这个用色选择是大胆，同时也是成功的。

Paul 从NeXT的经典产品中抽离除了最本质的几个特征。立方体，极简，纯黑的底色，还有颜色丰富、富有魅力的GUI。

抽象的过程就是一个简化的过程，也是一个靠近事物本质的过程。得到本质以后，其他一切都只是从属，都可以根据恰当的条件进行省略。

Jobs看到方案问Paul, 还有其它可选方案吗？Paul 说：“没有，我已经解决了你的问题。付钱吧。想要可选方案？找别人去吧。”

我的理解是，设计是为了解决问题达成诉求，所以最合适的方案当然只有一个。Paul自信他提出的这个设计就是这个最合适的方案，因为它已经解决了“品牌传达”这个最核心的问题。

Paul 是包豪斯设计思想的继承者，同时为商业服务的使用美术大师，他喜欢拼贴风格，拼贴可以突破空间的限制，用色强烈，造型简单，追求准确的传达而不是盲目的创新。Jobs的评价也是这样，认为Paul 是艺术家和商业问题解决者的结合，认为 Paul 的设计很 emotional（感性），同时又很 intellectual（理智）。

所以关于这个问题我想说的是，美的标准是变化的，建立在时代和文化背景上的，在观看一件历史上的设计或者艺术作品时，只有理解了它的背景、出发点和诉求之后，才能触摸到它的本质，学习到它的成功之处。同时对于一件为商业服务的设计而言，“有效”是最核心的，而不是“好看”或者什么别的。当然达到有效的手段有很多种，比如创新、情感化，视觉表现手法当然也在其中。

* 为什么世界五百强中大部分的Logo都很“难看”？

回答完了上一个问题之后，我觉得这个问题也不用回答了。
我给难看加上了引号是因为审美永远是一个相对标准，随个人偏好、时代定位和文化背景所变化。
世界500强公司能做大往往也有着悠久的历史。他们的LOGO穿过了几个文明快速发展、观念快速变化的时代，其传播载体和条件也在不断更新。无论它们是否还符合现在的审美，它们在当时的背景下都已经完成了品牌传达的目标，建立了鲜明识别度，并且成为企业文化的一部分。

人类历史上最彪悍的logo，应该是十字架了吧。amen！

lz牛人。