有爱,有技术,有你^_^)y
╱人◕‿‿◕人╲订下契约(注册新用户)

合作站点账号登陆

QQ登录

只需一步,快速开始

快捷导航
查看: 19638|回复: 234
收起左侧

[设计理念] 设计建议:千万别用黑色

[复制链接]

该用户从未签到

81

主题

343

好友

3万

积分

第二章

积分
38792
发表于 2012-10-5 18:42:08 | 显示全部楼层 |阅读模式

╱人◕‿‿◕人╲定下契约

您需要 登录 才可以下载或查看,没有账号?╱人◕‿‿◕人╲订下契约(注册新用户)

x

我学到的最重要的颜色技巧就是在设计中避免使用黑色。
我小时候的艺术老师Zamula女士在我上中学时就告诉我了。后来在罗德岛设计学院我又听说过好几次。最初听上去有些奇怪,但这建议真的靠谱。


                               
登录/注册后可看大图


问题在于,我们看到深色的东西时总是假设它们是黑色的。而实际上你很难找到纯黑的东西。马路不是黑的。你的办公椅不是黑的。Sparrow(Mac上的一款知名email客户端)的侧边栏不是黑的。网页上的文字也不是黑的。

影子不是黑的

高中时我和其它艺术爱好者在艺术家教室里打发时间。Zamula女士不断向我们介绍不同艺术家的作品。她经常给我们看的一本书就是Wayne Thiebaud的作品。她会激动不已的指出他在画影子时点缀其中的明快主色。然后她会告诉我们看看作者的明亮的蓝色影子。

这书我读了不下十遍,在旧金山家喻户晓的Thiebaud很好地展示了影子不是黑色的。他的影子是其油画作品中最饱满的部分,在显示屏上也是如此。在纸上看效果还好。在现实生活当中看更好。

你可能会问,没错,但那些是油画啊,不是真的。好吧,你觉得我们的用户界面比他的画更真实吗?

但我也这么问过,有一天Zamula女士在一节美术课上用一个蓝色的灯泡证明了这一点。她把灯泡拧到一个夹灯上,然后通上电,夹在一个凳子上。然后拿出一个纯白色的球,放在纯白色的基座上。当她打开蓝色的灯的时候,球的投影是橙色的,而非黑色。

我当时惊呆了。现在当我在旧金山的大街上散步时喜欢寻找最饱满的影子。比如下面这张:照片中最深的部分不是#000000,而是#130f30。(亮度19%,饱和度69%)


                               
登录/注册后可看大图


黑色会让所有其它颜色黯然失色

当你把纯黑色和一组精心挑选的颜色放到一起的时候,黑色让其它颜色黯然失色。黑色鹤立鸡群,因为它不自然。你在日常生活当中看到的所谓“黑色”的东西都有点亮光点缀其中,也就是说他们不是黑色的,他们是深灰色。并且那种亮光可能是别的颜色,所以他们甚至连深灰都不是,他们有带有颜色的深灰色。

我们平时使用的手机应用有很多黑色,但实际上并不是真正的黑色,而是深灰。Twitter的侧边栏,新版Photoshop的背景色,Twitter的引导条等。它们都使用了接近黑色的颜色,但都进行了处理,这样就不会让屏幕上的其它元素黯然失色。


                               
登录/注册后可看大图


或者你可以这样验证,Dribbble上有一个非常牛逼的功能是让你根据颜色搜索照片,如果你根据“纯黑(pure black)”或“正黑(real black)”搜索,哪些看上去更好看呢?显然纯黑色的不靠谱。

当然也不仅仅和颜色亮度有关……

饱和度同样重要

除了避开#000000纯黑色之外,你还能做点其他的事情。当你使用黑色时,加入一点其它颜色会看上去更活泼。添加量取决于颜色的深度。比如我的Path(一款手机应用)照片饱和度69%,而浅灰色可能只需要3%。

这已经成为我在Segment.io工作时的主要选色原则之一。我把少量橘黄色掺杂到我们的灰色中。我们为最浅的灰色选择2%的饱和度,以此为开始,不断增加,最深的灰色饱和度为22%,从而在Photoshop上形成一条颜色弧线。

但是还是那句话,别老听我一面之词。让我们看看Facebook。为什么他们的移动版界面看上去那么赞?因为所有灰色都加入了Facebook蓝。


                               
登录/注册后可看大图


理解并没有那么简单

Zamula老师在中学里就警告我了,很多人后来也警告过我,但真正理解起来、并建立起条件反射需要很长时间。 甚至现在我仍没有把握能选择合适的灰色。

底线是:当你在颜色选择器里面发现#000000 时,问问你自己是否真的需要纯黑色。换点儿更自然的颜色或许会更好。如果你感觉在冒险,那么试着索性或略颜色选择器的整个左侧边缘颜色。

点评

