在 2013后期，Riot的地图小组开始全力进行召唤师峡谷的更新，这是英雄联盟的旗舰地图。任务并不轻松，他们不仅需要更新整个地图的外形和质感，还要保 留原来的地图深受玩家喜爱的元素，他们还要最低化游戏对硬件需求的上涨。现在距离新地图的上线已经过去了一年，我觉得地图组的工作成果十分完美。地图更加 生动和吸引人了，而且也能够更加好的体现游戏本身竞技的元素。本文中，我们来谈谈此次地图更新过程中一个技术难题：战争之雾的改善。
旧版地图vs新版地图
当 地图组开始对召唤师峡谷进行更新的时候，每个功能，每个点子，每个异想天开的白日梦，我们都进行了全面的讨论。整体的艺术风格是什么?我们可以在哪里加强 移动路径，或者增加新的功能?那条河到底来自于哪里?随着他们开始完善地图并且增加新的东西的过程，一些难题浮现了。战争之雾就是其中之一——这片空白的 黑暗只用英雄用肉身技能或守卫才能点亮。设计师们知道战争之雾的视觉设计会有难度，但具体化到地图上之后就会发现，它还是太丑了。
旧版战争之雾放到新地图上的效果
旧版战争之雾放到新地图上的效果2
注意到阿狸视界范围的边缘如何层次不齐，以及渐变效果如何粗糙了吗?这两点都对游戏本身的可玩性有着毁灭性的打击。在此之前，这些问题很少被发现，因为地图本身的精细度没有那么高。(从这里也可以看出最终的地图和最初开始改动的地图之间的差距)
移 除这些打扰视线的东西当然很容易，我去掉了层次不齐的渐变层，以带来更好的视觉清晰度。不幸的是，让战争之雾的边缘更加平滑没那么容易解决。难点在于数据 的低分辨率和lol的可见性系统相违背。这本来是有意为之的，游戏中的一些特定物体，比如影子或特效，都是以较低的分辨率装载，目的是为了降低加载时间节 省资源空间，让游戏可以在更低配置下运行。比如战争之雾就是一个遮盖在整片地图上的128*128的大网格。
一个很明显的解决办法就是增加 战争之雾的分辨率。不过，在探索这个方案的时候，我们发现了一些代码无法运行，即使是简单升级到256*256也会导致CPU功耗增加四倍。改进代码的过 程是一个有趣的挑战，但我们的时间并不允许我们对一条一条来研究。我开始寻求不用动代码的解决方式。
我们对原本的128*128已经上了一 层高斯模糊(PS术语)来让边缘更加圆滑，所以我想如果增加模糊的程度能不能解决这丑陋的边缘呢?不幸的是，没那么容易。我发现现在战争之雾的代码的模糊 动作并不是分割开来的。如果你能够将一个图片滤镜风格开来，可能达到同样的效果，而不用增加硬件的需求。我知道一系列新的科技可以降低模糊对硬件产生的压 力，灵活对图片进行处理。我开始对模糊的类型进行探索，但对128*128的图片进行任何的模糊处理都会变得太模糊。游戏设计师们希望可视化区域和战争之 雾之间的过度能够兼顾可玩性的需求，越清晰越好，所以我需要在一个更加狭窄的地方进行一个更加视觉清晰的渐变。很显然我需要一个分辨率更高的资源来进行模 糊处理。
我现在必须要做一个艰难的决定：我要硬着头皮找时间来对整个视觉系统进行重新检视吗?我已经准备好和工程领头人进行一次面对面的谈 话，告诉他这个坏消息了——但我突然有了一次领悟!影响游戏玩法的问题并不是数据的清晰度，而是视觉呈现的清晰度。聪明地将数据从128*128晋升到 512*512可以很大程度上改善战争之雾的外观。经过一系列的头脑风暴和讨论，我想出了下面这个升级数据的简单方法：
每个像素都变成了一个4*4的空心格子，可以去除丑陋的锯齿
左边2*2的格子代表着原来的像素点(红色部分)，它的三个邻居就在128*128的源图片中。右边4*4的格子代表着一个进阶版的512*512图层，能够让渐变区更加顺滑。总共有16中不同的模式，下面是一个对比图
128*128尺寸战争之雾(放大4倍)
512*512尺寸战争之雾(放大4倍)
512*512尺寸战争之雾(放大4倍+模糊效果)
我已经去除了锯齿了吗?你可以看到，升级原本的数据很清晰的移除了本来的锯齿。这个技术的升级版其实已经存在了一段时间了，有兴趣的玩家可以检索【hqx】百科词条。
在召唤师峡谷的更新过程中，战争之雾增加了工作的复杂程度，带来了很多新功能和旧功能的瓦解，繁琐的细节我就不一一道来了。好吧，有一个细节我还是想谈谈。我们之前并不知道，但旧的战争之雾其实让地图变暗了很多。
旧的代码会让一些其实不在战争之雾的地图区域变暗。这就意味着设计师们创作的每个细节都被变暗了几个亮度。没有任何人发现这一点!刚刚从对抗锯齿的战斗中胜利，我满怀信心，然后又解决了这个问题。我只是将可见区域的颜色附加从1降低到了0.9所有，然后整个游戏都更亮啦!
查看下面这张美丽的地图一景，将他们和之前的游戏截图对比。到召唤师峡谷更新和大家见面的时候，我们倾注的大量心血和时间让它变成了一件完美的作品。新的UI界面也是一次优秀的提升!
现地图战争之雾1
现地图战争之雾2
我想听听看大家对于我们工作的看法，也可以聊聊你们遇到的技术上的问题，谢谢!
