Математика в Gamedev по-простому
الذهاب إلى القناة على Telegram
Как на самом деле работают стрельба, толпа NPC, графика, физика тканей и свет в играх. Разборы на пальцах, рабочий код, интерактивы. dev-math.ru Сотрудничество: @it_bizdev
إظهار المزيد529
المشتركون
+124 ساعات
+87 أيام
+3130 أيام
جاري تحميل البيانات...
القنوات المماثلة
لا توجد بيانات
هل تواجه مشاكل؟ يرجى تحديث الصفحة أو الاتصال بمدير الدعم الخاص بنا.
سحابة العلامات
الإشارات الواردة والصادرة
---
---
---
---
---
---
جذب المشتركين
أغسطس '26
أغسطس '26
+45
في 1 قنوات
يوليو '26
+59
في 2 قنوات
Get PRO
يونيو '26
+90
في 1 قنوات
Get PRO
مايو '26
+369
في 3 قنوات
Get PRO
أبريل '260
في 4 قنوات
Get PRO
مارس '26
+8
في 1 قنوات
| التاريخ | نمو المشتركين | الإشارات | القنوات | |
| 26 أغسطس | +1 | |||
| 25 أغسطس | +8 | |||
| 24 أغسطس | 0 | |||
| 23 أغسطس | 0 | |||
| 22 أغسطس | +1 | |||
| 21 أغسطس | +3 | |||
| 20 أغسطس | +1 | |||
| 19 أغسطس | 0 | |||
| 18 أغسطس | +2 | |||
| 17 أغسطس | +2 | |||
| 16 أغسطس | 0 | |||
| 15 أغسطس | +3 | |||
| 14 أغسطس | +5 | |||
| 13 أغسطس | +2 | |||
| 12 أغسطس | +2 | |||
| 11 أغسطس | +1 | |||
| 10 أغسطس | +3 | |||
| 09 أغسطس | +2 | |||
| 08 أغسطس | +1 | |||
| 07 أغسطس | +1 | |||
| 06 أغسطس | 0 | |||
| 05 أغسطس | +4 | |||
| 04 أغسطس | 0 | |||
| 03 أغسطس | 0 | |||
| 02 أغسطس | +1 | |||
| 01 أغسطس | +2 |
منشورات القناة
Что такое DrawCall
https://youtube.com/shorts/pnscoCR3lYY?si=BW8UFeLrGyWo4T6J
Так как каждую статью читать минимум час — решил нарезать тезисы и интересные факты статей на отдельные видосы с инфографиками. Чтобы те же темы можно было изучить в более простом формате с инфографиками. И вот первая проба пера.
Видеокарта в вашем кадре может вообще ничего не делать — а в игре слайдшоу.
По сути draw call — это команда «нарисуй вот этот меш вот этим материалом». Рисует видеокарта, а выписывает её процессор: собрать состояние, отдать драйверу на проверку и перевод, положить в очередь.
#геймдев #рендеринг #оптимизация #drawcall #devmath
| 2 |  Поменяйте местами два полупрозрачных слоя — итоговый цвет изменится
Возьмите любой редактор со слоями: два цветных слоя, обоим опустите непрозрачность до половины, наложите один на другой. Теперь поменяйте их местами. Перекрытие сменило цвет. Слои те же, прозрачность та же. С непрозрачными слоями так и должно быть: кто сверху, того и видно. Но полупрозрачные обещают симметрию — смешали же пополам? Вот пополам и не получилось.
Дело в том, что смешивание — не усреднение, а делёж пикселя по очереди. Прозрачность слоя — на самом деле его доля: какая часть пикселя им накрыта. Верхний слой забирает свою долю целиком, нижнему достаётся его доля от остатка: оба просили половину, но верхнему ушла половина пикселя, а нижнему — половина оставшегося, четверть. Несимметрично по построению, какие доли ни выставляй. Эту арифметику формализовали Томас Портер и Том Дафф в 1984-м: оператор over, и он прячется за словом «прозрачность» почти везде — слои редактора, плашки интерфейсов, стекло и дым в играх.
Собственно, вывод: у прозрачности есть и важен порядок наложения. В редакторе порядок задаёт панель слоёв. В игре панели нет: «сверху» оказывается тот, кто нарисован позже, — и порядок отрисовки начинает менять картинку. Что движок делает, чтобы очередь совпала с глубиной сцены, и что видно в кадре, когда они разошлись, — разберём в пятницу.
Присмотритесь к спрайту дыма или кусту на светлом небе: по краю часто идёт тонкая тёмная кайма — цвет, которого нет ни в текстуре, ни в сцене, и чем дальше объект от камеры, тем она заметнее. Откуда при смешивании двух цветов берётся третий?
#devmath #графика #математика #рендер #прозрачность #gamedev | 284 |
| 3 |  Coyote Time
Чтож. Начнем писать заметки по самой заголосованной теме. И начнём с моего любимого термина.
Математика математикой, а в творчестве всегда есть место магии. И время койота — это одна из моих любимых «магических техник». Наверное даже больше из-за названия и так как мне в Looney Tunes всегда нравился этот персонаж. И как иллюстрация, что не всё делается формулами, иногда для правильной эмоции у игрока надо добавить немного «магии».
Coyote Time — это окно в несколько кадров после того, как персонаж сошел с платформы в течении которого он всё ещё может прыгнуть.
Все дело в том, что игрок прыгает не когда видит край платформы, а когда «собирается с неё спрыгнуть». Между намерением и срабатыванием прыжка есть окно состоящее из: реакции человека, отправки сигнала клавиатуры, время пока отрисуется кадр и тому подобное. Когда игрок жмет прыжок, но при этом падает вниз — это ощущается как проблема с управлением. Тут и спасает время койота.
Причём это константа зависит как от устройства ввода (клавиатура, тач, геймпад), так и от свойств геймплея вроде скорости персонажа. Поэтому подбирается оно для игры в ручную.
#devmath #математика #геймдизайн #платформеры #gamefeel | 209 |
| 4 | Чего не хватает каналу? | 219 |
| 5 |  Почему тень зубчатая и грязная
https://dev-math.ru/articles/shadows/
Разобрал тени. Классические техники, типовые артефакты, решения и математику стоящую за ними. Если вам было интересно почему тени в игре выглядят так плохо — статья для вас.
Вообще цикл мне нравится как получается, так как в итоге получится такой полноценный экскурс по тому, как работает рендер в разработке игр.
На следующей неделе разберем порядок отрисовки и прозрачную геометрию. Ставьте 🔥и делитесь статьей с друзьями — это помогает развитию канала и мотивирует делать больше интересного.
#статья | 695 |
| 6 | Doom работал благодаря статье, которая старше игры на тринадцать лет
https://youtube.com/shorts/qjejcOEpT4w?si=aP_hj_EddkdqMzoj
Чтобы коридор выглядел коридором, стены надо рисовать по порядку: ближняя закрывает дальнюю. Порядок этот зависит не от стен, а от того, где стоит игрок — сделали пару шагов, и две стены поменялись очередью. Пересобирать такой список каждый кадр железо девяносто третьего года не могло.
Поэтому порядок посчитали до игры. Уровень режут плоскостью надвое, каждую половину — снова, и так до мелких кусков; разрезы складываются в двоичное дерево. У каждого узла есть ближняя сторона и дальняя — от любой точки, где вы стоите. Дерево одно на весь уровень, а обход у него для каждой точки свой: всю тяжёлую работу делают один раз при сборке уровня, а в игре остаётся быстрый проход по дереву.
Идея не Кармака. Он взял её из научной статьи 1980 года, которую писали вообще не про игры.
#devmath #gamedev #doom #математика #алгоритмы | 673 |
| 7 |  Проблемы с тенями на больших локациях
Пока сцена небольшая, тени идеальны. Контур чёткий, ножки стула читаются, всё лежит там, где должно. Потом уровень дорастает до нормального размера, и в первом же кадре всё становится плохо.
Дальше всё идёт по накатанной. Качество теней ставят на максимум, разрешение карты поднимают с 1024 до 2048, потом до 4096, память под неё растёт вчетверо на каждом шаге и это не помогает. Было такое?
Собственно, вся история упирается в одну штуку. Карта теней — это текстура на N×N, и она обязана накрыть всё, что свет освещает. Сторона накрытой области, поделённая на разрешение, даёт размер одного текселя, а внутри текселя ответ «в тени или нет» один на всех.
Считаем. Комната двадцать метров, карта 1024 — два сантиметра на тексель, тень от стула держит форму. Та же карта на локации в пятьсот метров — сорок девять сантиметров. Полметра.
Я не к тому, что разрешение поднимать нельзя. До какого-то момента это работает. Просто это самый дорогой вариант из имеющихся.
Посмотрите, какую область накрывает карта — это дальность теней, она есть в настройках почти любого движка, — поделите на разрешение и сравните с размером того, чья тень должна читаться. Вышло полметра на тексель, а вам нужны перила?
Ну и самое интересное — дальше. Область просто так не ужать: свет обязан освещать весь уровень, тени нужны и вдали. Но нужны-то они с разной подробностью: под ногами сантиметры, на горизонте хватит метров, а карта одна и тексель у неё везде одинаковый. Отсюда та самая строчка «Shadow Cascades» в настройках: карту подгоняют не под уровень, а под то, что видит камера, и режут по дистанции. Четыре карты по 1024 вместо одной на 2048 — та же память, а у ног тексель выходит примерно вшестеро мельче.
Как именно режут дистанцию, почему на границах появляются швы и отчего край тени начинает переливаться, стоит тронуть камеру, — разберём в пятницу.
#геймдев #графика #математика #рендер #тени #gamedev | 258 |
| 8 | Дейв и Дельта: Пролог — Первый трейлер
https://youtu.be/Q3cpMvUEODs
Итак, я сделал трейлер. Мне не совсем нравится музыка, но без бюджета работаем с тем,что имеем. Я постарался максимально сгладить шерховатости. В целом получилось прикольно из уже созданных материалов по сюжету на мой взгляд. Но монтажер не настоящий, так как этим я никогда не занимался.
Оцените, скажите как вам трейлер. Ну и поддержать проект всегда можно на https://dev-math.ru/support/
А в дневник разработчика пойдет на этой неделе процесс создания ролика. Я в целом хочу описать общий пайплайн работы над игрой по ходу пьессы.
#оработе #суровыйпутьинди | 191 |
| 9 |  Тень — это фотография мира из лампы
Присядьте так, чтобы ваш глаз оказался там, где лампочка, и посмотрите оттуда на комнату.
Что видно с этой точки — туда свет лампы дошёл напрямую, чего не видно — не дошёл. Дальше уже дело отскоков (и это больше к теме GI): скажем белая стена подсветит и то, что от лампы закрыто. Но форму самой тени задаёт именно этот вид: она повторяет силуэт, каким предмет виден лампе, а не вам.
Собственно, ровно это делает игра. Рисует кадр со стороны света и сохраняет не цвет, а глубину: как далеко ближайшая поверхность в каждом направлении. Потом, рисуя картинку уже вам, для каждой точки смотрит в этот снимок. Приём предложил
Лэнс Уильямс в 1978-м, и в реальном времени тени до сих пор чаще всего считают
именно так.
Снимок конечного размера: сколько в нём пикселей, столько записано чисел, и покрывает он конечный кусок мира — между числами данных нет. Зубцы по контуру, рябь на ровном полу, тень, обрывающаяся по невидимой линии вдали — последствия этого.
Почему конечный размер даёт именно такие артефакты — разберём в пятницу.
#геймдев #графика #математика #рендер #тени #gamedev | 313 |
| 10 |  Теперь в модном чёрном цвете
https://dev-math.ru/
Вы попросили — я сделал. Мне не сложно. Так же как запрашивать какие-то темы (но новое я что-то буду делать когда добью свой "учебник по рендеру", а это ещё 3 статьи) — можно запрашивать какие-то фичи, если вам что-то не нравится и неудобно. По навигации или типа того.
А так на сайте теперь работает тёмная тема. Смотрю пока что никакой раздел не поехал, если обноружите какие-то баги — пишите. Я и сам ищу. А так согласен, ну какой сайт про разработку и для разработчиков без тёмной темы?
#новости #devmath | 331 |
| 11 | Metallic — переключатель, а не шкала
https://youtube.com/shorts/Lifzj3UvyZg?si=ED9gehzfKRdGJzYz
Решил попробовать новый формат видосов. Образовательный с инфографиками, а не чисто рассказ под мультфильм. Посмотрим как зайдёт или не зайдет.
Золото, ржавчина, лак, кожа — в современных играх все эти материалы описываются двумя числами: metallic и roughness.
Раньше на это уходили три независимые карты, и можно было нарисовать вещество, которого не существует: пластик, отражающий как зеркало. Свернуть их в два помогла не новая формула, а физика — вещество либо проводник, либо нет.
#геймдев #графика #pbr #unity #unrealengine | 328 |
| 12 |  Квиз про графику
https://dev-math.ru/dave-quiz/
Актуализировал квиз. Раз мы уже прошли с вами большую часть пути и вышло столько статей про графику, то давайте проверим знания небольшим квизом.
15 вопросов по темам что вышли и что выйдут. От самых простых про то, что такое UV до вопросов посложнее. В общем можно за 5 минут понять, а всё ли вы с ходу знаете из того, что я рассказывал 8 недель.
#devmath #квиз | 1 009 |
| 13 |  Куда уходит свет, который поверхность не отразила
https://dev-math.ru/articles/pbr/
Физика отражения в реальном времени: BRDF и уравнение отражения, микрофасеты и распределение GGX, Френель и F0, затенение по Смиту и знаменатель 4(N·L)(N·V), white furnace test как проверка энергии, metallic/roughness workflow.
В общем если вы хотели узнать, что за параметры metallic и roughness. Почему металлик в теории на самом деле бинарный и прочие нюансы PBR рендера — статья для вас.
Репосты и 🔥как всегда приветствуются. Это помогает развиваться каналу, а значит выпускать новые материалы.
А на следующей неделе уже будем разбирать тени и шадоумаппинг.
#devmath #статья #pbr #рендер | 297 |
| 14 | На всякий случай завел Макс
https://max.ru/channel_dev_math
Раз уж там можно сделать публичный канал, а не приватный. Там будет всё тоже самое, только работает без VPN. Мало ли кому-то удобнее.
#новости #devmath | 306 |
| 15 |  Сфера должна исчезнуть
Как за пять минут проверить, что материал не отдаёт больше света, чем получил. Уберите из сцены свет и HDRI, поставьте вместо окружения ровную белую заливку яркостью единица, выключите тонмаппинг. Материал возьмите предельный: металл с базовым цветом в единицу — такой ничего не поглощает и обязан вернуть всё, что пришло.
Вернёт — станет неотличим от фона. Не посветлеет, а исчезнет: силуэта нет, на экране ровное поле. Видите тёмный силуэт — энергию теряете, светлый — берёте из ниоткуда. Приём известен как white furnace test.
Теперь главное. Возьмите шейдер, собранный правильно, и потяните Roughness вверх. Сфера всё равно темнее фона, и на матовом конце наружу возвращается меньше половины пришедшего.
Модель считает один отскок: луч пришёл на микрогрань, отразился, улетел. В изрытой поверхности он так не летает — бьётся о соседний бугор и уходит со второго-третьего раза, а этих отскоков в модели просто нет.
На металле заметнее всего: у него всё отражение зеркальное, и нет диффузной части, которая прикрыла бы потерю. Отсюда матовая сталь, которая выглядит серой и припылённой. Ровно на это заведён баг в референсном вьювере glTF — «Rough metal looks too dark, may be losing energy».
Собственно, вывод: увидели припылённый металл — не тяните альбедо вверх, так вы проблему не решите. Прогоните тест и посмотрите, считает ли ваш шейдер многократное рассеяние. Считает — сфера не видна на любом Roughness.
Почему теряется и как это править — в пятницу.
#геймдев #графика #математика #рендер #pbr #gamedev | 330 |
| 16 | Pac-Man невозможно пройти
https://youtube.com/shorts/mbZlm4AeHxw?si=2a6Af3dDvEJmUe1U
На 256-м уровне Pac-Man ломается пополам: слева обычный лабиринт, справа каша из мусорных тайлов. Уровень пройти нельзя — и дело не в сложности.
Номер уровня игра держит в одном байте, а байт считает только от 0 до 255. На 256-м счётчик переполняется и щёлкает обратно на ноль. Подпрограмма, которая рисует фрукты внизу экрана, берёт этот номер как счётчик цикла — получает ноль и уходит на полный круг: 256 фруктов подряд. Места под них нет, и она затирает правую половину экрана.
Отсюда и «идеальная игра» Pac-Man — 3 333 360 очков.
#геймдев #математика #программирование #ретрогейминг #аркады #pacman #байт #переполнение #gamedev #retrogaming #arcade #devmath | 336 |
| 17 |  Вдали ваш кирпич — зеркало
По дальней стене, гравию, клёпке побежали белые искры. MSAA по ним не работает вообще, TAA давит их ценой шлейфа. А вблизи тот же материал выглядит прилично.
Дело в мипах карты нормалей. Карта нормалей хранит наклон поверхности в каждой точке: тут скол кирпича смотрит влево, тут вправо, тут вверх. Мип-уровень — это усреднение соседних текселей, а если усреднить «влево» и «вправо», получится «прямо». Чем дальше объект, тем более пологим становится его рельеф в мипах, и на дальних уровнях от кирпичной кладки остаётся ровная плита.
Roughness при этом остался тот, что вы поставили. Ровная поверхность с низким Roughness — это зеркало: она отражает окружение чётко, без размытия. И на дальнем объекте одному пикселю достаётся то солнце или яркое пятно пробы, то тёмный кусок неба рядом. Кадр — вспышка, кадр — чернота. Вот вам и искры.
Собственно, суть: наклоны, которые усреднение потеряло, — это и есть Roughness на этой дистанции. Карта нормалей и Roughness описывают одну и ту же неровность, просто на разных масштабах: что различимо на экране — живёт в нормалях, что мельче пикселя — в Roughness. Объект уезжает вдаль, рельеф обязан перетекать из первого во второе.
Чинится штатно. В Unreal у текстуры Roughness есть свойство Composite Texture: кладёте туда карту нормалей, и движок при генерации мипов сам смотрит, сколько наклонов потерялось на уровне, и ровно настолько поднимает Roughness. В Unity такой галочки в импортёре нет. Ближайшее — Geometric Specular AA в HDRP, но он про другой источник: срезает гладкость по кривизне самой геометрии, и в доке прямо сказано, что полезнее всего он там, где карты нормалей нет.
А почему разброс наклонов вообще сворачивается в одно число и как это число выглядит изнутри — в пятницу.
#геймдев #графика #математика #рендер #pbr #gamedev | 336 |
| 18 |  Что такое блик?
Посмотрите на любую цветную пластмассу рядом с собой: корпус мышки, крышку от бутылки, борт машины. Поймайте на ней отражение лампы или окна. Пластмасса синяя, красная, зелёная — а блик на ней белый. Ровно того цвета, что и источник. Так же ведут себя краска, дерево, камень, кожа: собственный цвет предмета в блик не попадает вообще.
Дело в том, что упавший свет делится один раз — на входе. Часть отражается сразу от границы двух сред, внутрь не заходя: про материал она ничего не знает, поэтому и уносит цвет источника. Остальное преломляется внутрь, гуляет там между частицами пигмента, что-то по дороге поглощается, а что уцелело — выходит обратно наружу, уже окрашенное. Вот это вернувшееся вы и называете цветом предмета.
Собственно, вывод: матовая часть и блик — не два эффекта, которые складывают. Это два разных поведения одного луча. Что отскочило от границы — внутрь не попало и цвета не наберёт; что ушло внутрь — в блике не появится. А количество энерегии одно, и равно оно тому, что упало. Проблема простой реализации прошлой статьи, что это никак не учитывается.
В шейдере крутите specular вверх: если материал просто становится ярче и ничего при этом не теряет — баланс энергии у вас не сходится, поверхность отдаёт больше света, чем получила. С одним источником света это сходит с рук. А потом сцену переносят под HDRI, где свет идёт со всех сторон, и материал начинает светиться сам.
Ну и бытовое наблюдение в ту же копилку: почему мокрый асфальт темнее сухого. Вода ничего не пачкает и цвет не съедает — она меняет маршрут той части света, что собиралась выйти наружу. Плёнка заворачивает часть выходящего обратно внутрь, тот идёт по материалу на второй круг, и там его добирает поглощение. Наружу возвращается меньше — глазу темнее. Заодно ровная плёнка собирает зеркальную часть в аккуратное пятно, поэтому мокрое всегда темнее и глянцевее одновременно.
А делится свет не всегда одинаково — пропорция зависит от угла. Посмотрите на стол сверху вниз: видите цвет дерева. Теперь присядьте и гляньте почти вдоль столешницы — на том же самом месте отражение окна, а дерева уже почти не разглядеть. Не поменялось ничего, кроме угла, под которым вы смотрите. По той же причине светлее края круглых предметов.
Почему угол решает так много, почему отражённое собирается в узкое пятно, а не светится ровно по всей поверхности, и как уложить это в шейдер, — разберём в пятницу.
И загадка туда же. Блик у неметалла белый, потому что отражение от границы цвета не набирает. Тогда откуда у золота жёлтый блик, а у меди рыжий — по этой логике они тоже должны отражать лампу как есть.
#геймдев #графика #математика #рендер #pbr #gamedev | 337 |
| 19 |  Про свет по-простому
https://dev-math.ru/articles/lighting/
Поговорим про свет. Про ламберта, про Блинна и про Фонга. Если вы не знали или хотите освежить как устроено освещение в игровых движках — это чтиво для вас!
Я постарался собрать полную картину с историей, как всё это работает и как всё это придумывалось. Это пока не PBR с BRDF, эти вещи у нас будут темой следующей недели, но это первый шаг к физически корректному освещению.
Вообще чтобы понимать как устроена 3д графика в первую очередь я считаю, что нужно знать базу того, как всё работает и придумывалось. Это и дает понимание как использовать то, что уже давно сделано и дает пищу для создания новых креативных идей.
Ведь чтобы сделать свой хитрый, стилизованный свет полезно знать, как работает обычное освещение играх. Да и это база потребуется нам в будущем, когда мы перейдем к более комплесным эффектам и шейдерам.
#devmath #свет #Ламберт #Фонг #Блинн | 922 |
| 20 |  لا يوجد نص... | 427 |
