我想给10位玩家中的每一个赋予独特的识别颜色。为此有最佳的颜色集吗?如何创建一个?
我想出的每一组都包含太相似的颜色。
更新:下面有人问我这是干什么的(公平问题)。现在,我可以告诉您-Windwardopolis和颜色效果很好。
我想给10位玩家中的每一个赋予独特的识别颜色。为此有最佳的颜色集吗?如何创建一个?
我想出的每一组都包含太相似的颜色。
更新:下面有人问我这是干什么的(公平问题)。现在,我可以告诉您-Windwardopolis和颜色效果很好。
Answers:
您可以在HSV空间中生成等距的色相值:
for (int i = 0; i < 10; i++)
colors[i] = HSV(0.1 * i, 0.5, 1.0);
但是,您可能不会总是有10位玩家。在这种情况下,除非您为其他玩家重新生成不同的调色板,否则调色板将不会非常有效。相反,一些作者建议利用黄金比例生成调色板,并利用均分定理产生的性质:
for (int i = 0; i < 10; i++)
colors[i] = HSV(fmod(i * 0.618033988749895, 1.0), 0.5, 1.0);
这样,即使您停在3或4或7个玩家处,您也可以获得很好的色相传播。
许多非理性的数字都可以,但是黄金分割法效果最好(已被证明)。
最后,您也可以使用两个不同的生成序列来进行调整S
或V
。例如(编辑:我添加了sqrt
更好的均值分配的电话):
for (int i = 0; i < 10; i++)
colors[i] = HSV(fmod(i * 0.618033988749895, 1.0),
0.5,
sqrt(1.0 - fmod(i * 0.618033988749895, 0.5)));
更新:通过使用H
考虑到人类视觉系统的校正曲线(类似于RGB分量的伽玛曲线),可以改善上述结果。这是我使用CIEDE2000指标计算出的色相校正曲线:
等距色相值的结果如下:
对于黄金分割率生成序列(启用和不启用V
):
一旦找到合理的公式,我将发布曲线公式的近似值以供程序使用。
星际争霸的8 种颜色是:
红色,蓝色,蓝绿色,紫色,橙色,棕色(沙漠地图上为绿色),白色(冰地图上为绿色),黄色
观察 暴雪是UI天才,并且已经研究了这个问题。
他们在沙漠地图上将格林排除为布朗的换人,因此从技术上讲,那里列出了9个。
魔兽争霸3 的12种颜色是:
红色,蓝色,蓝绿色,紫色,黄色,橙色,绿色,粉红色,灰色,浅蓝色,深绿色,棕色
外观如下:
如您所见,它们非常不同并且易于区分。深绿色实际上很容易与蓝绿色区分开,可能是因为人眼最容易区分绿色。如果您确定您的播放器将是女性四色镜,则可以选择任何颜色。
这里有些人建议在色相上的10个等距位置处划分HSV颜色空间。我认为这实际上不是一个好的解决方案。人眼无法在整个HSV光谱上均匀地感知颜色差异。例如,我们所说的橙色只占乐队的一小部分,而一个好25%的块可能就是绿色。因此,这始于一个糟糕的前提。看看这个答案的第一行颜色。两种果岭几乎无法区分。
请记住,您的用户将需要交流并参考颜色。有鉴于此,《星际争霸》 /《魔兽争霸》主题是一个很好的线索。基于简单的英语Crayola颜色列表进行选择并不是一个坏主意,因为您最终将获得熟悉的命名颜色。然后只要将这些颜色调整为粗体,柔和的颜色即可,只要您仍能识别出它们是红色,橙色,黄色,绿色,蓝色,紫色,棕色,灰色,白色,黑色即可。
编辑:语言和色彩感知之间的联系非常有趣,我只想分享这个很棒的链接:
我认为我需要将这种“符号”方法分解为一个单独的答案。
过去,我认为人们需要旗帜和东西才能轻松识别远方的军队,因此您知道是进攻还是防守(对于敌人而言),还是如释重负(对于盟友而言)。
因此,顺便说一句,这正是您要尝试执行的操作。轻松识别远处的物体。
您可以只用颜色做到这一点,但可能更好的方法是使用颜色和符号。如上所述,使用颜色和符号 的组合将帮助色盲人识别事物。
如果单位足够大,则还可以使用2-4色徽章。
该模式是很容易辨认,而不仅仅是一种颜色。良好的纹理处理可以在每个单元的胸部或上臂上标记相当大的徽章。
在上图中,不同单位的头盔具有不同的几何形状以及盾牌标志。
您可能会发现日语Mon的想法也很有趣,它们看起来很简单。
现在,您基本上是在用现代“品牌”为您的单位打上品牌了。《星际争霸2》通过“贴图”做了一些操作,
但是这些在游戏中几乎看不到
并且不像颜色那样用于识别单位。
我还会考虑标记的灵感,尤其是那些没有使用3条条纹品牌图案的标记(这些标记变得有些混乱)。考虑:
这些都有一些非常简单但又与众不同的标志。
还要检查美国政府用来识别国防人员的符号。这些是单色图像(可以完全以黑白完成),因此这实际上可能是一个很好的解决方案,不会排除色盲人员(基本上使用符号来标识团队,而不是颜色)
为什么要重新发明轮子?甚至有一套十六种颜色的标准,您可以选择十种颜色。这是ANSI设置的http://en.wikipedia.org/wiki/ANSI_escape_code#Colors
ANSI颜色均匀分布在RGB多维数据集上,我认为比HSV空间更适合此问题。
当采用RGB立方体的极值时,您会获得熟悉的颜色,例如红色,蓝色,青色等。在八个角点之后,您将获得边缘之间的所有点。
制作10种可以区分的颜色将非常困难。在为许多值创建图形或图表时,这是一个非常普遍的问题,这就是为什么它们经常使用颜色和形状或颜色和哈希图案组合的原因。
如果需要显示标记,则可以使用4种基本颜色(例如红色,蓝色,橙色,黑色)和4种基本形状(正方形,圆形,三角形,菱形),并获得16种非常容易区分的标记。
如果要在区域中着色,请使用相同的想法,但要用黑色或白色线条(而不是形状)将颜色与阴影图案组合在一起。
要考虑的另一件事是不要使用颜色作为告诉侧面的唯一方法。将鼠标悬停在某个区域上可能会高亮显示该区域,并给出明确提示玩家名称的工具提示。或者,可以将10个玩家的列表悬停在上面,然后当一个鼠标悬停在一个玩家名称上时,将显示该玩家在地图上的所有区域。
另外,在选择颜色时,请记住色盲。例如,绿色和红色可能无法区分。看看http://jfly.iam.u-tokyo.ac.jp/color/#select,了解一组建议的颜色,对于盲人来说这不是问题。其他资源是http://www.usability.gov/articles/newsletter/pubs/022010new.html#ColorsthatWorktheBest
即使您可以获得一个人可以轻松区分的10种独特颜色,另一个人仍然可能会发现这种颜色很难区分。
考虑将自己限制为较小的颜色集,并添加可区分的功能,例如黑色条纹。对于这组颜色,最好不要偏离大多数人容易分辨的颜色:ROYGBIV。ROYGBIV上的简单条纹/无条纹可让您识别14个游戏作品。
您也不必将自己限制在黑色条纹上。请考虑以下解决方案,用于连接25对电缆线(可以很容易地用条纹而不是电缆线对):http : //en.wikipedia.org/wiki/25-pair_color_code
只是想引用对Tableau-10调色板的引用,该调色板是为实现高度独特性而开发的,本文对此进行了描述:
http://vis.stanford.edu/files/2012-ColorNameModels-CHI.pdf
“ Tableau-10调色板可提供最佳的显着性和最小的名称重叠。”
做的不只是色彩-具有视觉上的表现,这会增加知识,艺术风格和色彩表现。
例如,《五环传奇》使用一种令人难以置信的方式来区分“一组颜色”。
一个最美丽的例子之一。请注意他们区分氏族的数百种方式。它不仅是原色,而且还包括第二色甚至第三色。颜色甚至包括在发型,衣服类型,字符类型,附加的符号,标志,横幅,背面的迷你标志,个性中。
我从中得到的最大好处是多种颜色的组合。这不是简单的:蓝色,红色,紫色,棕色,黄色,绿色,蓝绿色。
它是两种颜色的组合,两种颜色都很明显。这可以允许大量额外的玩家。
每个氏族都将具有原色和一组副色。
“螃蟹主要被识别为蓝灰色,再加上黑色,红色和棕色。”
它之所以美丽,是因为无论这个人长什么样(大,虚弱,武士,巫师,农民),您总能分辨出他们来自哪个氏族。对于蝎子,这不仅是“红色”,而且是深红色和黑色。凤凰城有森伯斯特的颜色:红色,橙色,黄色。
即使它们的颜色相似并且它们都使用了很多红色,也永远不会使蝎子与凤凰混淆。
尝试使用以下混色器:w3schools.com HTML混色器。
这就是我要做的:为第一个选项选择一种颜色。然后,为第二个选项选择一个,以使第二个颜色相对于第一个处于完全相反的位置。因此,位置1行1单元格的颜色与之相反:最后一行,最后一个单元格。
这样,您每次都在混合的末端得到两种非常不同的颜色。重复此5次,始终选择与上次选择相距较远的颜色。
这个问题有很多答案,但我想进一步谈谈可访问性。
如果我处于您的情况下(需要为游戏中的所有事物选择颜色,所有参与该游戏的玩家都应将其视为独特),那么我的主要关注点将不仅是色盲玩家的适应,还要低视力。
据我所知,解决此问题的唯一方法是VALUE CONTRAST。某些人只能看到黑白(来源:艺术学院的一位朋友讲授色彩理论课的故事,但由于激光眼科手术失败而根本无法感知任何色彩)。有些人视力低下或部分/法律上失明。你需要的灰色深浅分明为出发点,让你的颜色DO选择是可见的和独特的每个人。
为了完成所有这些操作并获得看起来不错的颜色,请考虑以下图像,该图像是通过在垂直黑白渐变之上的颜色混合模式下分层水平彩虹渐变而获得的(可以自己尝试,也可以使用自定义颜色彩虹以外的渐变!):
从最暗到最亮:黑色,蓝色,红色,洋红色,绿色,青色,黄色,白色。
您能看到淡淡的“纯色”之字形吗?这就是所说明颜色的自然价值。即使使用纯色,蓝色最暗,黄色最亮。利用这一信息来选择颜色既适合游戏玩家为之色盲和/或低视力的价值要求和具有美感的人谁能够理解你所选择的色调的充满威严。
希望这可以帮助!:-)
附言:我想确保您也看到了此评论!
色盲的最佳答案就是简单不依赖色彩。理想情况下,每个玩家都应该对他所控制的任何演员都拥有独特的身影。我的意思是剪影,而不是某种象征。太多的Match 3游戏会完全错误,即使对于没有色盲的人来说,它们也很难玩,并且会引起太多的眼睛疲劳。–肖恩·米德迪奇(Sean Middleditch)2012年12月30日5:08
确保为可变数量的玩家(不考虑色盲)提供可区分颜色的最佳设置的一种方法是从HSL(色相,饱和度和亮度)颜色模型中进行选择。
您可以根据自己的选择选择恒定的亮度和饱和度。然后,将颜色的色调移动360 / playerCount
,如下面的伪代码所示:
saturation = 200;
lightness = 128;
hueDelta = 360 / PLAYER_COUNT;
for (int i = 0; i < PLAYER_COUNT; i++)
color[i] = Color.FromHSL(hueDelta * i, saturation, lightness);
我想提出一个替代的配色方案:
这些是带有建议名称的RGB颜色(相同顺序):
#eeeeee - white
#efef00 - yellow
#00e1da - cyan
#bfbf00 - olive
#12c055 - light green
#e21e80 - pink
#777777 - gray
#c10008 - red
#8900ae - light purple
#7c3900 - light brown
#0029b9 - blue
#400086 - dark purple
#4b1c00 - dark brown
#003004 - dark green
#07004b - dark blue
#111111 - black
注意:我没有使用纯黑色和白色,以为它们可能用作背景或轮廓。
方法:在色块的饱和面上选择12种颜色(认为我会满意12种颜色),将它们分开,然后-使用工具模拟色盲-开始tweeking。之后,我添加了近白色,近黑色和灰色,因为我可以。那给了我15种颜色。我想要16种颜色,因为它是2的幂,并且我可以使开发人员更轻松。最终,我找到了一种添加第16种颜色的方法,为此我不得不移动其他颜色。然后...使用色盲模拟工具再次检查,修复并重复。
以下是不同的色盲情况:
在使用色盲模拟工具一段时间后,我不得不说,对比度至关重要。
例如,考虑第5(浅绿色),第7(灰色)和第9(浅紫色)颜色。在某些情况下,它们看起来很相似,尤其是小尺寸并由另一种颜色隔开。但是,将它们并排放置,您可以将它们区分开。增加颜色覆盖的面积,您可以更轻松地将它们分开。所以...为色盲而设计不仅是挑选颜色。
值得注意的是...如果您选择两种颜色的组合而不是一种颜色来代表派系,这将有很长的路要走。
这些颜色是通过非常经验的方法挑选的。我注意到非常重要的一点是要确保它们的亮度都不同。我还注意到大多数“颜色”出现两次(有两个绿色,两个紫色,两个棕色,等等。。。)。实际上,第四种颜色(橄榄色)是我添加的最后一种,我决定它会是一种类似黄色的颜色,因为没有像黄色这样的颜色。我想这可以成为更系统地选择颜色的基础。
回顾一下,我可能应该使第二种类似黄色的颜色(橄榄色)变深,并使用该亮点作为一种粉红色(请参见第7种颜色)。为什么?因为它会给您更多的阴影来玩。恩...这已经足够好了,获取所有图片是一件麻烦事。
附录:我没有考虑的是,如果您超出首选的角度范围,LCD屏幕的色彩会如何变形。