I’ve found good topic about dev experience from Original Post https://agentlien.github.io/fog/ so I was translation to Korean and Chinese version.
Thanks agentlien.
内部视角..
在开发Lost in Random的过程中, 我们的艺术家们经常上传概念艺术或其他幕后故事。 我很期待什么时候, 谁能在代码方面做类似的事情。 当时虽然有点忙, 但是真的很喜欢项目中应用的创意。 我看到了那个喜欢窥探游戏背后故事的自己，进而产生了写一篇关于当时我的成果的更技术性的文章的想法。 一年后游戏完成, 我终于有时间坐下来以有趣的视角写一个简单的简介, 介绍有趣的视觉效果中包含哪些, 以及如何帮助形成我们游戏整体形象。
A screenshot from Lost in Random
…项目视角
Lost in Random有着非常特别的视觉风格。 为了达成这个目标, 投入了很多想法和努力。 我作为图形程序员第一次加入Zoink时, 游戏的视觉和环境已经相距很远。 我的工作是努力把我们所拥有的东西, 在目标平台上变成实际可执行的。 看着原本的构思, 快速推进工作是相当困难的事情。
通过这篇报道, 将提供对形成美学部分的知识并提升对相关工作的洞察力。 虽然有很多可以制造这种独特形态的元素, 但这里想要重点说的是使用彩色的雾。 虽然看起来是简单的效果,但是对整体造型有很大的影响。具体请看有雾效和无雾效的场景在引擎内的截屏。
有雾效和没有雾效的相同的场景
这个项目最初使用了 Unity 的 HDRP( High Definition Render Pipeline) 和内置的 Volumetric Fog 。 虽然这些功能渲染结果非常漂亮, 但不幸的是, 对多个目标平台的计算负担过重。 不出所料，最大的问题是任天堂Switch。 Switch是一个很好的平台。 作为玩家, 这可能是我最喜欢的游戏平台，但不幸的是，它不是最强大的机器。
几个月的时间里测试了多种选项，分析Unity渲染器的复杂性后，决定放弃HDRP，选择在所有平台上更简单、性能更优秀的URP（Universal Render Pipeline）。 虽然我们担心不太真实的光照, 但是实际上项目Leader因为单纯的光照更偏好漫画感的样子。 这当然意味着不能再使用HDRP的 Fog了。
起初试图将该雾移植到URP, 但事实证明, 相比它的价值反而问题更多。
结果我们对雾使用了两种不同的落地方案。 一个是大多数平台都在使用的 Volumetric fog 。 另一个是开发的用于Switch，运行速度比较快的画面空间解决方案。 有趣的是,我们在所有平台的序列中都使用该屏幕空间解决方案。
Volumetric Fog
在高端平台上使用的Volumetric fog是 Oniric Studio开发的 Aura 2的修改版本。
从技术角度来看， Aura 2asset与HDRP内置的asset非常相似，但发现按照我们的艺术家想要的方式进行配置对于他们来讲会更容易。所以需要做一些工作将其转换为 URP ，并添加一些我们认为缺少的功能。
为了将Aura 2转换为URP，我们创建了一个新的ScriptableRendererFeature，它调用Aura2代码并将结果blit到FrameBuffer(帧缓冲)。 Camera.onPreCull和Camera.onPreRender回调被转换为单纯的RenderPipelineManager.beginCameraRendering回调。 此外，我们还必须对着色器进行一些修改，以使透明对象与我们的雾相得益彰，因为它们不会写入深度缓冲区。
Aura2的最大变化是添加存在于HDRP的雾中的方向光衰减，使阳光越深越暗。 通过以下两个图像,可以确认使用或不使用该功能时不同的结果。
有或没有方向光衰减的雾气场景？（左侧无方向光衰减）
这个效果是我们最终对 Lit Lit Shader做出的许多小改动之一。
它是从 HDRP 的 LightEvaluation.hlsl中的高度衰减复制而来的，我将它移到了 URP 的 Lighting.hlsl 中。唯一需要的额外代码是让我们的雾体积管理器从所有当前活动的雾体积中收集和平均化光的消减参数。
Screen Space Fog
为了在多个平台上保持视觉风格, 并且可以在Switch上使用，同时足够快且得到看起来与预想的尽可能相似的雾效果。 在评估了众多现有解决方案后,我为Switch制作了特别的几何级数高度雾(Exponential Height Fog))。
这意味着它是一个屏幕空间解决方案，使用高度坐标来确定雾的颜色和密度的指数衰减。
给定一个雾密度和一个视距深度，雾颜色乘以 1.0 - exp(-depth * density)，这给了我们一个从 0.0 开始，距离 0.0 并且随着视距趋向无穷远而向 1.0 增长的因子。
雾由三层Layer组成: 上层、下层和天空盒层。
每层都有其独特的高度、颜色和密度。 任何远于相机规定距离且高于天空盒高度的物体都使用先前提到的应用于天空盒层的颜色的指数函数。 否则，我们将计算了穿过低和高的高度之间的视野深度部分，并使用它们来计算雾内的视野高度。 然后使用类似smoothstep(LowerHeight, UpperHeight, viewHeight)在低和高的高度之间进行逆Lerp，并将得到的值用作低层色和上层色之间的lerp线性参数。 这样在这两个值之间雾气会产生渐变色。
实际上有两种方法来计算视图的高度。 默认值取从相机位置穿过像素中心的长度深度的光线所达到的高度。 这意味着在低和高的高度之间的颜色渐变在大多数视野角度可以清楚地透过天空看到。 其他选项是计算光线通过的平均高度。 这提供了更柔和自然的形状。
因为无法确定在我们的艺术家想要的用到了什么选项, 所以添加了这两个。 想法是让他们测试两者并去掉”不对的”, 但经过彻底测试和比较后, 从艺术家那里得到了两个都需要的结论。
事实上，有些场景为了更具动态感，以结合了这两种的Fog volume结束。
三种模式
这种基于高度的解决方案的单个实例不足以接近我们想要的体积版本。为了获得更好的效果，我们在每个场景中组合了许多这些雾。我们的雾支持三种不同的模式，这些模式决定了它们何时何地被渲染。
Global– 只要用户未完全位于具有 RenderWhileInside 模式内，就进行渲染。用来形成场景的全局形状。这用于配置场景的整体外观。RenderWhileInside– 在外部不可见， 仅当相机位置在范围之内时渲染 。 用于重新定义较小区域的全局外观。PhysicalObject-渲染为box，主要用于形成一层穿过地面的雾。
通常场景使用一个或两个全局Fog Volume，以及大约12个使用RenderWhileInside或PhysicalObject模式的Volume。
屏幕空间雾还支持前面提到的光衰减。
这仅仅意味着我们向LitShader提供了与我们之前修改的Aura2版本相同的数据。 实际上，对雾Shader本身没有影响。 虽然多了几种信息（例如：光混合在雾的颜色中），但总的来说，它是一个简单的Shader，它只需要相机转换和渲染深度信息等。
旋涡般的乐趣
我最喜欢的雾的小功能是一个惊喜，是屏幕空间版本独有的。沿着穿过地面的雾体积的顶部，有一个动画贴图，一缕雾飘过。当第一次实现这些体积时，我添加了一个简单的噪点，使雾边缘有点模糊，而不是看起来像一个尖锐的盒子。我还对其进行了动画处理，以使噪点图案不那么明显。然后，应我们出色的环境艺术家 Leo Brynielsson 的要求，我替换掉了纹理贴图的噪点功能。我曾设想他只是想自己选择噪点函数，而不会要求我改代码。相反，他用它做到了以下这样：
Wisps of fog on the Switch version of Lost in Random.
Random Rules!
希望这个话题可以让你感兴趣，并对开发幕后的精彩工作有所了解。 这当然只是一个雾如何运作的概要。 关于性能，我有很多话要说。 但是那样的话讨论会相当长。 我很高兴能参与这个游戏。 希望大家能喜欢这个游戏。 Lost in Random将于2021年9月10日发布，用于PS4、PS5、Xbox One、Xbox系列X/S、PC和Switch。
译者注。
在翻译快结束时，找到了reddit相关话题。
Korean Version.
들여다보기..
Lost in Random을 개발하는 동안 우리 아티스트들은 종종 컨셉 아트나 다른 비하인드 스토리를 게시했습니다. 어떤 시점에서 누군가 코드 측면에서 비슷한 작업을 수행할 수 있는지 궁금해했습니다. 당시에는 상황이 조금 바빴지만 적용했던 아이디어가 정말 마음에 들었습니다.
제가 좋아하는 게임의 뒤를 엿보는 것을 좋아하는 저 자신을 보았기 때문입니다. 나는 그것에 보답하고 당시에 내 업적에 대해 조금 더 기술적인 글을 쓰고 싶었습니다. 1년 후 게임이 완성되고 마침내 나는 앉아서 특히 흥미로운 시각 효과에 무엇이 들어가고 그것이 우리 게임의 전반적인 모양을 형성하는 데 어떻게 도움이 되는지에 대한 흥미로운 시각을 제공하는 간단한 토픽을 작성할 시간을 갖게되었다.
…프로젝트 들여다보기
Lost in Random은 매우 특별한 비주얼 스타일을 가지고 있습니다. 그것을 달성하기 위해 많은 생각과 노력이 들어갔습니다. 내가 Zoink의 그래픽 프로그래머로 처음 합류했을 때 게임의 비주얼과 환경은 이미 꽤 멀리 떨어져 있었습니다. 내 일은 우리가 가지고 있는 것을 가져와서 목표 플랫폼에서 실제로 실행할 수 있는 것으로 만드는 데 도움이 되는 것이었습니다. 원래 구상했던 것을 보면서 작업을 충분히 빠르게 진행하는 것은 상당히 어려운 일이었습니다.
이 기사를 통해 이 미학을 형성하는 부분과 이에 관련된 작업에 대한 통찰력을 제공하고자 합니다. 이 독특한 모양을 만드는 많은 요소들이 있지만 여기서 이야기하고 싶은 것은 다채로운 안개의 사용입니다. 단순한 효과처럼 보일 수 있지만 전체 룩에 큰 영향을 미칩니다. 내 말을 이해하려면 안개가 활성화된 상태와 활성화되지 않은 상태에서 엔진 내에서 캡처된 이 스크린샷을 보십시오.
처음에 이 프로젝트는 Unity의 HDRP(High Definition Render Pipeline)와 내장된 Volumetric Fog를 사용했습니다. 그 기능들은 매우 멋지게 렌더링 되었지만 불행히도 여러 대상 플랫폼에 대해 너무 많은 계산 부담이 있음이 입증되었습니다. 예상대로 가장 큰 문제는 닌텐도 스위치였다. Switch는 훌륭한 플랫폼입니다. 게이머로서 아마도 내가 가장 좋아하는 게임일 것입니다. 불행히도 가장 강력한 기계는 아닙니다.
몇 달 동안 다양한 옵션을 테스트하고 Unity 렌더러의 복잡성을 분석 한 후, 모든 플랫폼에서 더 간단하고 성능이 우수한 URP(Universal Render Pipeline)를 위해 HDRP를 포기하는 방식으로 결정했습니다. 우리는 덜 사실적인 조명에 대해 걱정했지만 프로젝트 리더는 실제로 단순화된 조명으로 인해 더 만화 같은 모습을 선호했습니다. 이것은 물론 더 이상 HDRP 포그를 사용 할 수 없음을 의미했습니다.
처음에는 이 포그를 URP로 이식하려고 시도했지만 그것이 주는 가치 보다 더 많은 문제가 있음이 판명되었습니다.
결국 우리는 안개에 대해 두 가지 다른 구현을 사용했습니다. 대부분의 플랫폼에서 사용되는 Volumetric fog 가 있습니다. 다른 하나는 스위치용으로 충분히 빠르도록 개발된 화면 공간 솔루션입니다. 흥미롭게도 우리는 모든 플랫폼의 시퀀스에서 이 화면 공간 솔루션을 사용하고 있습니다.
Volumetric Fog
고급 플랫폼에서 사용되는 볼류메트릭 포그는 Oniric Studio에서 개발한 자산인 Aura 2의 수정된 버전입니다.
Aura2 에셋은 기술적인 관점에서 HDRP에 내장된 에셋과 매우 유사하지만 아티스트는 원하는 방식으로 구성하는 것이 더 쉽다는 것을 알게 되었습니다. 누락된 몇 가지 기능을 추가하려면 몇 가지 작업을 추가 하여 URP로 파이프라인용으로 변환 하였다.
Aura 2를 URP로 변환하기 위해 Aura2 코드를 호출하고 결과를 프레임 버퍼로 blit하는 새로운 ScriptableRendererFeature를 만들었습니다. Camera.onPreCull 및 Camera.onPreRender콜백은 단순히 RenderPipelineManager.beginCameraRendering 콜백으로 변환되었습니다. 또한 투명 개체는 깊이 버퍼에 쓰지 않기 때문에 안개와 잘 어울리는 셰이더를 수정해야 했습니다.
Aura 2의 가장 큰 변경 사항은 HDRP 안개에 존재하는 방향성 빛 감쇠를 추가하여 깊은 안개로 내려갈수록 햇빛을 어둡게 만드는 것입니다.
아래 두 개의 이미지를 통해 그 기능을 사용하거나 사용하지 않을 때의 결과를 확인할 수 있다.
이 효과는 우리가 Lit 셰이더에 적용한 많은 작은 변경 사항 중 하나입니다. HDRP의 LightEvaluation.hlsl에 있는 높이 감쇠에서 복사하여 URP의 Lighting.hlsl로 옮겼습니다. 필요한 유일한 추가 코드는 포그 볼륨 관리자가 현재 활성화된 모든 포그 볼륨에서 소멸 매개변수를 수집하고 평균화하는 것입니다.
Screen Space Fog
여러 플랫폼에서 시각적 스타일을 유지하기 위해 스위치에서 사용할 수 있을 만큼 충분히 빠르면서도 예상한 것과 최대한 비슷하게 보이는 안개가 필요했습니다. 수많은 기존 솔루션을 평가한 후 나는 스위치를 위해 특별히 의미하는 기하급수적인 높이 안개(Exponential Height Fog)를 작성하게 되었습니다.
이것이 의미하는 바는 높이 좌표를 사용하여 안개 색상과 밀도에 대한 지수 감소를 결정하는 화면 공간 솔루션이라는 것입니다. 안개 밀도와 보기 거리에 대한 깊이가 주어지면 안개 색상에 1.0 - exp(-depth * density)를 곱하여 거리 0.0에서 시작하여 보기 거리가 무한대로 갈수록 1.0으로 증가하는 계수를 제공합니다.
안개는 하위 레이어, 상위 레이어 및 스카이박스 레이어의 세 가지 레이어로 구성됩니다. 각 레이어에는 고유한 높이, 색상 및 밀도가 있습니다. 카메라에서 지정된 거리 이상이고 스카이박스 높이보다 높은 모든 것은 스카이박스 레이어의 색상에 적용된 이전에 언급한 지수 함수를 사용합니다. 그렇지 않으면 우리는 낮은 높이와 높은 높이 사이를 가로지르는 시야 깊이 부분을 계산하고 그것을 사용하여 안개 내부의 시야 높이를 계산합니다. 그런 다음 smoothstep(LowerHeight, UpperHeight, viewHeight)과 유사한 것을 사용하여 낮은 높이와 높은 높이 사이에서 역 lerp를 수행하고 결과 값을 낮은 색과 위쪽 색상 사이의 lerp 매개변수로 사용합니다. 이렇게 하면 이 두 값 사이에 안개가 그라디언트됩니다.
실제로 뷰 높이를 계산하는 두 가지 방법이 있습니다. 기본값은 단순히 카메라 위치에서 픽셀 중심을 통과하는 길이 깊이의 광선을 따라 도달한 높이를 취합니다. 이는 낮은 높이와 높은 높이 사이의 색상 그라디언트가 대부분의 시야각에서 하늘을 가로질러 명확하게 볼 수 있음을 의미합니다. 다른 옵션은 광선이 통과하는 평균 높이를 계산하는 것입니다. 이것은 더 부드러운 모양을 제공합니다.
우리 아티스트가 원하는 것을 설명할 때 어떤 옵션을 의미했는지 확신할 수 없었기 때문에 이 두 가지를 추가했습니다. 아이디어는 그들이 둘 다 테스트하고 “잘못된”것을 제거하도록하는 것이 었지만 철저히 테스트되고 비교된 후에 아티스트들로부터 둘 다 필요하다는 정보를 받았습니다.
사실, 일부 장면은 더 역동적인 모습을 위해 이 두 가지를 결합한 안개 볼륨으로 끝나기도 했습니다.
3가지 모드
이 높이 기반 솔루션의 단일 인스턴스는 우리가 원하는 체적 버전에 가까워지기에 충분하지 않았습니다. 더 나은 결과를 얻기 위해 모든 장면에서 이러한 안개를 결합합니다. 안개는 렌더링 시기와 위치를 결정하는 세 가지 모드를 지원합니다.
Global– 사용자가 모드가 있는 볼륨 안에 완전히 있지 않은 한 렌더링합니다. 이것은 장면의 전체 모양을 구성하는 데 사용됩니다.RenderWhileInside– 외부에서는 보이지 않으며 카메라 위치가 범위 내에 있을 때만 렌더링됩니다. 더 작은 영역에 대한 전역 모양을 재정의하는 데 사용됩니다.PhysicalObject–box로 렌더링되며 주로 지면을 가로질러 흐르는 안개 레이어를 형성하는 데 사용됩니다.
일반적인 장면은 하나 또는 두 개의 글로벌 포그 볼륨과 RenderWhileInside 또는 PhysicalObject 모드를 사용하는 약 12개의 볼륨을 사용합니다.
화면 공간 안개는 앞서 언급한 빛 감쇠도 지원합니다. 이것은 단순히 앞서 언급한 우리가 수정한 Aura 2 버전과 동일한 데이터를 Lit 셰이더에 제공한다는 것을 의미합니다. 실제로 안개 셰이더 자체에는 영향을 미치지 않습니다. 몇 가지 더 많은 정보(예: 햇빛이 안개 색상에 혼합되는 방식)가 있지만 전반적으로 카메라 변환 및 렌더 깊이 정보등만이 필요한 간단한 셰이더입니다.
소용돌이 재미
내가 가장 좋아하는 작은 안개 기능은 행복한 놀라움이었고 실제로 화면 공간 버전에만 있습니다. 지면을 가로질러 흐르는 안개 볼륨의 상단을 따라 안개가 흩날리는 애니메이션 텍스처가 있습니다. 이 볼륨을 처음 구현할 때 날카로운 상자처럼 보이는 대신 안개 가장자리를 약간 흐릿하게 만들기 위해 간단한 노이즈를 추가했습니다. 또한 노이즈의 패턴을 덜 눈에 띄게 만들기 위해 애니메이션을 만들었습니다. 그런 다음 우리의 놀라운 환경 아티스트 Leo Brynielsson의 요청에 따라 텍스처에 대한 노이즈 기능을 교체했습니다. 나는 그가 나에게 코드를 변경하도록 요구하지 않고 자신의 노이즈 함수를 선택하기를 원할 것이라고 상상했습니다. 대신 그는 그것을 사용하여 다음과 같이 만들었습니다.
Wisps of fog on the Switch version of Lost in Random.
Random Rules!
이 토픽이 당신에게 흥미로웠기를 바라며 개발 뒷편에서 진행되는 멋진 구현에 대해 약간의 감사를 표하기를 바랍니다. 이것은 물론 안개가 어떻게 작동하는지에 대한 개요일 뿐입니다. 특히 성능과 관련하여 할 말이 많습니다. 그러나 그렇게 하면 토론이 상당히 길어질 것입니다. 이 게임에 참여하게 되어 매우 기쁩니다. 많은 분들이 이 게임을 즐기시기 바랍니다. Lost in Random은 2021년 9월 10일 PS4, PS5, Xbox One, Xbox 시리즈 X/S, PC 및 Switch용으로 출시됩니다.
역자 주.
번역을 마칠 무렵 관련 된 reddit 토픽을 찾았다.