魂蛋: 5.0 你淫了: 5.0
扑倒: 5.0
魂蛋: 5 你淫了: 5 扑倒: 5
非常好,非常有用  发表于 2018-5-13 15:48

评分

参与人数 10宅魂 +10 宅币 +38 活跃 +7 收起 理由
猴__哥 + 7 非常棒
我是一朵太阳花 + 3 o(* ̄▽ ̄*)ブ 发糖
大兔口牙_ + 3 + 7 + 2 o(* ̄▽ ̄*)ブ 发糖
江国 + 1 + 3 好有用的教学帖!
son丸子 + 3 o(* ̄▽ ̄*)ブ 发糖
望天晓 + 2 + 5 + 2 Σ( ° △ °|||)︴ 碉堡了
barossa + 1 + 3 + 1 Σ( ° △ °|||)︴ 碉堡了
jieyingnoello + 1 + 1 o(* ̄▽ ̄*)ブ 发糖
兔8爷 + 1 + 3 + 1 o(* ̄▽ ̄*)ブ 发糖
MAY_五月 + 1 + 3 + 1 学习了!

查看全部评分

一只渣!废物!
回复

使用道具 举报

该用户从未签到

177

主题

173

好友

3万

积分

The Thinker

属性未明

积分
31917
发表于 2012-10-5 18:45:08 | 显示全部楼层
学习了
原来#000000 需要很谨慎地使用
                              WORDS THAT WE COULDN'T SAY, OR COULD WE
回复 支持 反对

使用道具 举报

该用户从未签到

116

主题

85

好友

5万

积分

第三章

↑看大院的

积分
54800
发表于 2012-10-5 18:45:44 | 显示全部楼层
真理咩。。黑色么。。
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

签到天数: 7 天

连续签到: 1 天

[LV.3]偶尔看看II

112

主题

369

好友

5万

积分

吃货

积分
58987
发表于 2012-10-5 18:47:15 | 显示全部楼层
可以看看色彩心理学
乾杯 []~(~▽~)~*
回复 支持 反对

使用道具 举报

该用户从未签到

1

主题

15

好友

1310

积分

Continue

积分
1310
发表于 2012-10-12 22:17:23 | 显示全部楼层
学到了,第一幅图很带感!
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

1

主题

7

好友

1527

积分

Continue

积分
1527
发表于 2012-10-13 14:06:28 | 显示全部楼层
受教了><
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

188

主题

265

好友

3万

积分

第二章

再怕麻烦,直接揪我!!!!!!!!!

积分
34323
发表于 2012-10-13 14:18:24 来自手机 | 显示全部楼层
受教咩
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

81

主题

343

好友

3万

积分

第二章

积分
38792
 楼主| 发表于 2012-10-13 15:38:11 | 显示全部楼层

区版!
一只渣!废物!
回复 支持 反对

使用道具 举报

该用户从未签到

2

主题

23

好友

5008

积分

懒人

积分
5008
发表于 2012-10-16 22:27:01 | 显示全部楼层
原来如此!!!!
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

1

主题

14

好友

7470

积分

序章

积分
7470
发表于 2012-10-19 12:43:42 | 显示全部楼层
学习了~
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

12

主题

102

好友

2万

积分

第一章

积分
29113
发表于 2012-10-20 14:30:08 | 显示全部楼层
以前老师也说过类似的话~
Σ(〒︿〒)~但是吾辈一直都在用黑~
虽然不是最纯最纯的那种黑~
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

1

主题

16

好友

1138

积分

禁止发言

积分
1138
发表于 2012-10-25 12:27:33 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

4

主题

24

好友

1740

积分

Continue

积分
1740
发表于 2012-10-25 14:09:51 | 显示全部楼层
谢谢楼主!~罗德岛设计学院OH MY LADYGAGA,。。。ksu ID design暗淡飘过
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

该用户从未签到

32

主题

298

好友

4万

积分

傲娇娘

≡ω≡我是兔美人妻 ≡ω≡不是傲娇

积分
49007
发表于 2012-10-27 08:57:50 | 显示全部楼层
长姿势了!!艾玛~
小爽&杏子 小炎&小圆 真爱无雾(┬_┬)
回复 支持 反对

使用道具 举报

该用户从未签到

25

主题

35

好友

1万

积分

第一章

积分
17620
发表于 2012-11-13 08:36:47 | 显示全部楼层
记住标题一句话就够了
签名被小宅喵吞掉了~~~~(>_<)~~~~
回复 支持 反对

使用道具 举报

本版积分规则

小黑屋|手机版|技术宅(基宅) ( 粤ICP备18082987号-1 | 浙公网安备 33010902001746号 )

GMT+8, 2024-4-19 09:31 , Processed in 0.353284 second(s), 40 queries , Redis On.

Copyright © 2018 技术宅社区

Powered by Discuz! X3.5

快速回复 返回顶部 返回列表