Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
SKYFORGE: Технологии рендеринга 
Сергей Макеев, технический директор
План 
! Что такое Skyforge? 
! Графические технологии, использованные при 
разработке графического движка Skyforge 
! Phys...
Skyforge для программиста 
! Fantasy + Sci-fi 
! Свой движок 
! Nextgen графика в MMO 
! Стилизованная реальность 
! Огром...
Physically Based Shading
Зачем ? 
! Зачем нужен шейдинг, основанный на физике? 
! Более реалистичная и сведенная картинка – меньше 
настраивать 
! ...
Физика процесса 
! В реальной жизни поверхность не гладкая 
! Поверхность объектов состоит из множества маленьких 
неровно...
Бумага под электронным микроскопом
Бумага под электронным микроскопом
Микрогеометрия поверхности 
! Часть света отражается от поверхности 
! Часть проникает внутрь поверхности и 
переизлучаетс...
Микрогеометрия поверхности 
! Мы оперируем на уровне пикселей 
! Нужно учитывать отраженный и переизлученный свет
BRDF 
! BRDF 
! Bidirectional 
! Reflection 
! Distribution 
! Function 
! Цель: рассчитать количество энергии, излучаемой...
Рассеянный свет (diffuse) 
! Можно пренебречь точкой входа и выхода луча 
! Считаем, что весь рассеянный свет 
распределяе...
Рассеянный свет (diffuse) 
! Функция для расчета рассеянного света 
! l – направление света 
! v – направление взгляда (не...
Рассеянный свет (diffuse) 
! Площадь проекции зависит от угла падения 
! И равна cos(N, L)
Рассеянный свет (diffuse) 
! На поверхность попадает меньше энергии в 
зависимости от угла падения
Отраженный свет (specular) 
! Отражение света 
! Направление отражения меняется 
из-за микрограней
Отраженный свет (specular) 
! Отражение света 
! Менее гладкая поверхность
Микрогеометрия поверхности 
! Microfacet theory 
! Моделирует поверхность как множество 
микрограней 
! Каждая микрогрань ...
Microfacet BRDF 
! Функция для расчета отраженного света (microfacet theory) 
! D – функция распределения нормали. Определ...
Half vector 
! Half vector, вектор между L и V 
! Физический смысл half vector 
! Фильтрация микрограней, которые вносят в...
Microfacet BRDF 
! Функция для расчета отраженного света (microfacet theory) 
! D – функция распределения нормали. Определ...
Распределение микрограней 
! Степень косинуса в качестве функции 
распределения микрограней (Blinn-Phong) 
! Степень 0.25 ...
Microfacet BRDF 
! Функция для расчета отраженного света (microfacet theory) 
! D – функция распределения нормали. Определ...
Френель 
!ло
Френель
Френель 
! Аппроксимация Шлика 
! f0 – можно получить из IOR (Index of refraction)
Френель 
! Френель: задает, сколько света будет поглощено, а сколько 
отражено под разными углами 
! Физический смысл f0: ...
Microfacet BRDF 
! Функция для расчета отраженного света (microfacet theory) 
! D – функция распределения нормали. Определ...
Microfacet BRDF 
! Пример того, какая часть света скрывается микрогранями
Видимость микрограней 
! Используем простейшую функцию видимости
Отраженный свет (specular) 
! Функция отраженного света 
! Соответствует normalized Blinn-Phong model
Изменение параметров 
! Изменение F0 ( IOR ) 
! Изменение шероховатости
Сохранение энергии 
! Закон сохранения энергии 
! Количество отраженного света <= 1 
! Т.е. рассеянный + отраженный свет <...
Шероховатость 100%
Шероховатость 80%
Шероховатость 50%
Шероховатость 30%
Шероховатость 10%
Интенсивность света 
! Интенсивность света обратно пропорциональна квадрату 
расстояния до источника света 
! Хорошо подхо...
Интенсивность света 
! Нужно учесть два радиуса 
! Rinner – размер источника 
! Router – дистанция, на которой вкладом в о...
Интенсивность света 
! Наша функция затухания 
! Константа внутри Rinner 
! На дистанции Router равна 0 
float GetAttenuat...
Интенсивность света 
! График затухания света
Модель материала 
! Модель материала 
! Base color 
! Albedo для диэлектрика 
! Векторная часть F0 для проводника 
! Norma...
Base color ( Albedo )
Base color ( Albedo )
Normal map
Gloss (Roughness)
Specular ( F0 / IOR )
Metal
Пример материала
Пример материала
Пример материала
Пример материала
Пример материала
Пример материала
Deferred Shading
Deferred shading 
! Плюсы 
! Геометрия отделена от освещения 
! Много источников света 
! Нет комбинаторного взрыва в шейд...
Deferred shading 
! Skyforge Gbuffer layout (2xRGBA8, 1xRGB10A2, 1xD24S8) 
! 96 bits + 24 bits + 8 bits = 128 bits per pix...
Финальный результат
Base color
Нормали (world space)
Шероховатость
Fresnel reflectance (F0)
Metallic
HDR: Global Illumination + Emissive
Ambient occlusion
Без локального освещения и волюметриков
Финальный результат
Tips & Tricks
Реконструкция позиции 
! Алгоритмам освещения нужна позиция 
! world space 
! shadow space 
! view space 
! и т.д. 
! В Gb...
Реконструкция позиции 
! Преобразуем depth буфер в линейный 
! INTZ в R32F 
! Сразу после заполнения Gbuffer 
// Функция д...
Подобие треугольников 
! Треугольник P1, P2, P3 
подобен треугольнику P1, P4, P5
Подобие треугольников 
! Треугольник P1, P2, P3
Подобие треугольников 
! Треугольник P1, P4, P5
Реконструкция позиции 
! Вершинный шейдер 
! Считаем треугольник P1, P2, P3 в вершинном шейдере 
! Передаем отрезок P1, P3...
Reversed Depth Buffer
Большая дальность видимости
Большая дальность видимости
Большая дальность видимости
Большая дальность видимости
Reversed Depth Buffer 
! Reversed depth buffer 
near = 1 
far = 0 
! Работает с fixed point depth, формат D24S8 
! Нужно и...
Матрица проекции
Матрица проекции 
! Как получается глубина? 
! float4 p = mul( float4( pos, 1 ), mtxProjection ); 
! float depth = p.z / p...
Сравнение методов 
! Z near = 0.5 
! Z far = 50000.0
Сравнение методов 
! Стандартный метод 
! Reversed depth buffer
Сравнение методов 
! Стандартный метод 
! Reversed depth buffer
Numeric error – стандартный метод
Numeric error – reversed depth buffer
Numeric error – reversed depth buffer
Reversed depth buffer : выводы 
! D24 легко покрывает дальность в 50 км 
! Reverse depth подходит для любого движка 
! Луч...
Заключение 
! Nextgen графика в MMO уже реальность 
! Все меньше отличий от 
ААА консольных тайтлов 
! Физичный шейдинг уп...
СПАСИБО ЗА ВНИМАНИЕ! 
ВОПРОСЫ? 
s.makeev@corp.mail.ru
Bonus
Реконструкция позиции: Vertex shader 
// Часть матрицы проекции 
float tanHalfVerticalFov; // invProjection.11; 
float tan...
Реконструкция позиции: Pixel shader 
// Позиция камеры в пространстве реконструкции 
float3 camPosition; 
float4 PixelShad...
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Skyforge rendering tech (KRI 2014)
Upcoming SlideShare
Loading in …5
×

Skyforge rendering tech (KRI 2014)

2,952 views

Published on

Published in: Technology
  • Be the first to comment

Skyforge rendering tech (KRI 2014)

  1. 1. SKYFORGE: Технологии рендеринга Сергей Макеев, технический директор
  2. 2. План ! Что такое Skyforge? ! Графические технологии, использованные при разработке графического движка Skyforge ! Physically Based Shading ! Deferred Shading ! Reversed Depth buffer ! Выводы ! Q&A
  3. 3. Skyforge для программиста ! Fantasy + Sci-fi ! Свой движок ! Nextgen графика в MMO ! Стилизованная реальность ! Огромные открытые локации ! Материалы и освещение максимально естественны ! 4 графических программиста
  4. 4. Physically Based Shading
  5. 5. Зачем ? ! Зачем нужен шейдинг, основанный на физике? ! Более реалистичная и сведенная картинка – меньше настраивать ! Материалы и свет разделены – меньше настраивать ! Меньше параметров в материале – меньше настраивать ! Соблюдается закон сохранения энергии – меньше настраивать ! Физически корректно не значит фотореалистично (см. работы Disney, Pixar и т.д.)
  6. 6. Физика процесса ! В реальной жизни поверхность не гладкая ! Поверхность объектов состоит из множества маленьких неровностей. Эти неровности настолько маленькие, что не видны невооруженным глазом ! Размер микронеровностей больше длины волны и они влияют на отражение света от поверхности
  7. 7. Бумага под электронным микроскопом
  8. 8. Бумага под электронным микроскопом
  9. 9. Микрогеометрия поверхности ! Часть света отражается от поверхности ! Часть проникает внутрь поверхности и переизлучается или поглощается
  10. 10. Микрогеометрия поверхности ! Мы оперируем на уровне пикселей ! Нужно учитывать отраженный и переизлученный свет
  11. 11. BRDF ! BRDF ! Bidirectional ! Reflection ! Distribution ! Function ! Цель: рассчитать количество энергии, излучаемой в сторону наблюдателя, при заданном входящем излучении ! В теории, многомерная функция - 3D, 4D, 6D ! На практике, мы будем рассматривать функцию от двух параметров
  12. 12. Рассеянный свет (diffuse) ! Можно пренебречь точкой входа и выхода луча ! Считаем, что весь рассеянный свет распределяется равномерно
  13. 13. Рассеянный свет (diffuse) ! Функция для расчета рассеянного света ! l – направление света ! v – направление взгляда (не используется в данной модели) ! albedo – векторный параметр, который определяет сколько энергии рассеивается, а сколько поглощается материалом ! n – нормаль поверхности ! Деление на PI закон сохранения энергии ! Всем известный dot ( N, L ) ! dot ( N, L ) это cos между векторами N, L
  14. 14. Рассеянный свет (diffuse) ! Площадь проекции зависит от угла падения ! И равна cos(N, L)
  15. 15. Рассеянный свет (diffuse) ! На поверхность попадает меньше энергии в зависимости от угла падения
  16. 16. Отраженный свет (specular) ! Отражение света ! Направление отражения меняется из-за микрограней
  17. 17. Отраженный свет (specular) ! Отражение света ! Менее гладкая поверхность
  18. 18. Микрогеометрия поверхности ! Microfacet theory ! Моделирует поверхность как множество микрограней ! Каждая микрогрань - идеально отражающее зеркало ! Нам нужна сумма вклада каждой микрограни в освещение (интеграл) ! Слишком много вычислений, чтобы решить численно
  19. 19. Microfacet BRDF ! Функция для расчета отраженного света (microfacet theory) ! D – функция распределения нормали. Определяет, как микрограни распределены вдоль направления h (от этой функции меняется форма блика) ! F – формула Френеля ! G – функция затенения микрогранями друг друга ! l – направление света ! v – направление взгляда ! n – нормаль поверхности ! h – вектор между векторами l and v (half vector)
  20. 20. Half vector ! Half vector, вектор между L и V ! Физический смысл half vector ! Фильтрация микрограней, которые вносят вклад в BRDF ! h = m значит микрогрань отражает свет, видимый наблюдателю
  21. 21. Microfacet BRDF ! Функция для расчета отраженного света (microfacet theory) ! D – функция распределения нормали. Определяет, как микрограни распределены вдоль направления h (от этой функции меняется форма блика) ! F – формула Френеля ! G – функция затенения микрогранями друг друга ! l – направление света ! v – направление взгляда ! n – нормаль поверхности ! h – вектор между векторами l and v (half vector)
  22. 22. Распределение микрограней ! Степень косинуса в качестве функции распределения микрограней (Blinn-Phong) ! Степень 0.25 .. 65536
  23. 23. Microfacet BRDF ! Функция для расчета отраженного света (microfacet theory) ! D – функция распределения нормали. Определяет, как микрограни распределены вдоль направления h (от этой функции меняется форма блика) ! F – формула Френеля ! G – функция затенения микрогранями друг друга ! l – направление света ! v – направление взгляда ! n – нормаль поверхности ! h – вектор между векторами l and v (half vector)
  24. 24. Френель !ло
  25. 25. Френель
  26. 26. Френель ! Аппроксимация Шлика ! f0 – можно получить из IOR (Index of refraction)
  27. 27. Френель ! Френель: задает, сколько света будет поглощено, а сколько отражено под разными углами ! Физический смысл f0: процент света, отраженный от материала под прямым углом ! Обычное значение f0 для диэлектриков 2% - 5% ! Металлы рассеивают мало света, в основном отражают
  28. 28. Microfacet BRDF ! Функция для расчета отраженного света (microfacet theory) ! D – функция распределения нормали. Определяет, как микрограни распределены вдоль направления h (от этой функции меняется форма блика) ! F – формула Френеля ! G – функция затенения микрогранями друг друга ! l – направление света ! v – направление взгляда ! n – нормаль поверхности ! h – вектор между векторами l and v (half vector)
  29. 29. Microfacet BRDF ! Пример того, какая часть света скрывается микрогранями
  30. 30. Видимость микрограней ! Используем простейшую функцию видимости
  31. 31. Отраженный свет (specular) ! Функция отраженного света ! Соответствует normalized Blinn-Phong model
  32. 32. Изменение параметров ! Изменение F0 ( IOR ) ! Изменение шероховатости
  33. 33. Сохранение энергии ! Закон сохранения энергии ! Количество отраженного света <= 1 ! Т.е. рассеянный + отраженный свет <= 1 ! Из этого следует: яркость и площадь блика от источника света связаны
  34. 34. Шероховатость 100%
  35. 35. Шероховатость 80%
  36. 36. Шероховатость 50%
  37. 37. Шероховатость 30%
  38. 38. Шероховатость 10%
  39. 39. Интенсивность света ! Интенсивность света обратно пропорциональна квадрату расстояния до источника света ! Хорошо подходит для точечных источников, не имеющих объема ! Мы хотим источник света, у которого есть размер (area light) ! Стремится к нулю, но никогда его не достигает
  40. 40. Интенсивность света ! Нужно учесть два радиуса ! Rinner – размер источника ! Router – дистанция, на которой вкладом в освещение можно пренебречь
  41. 41. Интенсивность света ! Наша функция затухания ! Константа внутри Rinner ! На дистанции Router равна 0 float GetAttenuation(float distance, float lightInnerR, float invLightOuterR) { float d = max(distance, lightInnerR); return saturate(1.0 - pow(d * invLightOuterR, 4.0)) / (d * d + 1.0); }
  42. 42. Интенсивность света ! График затухания света
  43. 43. Модель материала ! Модель материала ! Base color ! Albedo для диэлектрика ! Векторная часть F0 для проводника ! Normal (нормаль поверхности, макро) ! Roughness (шероховатость поверхности, микро) ! Fresnel F0 (практически всегда константа для диэлектрика, скалярная часть F0 для металла) ! Metal (маска: металл или диэлектрик)
  44. 44. Base color ( Albedo )
  45. 45. Base color ( Albedo )
  46. 46. Normal map
  47. 47. Gloss (Roughness)
  48. 48. Specular ( F0 / IOR )
  49. 49. Metal
  50. 50. Пример материала
  51. 51. Пример материала
  52. 52. Пример материала
  53. 53. Пример материала
  54. 54. Пример материала
  55. 55. Пример материала
  56. 56. Deferred Shading
  57. 57. Deferred shading ! Плюсы ! Геометрия отделена от освещения ! Много источников света ! Нет комбинаторного взрыва в шейдерах ! Минусы ! Bandwidth ! Источники света с тенями по-прежнему дорогие ! Сложность с разными BRDF ! Поддержка прозрачности
  58. 58. Deferred shading ! Skyforge Gbuffer layout (2xRGBA8, 1xRGB10A2, 1xD24S8) ! 96 bits + 24 bits + 8 bits = 128 bits per pixel
  59. 59. Финальный результат
  60. 60. Base color
  61. 61. Нормали (world space)
  62. 62. Шероховатость
  63. 63. Fresnel reflectance (F0)
  64. 64. Metallic
  65. 65. HDR: Global Illumination + Emissive
  66. 66. Ambient occlusion
  67. 67. Без локального освещения и волюметриков
  68. 68. Финальный результат
  69. 69. Tips & Tricks
  70. 70. Реконструкция позиции ! Алгоритмам освещения нужна позиция ! world space ! shadow space ! view space ! и т.д. ! В Gbuffer хранится только глубина ! используем INTZ (DX9) ! гиперболическое распределение " ! Нужна реконструкция позиции из глубины
  71. 71. Реконструкция позиции ! Преобразуем depth буфер в линейный ! INTZ в R32F ! Сразу после заполнения Gbuffer // Функция для преобразования глубины с гиперболическим распределением в линейную float ConvertHyperbolicDepthToLinear(float hyperbolicDepth) { return ((zNear / (zNear-zFar)) * zFar) / (hyperbolicDepth - (zFar / (zFar-zNear))); }
  72. 72. Подобие треугольников ! Треугольник P1, P2, P3 подобен треугольнику P1, P4, P5
  73. 73. Подобие треугольников ! Треугольник P1, P2, P3
  74. 74. Подобие треугольников ! Треугольник P1, P4, P5
  75. 75. Реконструкция позиции ! Вершинный шейдер ! Считаем треугольник P1, P2, P3 в вершинном шейдере ! Передаем отрезок P1, P3 в пиксельный шейдер ! Пиксельный шейдер ! Получаем интерполированный вектор P1,P3 (rayDir) через интерполятор ! Считываем линейную глубину ! position = cameraPosition + rayDir * linearDepth ! Очень быстро: mad + интерполятор ! Можно реконструировать позицию в любом удобном пространстве. world, view, shadow и т.д. ! HLSL код в бонус слайдах
  76. 76. Reversed Depth Buffer
  77. 77. Большая дальность видимости
  78. 78. Большая дальность видимости
  79. 79. Большая дальность видимости
  80. 80. Большая дальность видимости
  81. 81. Reversed Depth Buffer ! Reversed depth buffer near = 1 far = 0 ! Работает с fixed point depth, формат D24S8 ! Нужно инвертировать D3DRS_ZFUNC D3DCMP_GREATEREQUAL ! Всегда инвертируйте матрицу проекции Некорректно инвертировать на стадии viewport’а или в шейдере
  82. 82. Матрица проекции
  83. 83. Матрица проекции ! Как получается глубина? ! float4 p = mul( float4( pos, 1 ), mtxProjection ); ! float depth = p.z / p.w;
  84. 84. Сравнение методов ! Z near = 0.5 ! Z far = 50000.0
  85. 85. Сравнение методов ! Стандартный метод ! Reversed depth buffer
  86. 86. Сравнение методов ! Стандартный метод ! Reversed depth buffer
  87. 87. Numeric error – стандартный метод
  88. 88. Numeric error – reversed depth buffer
  89. 89. Numeric error – reversed depth buffer
  90. 90. Reversed depth buffer : выводы ! D24 легко покрывает дальность в 50 км ! Reverse depth подходит для любого движка ! Лучше закладывать с самого начала проекта ! Извлечение плоскостей фрустума из матрицы ! Bias у теней ! и т.д. ! При возможности используйте float depth буфер
  91. 91. Заключение ! Nextgen графика в MMO уже реальность ! Все меньше отличий от ААА консольных тайтлов ! Физичный шейдинг упрощает производство контента ! Нам нужны графические программисты !
  92. 92. СПАСИБО ЗА ВНИМАНИЕ! ВОПРОСЫ? s.makeev@corp.mail.ru
  93. 93. Bonus
  94. 94. Реконструкция позиции: Vertex shader // Часть матрицы проекции float tanHalfVerticalFov; // invProjection.11; float tanHalfHorizontalFov; // invProjection.00; // Базис камеры в пространстве реконструкции float3 camBasisUp; float3 camBasisSide; float3 camBasisFront; // postProjectiveSpacePosition в homogeneous projection space float3 CreateRay(float4 postProjectiveSpacePosition) { float3 leftRight = camBasisSide * -postProjectiveSpacePosition.x * tanHalfHorizontalFov; float3 upDown = camBasisUp * postProjectiveSpacePosition.y * tanHalfVerticalFov; float3 forward = camBasisFront; return (forward + leftRight + upDown); } void VertexShader(float4 inPos, out float4 outPos : POSITION, out float3 rayDir : TEXCOORD0) { outPos = inPos; rayDir = CreateRay(inPos); }
  95. 95. Реконструкция позиции: Pixel shader // Позиция камеры в пространстве реконструкции float3 camPosition; float4 PixelShader(float3 rayDir : TEXCOORD0) : COLOR0 { ... float linearDepth = tex2D(linearDepthSampler, uv).r; float3 position = camPosition + rayDir * linearDepth; ... } // Функция для преобразования глубины с гиперболическим распределением в линейную float ConvertHyperbolicDepthToLinear(float hyperbolicDepth) { return ((zNear / (zNear-zFar)) * zFar) / (hyperbolicDepth - (zFar / (zFar-zNear))); }

×