TGViewer
Channel Public Channel
Dev Math

Dev Math

@easy_dev_math

Как на самом деле создаются игры. Как сделать игру интересной и реализовать технически. А главное причём тут математика?

Разборы на пальцах, рабочий код, интерактивы. dev-math.ru

Сотрудничество: @it_bizdev
Subscribers
610
Photos
116
Videos
3
Links
67

Showing posts older than #113 · Back to latest

Older Posts 13 shown
Post #111 382
Дейв теперь в Рилсах
https://www.instagram.com/reel/DaFostRIAxo/?igsh=OXd4cnM0b2x5cGFx

В сторис я выложу видос, но телега жрет качество, так что советую глянуть в инсте. Я продумал, на мой взгляд, довольно интересный научнопопулярный формат видео, с роликами о прикольных вещах и парадоксах в математике + забавных историй. Как раз самое то для инсты. Быстро, ненапряжно и легко потреблять.

Первый рилс про парадокс Симпсона. Если вдруг не знаете забавную историю про Беркли в 1973 году. Советую глянуть 🙂


UPD: И в шортсах https://youtube.com/shorts/ZQpwg1fqtOY?si=fXMKK0shl23uvkBp

#парадоксСимпсона #статистика #данные
YouTube Парадокс Симпсона и Беркли Беркли, 1973: цифры кричат «дискриминация женщин», а по факультетам...
  • 🔥 3
  • ❤ 1
Post #107 367
Неделя 1: четыре дыры зашиты — а карты целиком нет

Дейв догонял Хардкода и рефакторил его костыли один за другим: почему чисел именно три (это про глаз, а не про цвет), почему камни-близнецы разъезжаются под другой лампой, почему тонкая плёнка глитчит и как свернуть её аналитически, почему дисперсию не подделать сдвигом RGB-каналов.

RGB — это техника со своей областью применимости, и Дейв теперь видит, где она кончается. Но Хардкод сбежал в трещину, а Статика только набрала силу: эталона у него пока нет.

На следующей неделе:
— небо: трюк, ставший формулой, — тут RGB честнее некуда;
— флуоресценция: то, чего три числа не умеют в принципе;
— каустики с дисперсией: два фейка сталкиваются;
— финал: спектральный эталон против RGB — и сколько правда стоит в миллисекундах.
  • 🔥 7
Post #106 415
О цвете в играх по-простому
https://dev-math.ru/articles/rgb-tricks/

Как и планировалось в пятницу новый формат. Всю пугающую математику свернул в спойлеры, чтобы текст читался проще. Без спойлеров получается научно-популярный текст. В спойлерах детали.

Всю неделю в канале мы разбирали, где RGB обманывает — началось с того, что Дейв нашёл два самоцвета: под одной лампой близнецы, под другой — разного цвета. Камни те же, поменялся только свет. Чтож, теперь всё собрано в одну статью, и её можно не только прочитать, но и покрутить руками.

По сути, RGB — это не то, как устроен свет. Это то, как устроен ваш глаз: три типа колбочек сворачивают весь спектр в три числа. Для картинки на экране этого почти всегда хватает. Для физики света — уже нет.

В статье — четыре места, где трёх чисел перестаёт хватать:
— метамерия — два разных спектра дают один цвет, пока не сменишь лампу;
— обратная задача — как вернуть спектр из трёх чисел и почему решений бесконечно много;
— тонкие плёнки — переливы мыльного пузыря и бензина на луже; та самая иридесценция, что в Unity HDRP уже лежит галочкой;
— дисперсия — «огонь» бриллианта, который дешёвый фейк не вытягивает на крупном плане.

И всё это — четыре живые 3D-сцены прямо в браузере: переливающаяся плёнка, бриллиант, рассыпающий спектр по граням, метамерные свотчи под разными лампами.

Зачем это вам? В реалтайме вы всё равно фейкаете — вопрос только в том, насколько качественно. А понимание того, как цвет устроен на самом деле, как раз и подсказывает, как фейкать правильно: что важно сохранить, а чем можно пренебречь.

Не забываем делиться статьёй и ставить🔥 — это помогает развитию канала и моей мотивации писать дальше :)

#геймдев #графика #математика #цвет #дисперсия #призма #шейдеры #геймдев #графика #математика #цвет #RGB #иридесценция #дисперсия
  • 🔥 9
  • ❤ 4
Post #104 364
«Огонь» бриллианта — это не блеск камня

Вы наверняка видели, как бриллиант в кадре вдруг рассыпает спектр по граням. И почти наверняка — хроматическую аберрацию по краям картинки: красный уехал в одну сторону, синий в другую. Выглядит дорого. На деле — почти бесплатно.

Трюк индустрии простой. Берём текстуру и сэмплируем три раза со смещением: R чуть туда, B чуть сюда, G посередине, радиально от центра кадра — вот вам «линза камеры». Либо три луча под тремя фиксированными углами, по одному на канал. Дёшево, один проход, и в массе сцен глаз считывает это как оптику объектива и не сверяет с физикой. Так что приём работает — почти всегда.

Почти. Ломается на крупном плане огранённого прозрачного объекта: бриллиант, призма, стопка стекла, магический кристалл — всё, где луч гуляет внутри. Камень переотражается несколько раз (полное внутреннее отражение), и спектр должен размазываться на КАЖДОМ преломлении. А фейк разделил каналы один раз — и тащит это разделение неизменным. Накопления нет, спектр выходит плоским и не зависит от геометрии огранки. Тут глаз ловит подделку мгновенно.

Где это вылезает в играх? Хром. аберрация постом по краям кадра, лёгкий спектр на гранях дальнего самоцвета — никто не идёт сверять это с физикой, и трюка хватает. Сыпется он там, где сошлись крупный план И множественные преломления: hero-камень в инвентаре, бриллиант в кат-сцене, тот самый сюжетный макгаффин-кристалл. Если «огонь» камня не пляшет по огранке, а едет вместе с экраном — это он и выдал себя.

Глубже — то, что сдвиг каналов выкинул: дисперсия живёт не в пикселе, а на пути луча. Показатель преломления зависит от длины волны — n(λ). Синий преломляется сильнее красного, угол по закону Снелла свой для каждой λ, поэтому спектр и веерится. Но только когда трассируешь сам путь, а не двигаешь каналы в экранном пространстве.

В пятницу разберём руками: фейковый сдвиг каналов против честного λ-raymarch на одном бриллианте. С формулами и демкой, где режимы переключаются вживую.

#геймдев #графика #математика #цвет #дисперсия #призма #шейдеры
  • 👍 5
  • 🔥 2
Post #103 371
Радуга без единой краски

Мыльный пузырь, лужа бензина, синяя побежалость на нагретой стали — переливаются всеми цветами, хотя пигмента в них ноль. Это тонкая плёнка толщиной с длину волны: свет отражается от верхней и нижней границы, волны складываются и гасятся. Чистая интерференция.

В играх вы это видите чаще, чем думаете: перламутр автокраски, надкрылья жуков, та самая побежалость, бензин в луже, любая «не от мира сего» sci-fi-поверхность. И в Unity HDRP это уже готовая галочка — Iridescence.

Сколько длин волн надо посчитать на пиксель? В лоб — десятки: отражение плёнки бешено осциллирует по спектру. А у вас три числа.

И вот трюк, который почти честный (Belcour & Barla, 2017): дрожащий спектр не семплируют — его аналитически сворачивают сразу в RGB, в замкнутом виде. Мало того, авторы доказали: для диэлектрической плёнки (пузырь, масло) результат совпадает с честным спектральным расчётом. Не «похоже» — совпадает. Редкий случай, когда упрощение почти не врёт.

Почти. Спотыкается он на металлах. У меди показатель преломления резко пляшет по спектру, и предынтеграл начинает мазать: оттенок и насыщенность уезжают.

В пятницу — почему плёнка вообще осциллирует, как её сворачивают в три числа и где щёлкает медь. С интерактивным side-by-side.

#геймдев #графика #математика #цвет #иридесценция #шейдеры
  • 🔥 10
Post #102 397
Обратная задача: вернуть спектр из трёх чисел

Вчера я рассказал как глаз сворачивает спектр в три числа — и вышло, что у одного цвета таких спектров бесконечно много. Сегодня идём в обратную сторону: из трёх чисел собрать спектр. Вот тут и начинается боль.

Художник красит текстуру в RGB. Никакого спектра на входе нет и не было — так устроена вся индустрия, и это удобно: текстура весит как три канала, а не как десятки чисел на пиксель, инструменты привычные. Умно? Да. Ровно до момента, когда движку нужно посчитать что-то спектральное — дисперсию, цвет под цветным светом, тонкую плёнку. Там на пиксель нужен спектр, а у вас три числа.

Развернуть три числа обратно в спектр — задача недоопределённая. Та же вчерашняя метамерия, только смотрим с другого конца: одному RGB отвечает бесконечно много спектров, и какой из них «настоящий» — узнать неоткуда.

Поэтому задачу не решают, а обходят. Spectral upsampling: по RGB достраивают один правдоподобный спектр — гладкий и физичный (значения в [0,1], без резких пиков), просто чтобы было что отдать в расчёт. Методов хватает: Smits — наивная отправная точка, Meng и Jakob & Hanika — рабочие (последний стоит по умолчанию в PBRT и Mitsuba), а Belcour вообще выдаёт целое семейство спектров под один цвет.

Нужно это далеко не везде. В реалтайме трёх чисел хватает, гнать каждый пиксель в спектр незачем. А вот когда RGB-текстура попадает в физичный расчёт — офлайн-рендер, product-viz, конфигуратор авто, где перламутр должен честно играть под разным светом, — недоопределённость и вылезает. Правильного ответа среди метамеров нет, так что каждый рендерер выбирает свой.

#геймдев #графика #математика #цвет #спектр
  • 🔥 9
Post #101 374
RGB — это не свойство света. Это свойство вашего глаза

Вчера Дейв поймал это на двух самоцветах: под факелом — близнецы, под другой лампой — разного цвета. Камни не менялись. Менялся только свет. Разберём, что это было.

Откройте color пикер: три ползунка R, G, B — и любой оттенок. Кажется, что цвет так и устроен — три числа. Да? Конечно же нет.

Три числа — это про ваш глаз, а не про мир. В сетчатке три типа колбочек (L, M, S), и каждая сворачивает весь спектр света в одно число — берёт интеграл спектра по своей кривой чувствительности. На входе непрерывный спектр, на выходе три отклика. Глаз сжимает свет до трёх чисел. RGB — просто базис поверх этого сжатия: умное упрощение, а не «реальность».

В примере с камнями. Два РАЗНЫХ спектра под одной лампой дают одинаковые три отклика и выглядят одинаково. Сменили лампу — отклики разошлись, и цвет за ними. Это метамерия: совпал цвет ≠ совпал спектр.

Важно понимать что означают эти три числа: цвет это не точка, а целый спектр, свёрнутый глазом в три отклика. У одной «тройки» бесконечно много спектров-прообразов.

При чём тут ваши игры? Бытовая версия «цвет — не три числа» — это color management: линейка vs sRGB, гамут, тонмаппинг, HDR. Ассет, выверенный под один свет, «уезжает» под другим — близкая родня метамерии. RGB при этом остаётся нормальным базисом для большинства игр; смысл не «отказаться», а знать, как всё устроено на самом деле.

Что мы и разберем. Как устроен цвет, зачем в играх нужен спектральный рендеринг, как рендерить красивые самоцветы и другие подводные камни данной темы.

#геймдев #графика #математика #цвет #RGB #метамерия
  • 🔥 8
  • ❤ 3
Post #98 414
1.png3.9 MB 2.png2.2 MB 3.png3.9 MB
Скину и файлами, чтобы тексты были не такими пожеванными. Да, без зума тут не обойтись конечно
  • 🔥 4
  • 💯 1
Post #95 380
Цвет — это три числа?

Дейв уверен, что да: RGB — и хватит. Как все мы.

Два самоцвета из лута: под факелом близнецы, не отличить. Шаг под другую лампу — и они разного цвета. Камни те же, глаз тот же. Что не так?

Первый комикс сезона про цвет — как умное упрощение «три числа» в один момент красиво врёт.

Зачем это, если вы делаете игры? Ведь экран монитора так врать не будет. На «трёх числах» стоит весь реалтайм-рендер — дёшево и обычно правильно. Но иридесценция, самоцветы, неон, цвет под цветным светом — места, где трюк RGB врёт, и часть из них уже решена прямо в движке (HDRP, sky-шейдер). Сезон — про то, как понимать эту границу: где упрощение экономит, а где пригодится спектр.

Плюс бонусом из этой темы вытекает понимание работы алгоритмов в части задач компьютерного зрения.
  • 🔥 5
Post #94 409
Новая неделя, новый формат

Чтож, попробуем что-то новое. Мне всегда хочется делать "лучше чем раньше". Раньше темы были довольно часто встречающиеся по которым материалы и так найти относительно легко. Сейчас я хочу взять тему, которая разобрана не так хорошо. Раньше посты выходили сами по себе — а теперь запускаем первый сезон: связную историю на две недели, с началом, серединой и развязкой.

Тема первой недели — цвет. И сразу вопрос на засыпку: вы уверены, что цвет в реальности — это RGB? Три числа на пиксель?

Собственно, нет. RGB — это не базовая реальность, а трюк, упрощение. Возьмите два цвета, идеально совпавших под лампой в комнате, и вынесите на улицу — они разъедутся. Один и тот же «цвет» под разным освещением становится разным. Это метамерия, и это только первая трещина.

Как это будет выходить. Каждый эпизод — три такта:
— трюк — как индустрия считает это дёшево и почему это умно;
— граница — точная сцена, где допущение ломается;
— за границей — физика, которую трюк отбросил.

А неделя устроена так:
🟦 Пн — комикс-затравка (наш Дейв тоже уверен, что цвет — это RGB; зря);
🟩 Вт–Пт — четыре коротких разбора, по одному на под-тему;
🟧 Сб — большая статья с интерактивом: хак и эталон рядом, крутите сами и смотрите, где именно фейк начинает врать;
🟥 Вс — комикс-выпуск с развязкой недели и карточкой «что запомнить».

И так две недели. Восемь эпизодов — от «что вообще такое цвет» до спектрального рендера, который считает свет честно. По сути, это история про то, что любой хак — это карта допущений; вопрос лишь в том, знаете ли вы её границы.

Старт — в понедельник, с первого комикса. Следите, будет интересно. А я постараюсь держать такой темп.
  • 👍 13
  • 🔥 2
  • ❤ 1
Post #93 359
Матчасть — проверьте, что осело после статей

Вы читали (ну или пролистывали) разборы про повороты и кватернионы, стрельбу, SDF, толпу, матчмейкинг, лутбоксы и шум. Собственно, давайте проверим, что из этого реально осело в голове, а что прошло мимо.

Сделал квиз — «Матчасть». 8 вопросов, по одному на каждую тему. Вопросы на понимание: зачем вообще нужны кватернионы, что такое hitscan, откуда у стаи скворцов синхрон, чем Glicko отличается от ELO. Где-то ошиблись — подсказка после ответа ведёт прямо в нужный раздел статьи. Так что это и проверка, и способ дочитать то, что пропустили.

Ведёт квиз Дельта, а Магистр Хардкод по ходу подсовывает «костыли» — варианты с магическими числами вместо настоящего ответа, не ведитесь. В конце выдаётся звание: от Магистра Хардкода до самого Дейва. Результатом, конечно же, можно похвастаться.

👉 https://dev-math.ru/dave-quiz/

Делитесь в комментариях, какое звание выбили.
  • 🔥 4
  • ❤ 1
  • 👍 1
Post #91 678
Гладкая случайность: как функция от координат лепит горы, облака и огонь
https://dev-math.ru/articles/noise/

Прямо в браузере крутятся настоящие GLSL-шейдеры — объёмное облако, которое можно облететь камерой, и живой огонь. А ещё градиенты, октавы, domain warping и шесть интерактивов. Жду огоньков 🔥

Вообще шум довольно забавная тема. Он так тесно связан с компьютерной графикой, VFX и таким огромным спектром задач. Забавно что все "естественное" это по своей сути фрактальные структуры шума. Поэтому многие работали над разными применениями и вариациями этого. Хотя конечно в случае облаков и огня — это скорее "фокус", чем что-то реальное.

Пока я делал интерактивы я удивился, что чтобы их не фризило мне пришлось сделать для облаков пребейк 3д текстур и прочие волюметрические техники. Так как на моём макбуке оно прям лагало. Но ща работает гладко, так что приглашаю ознакомиться.

#мат_геймдев #МатРазбор #procgen #шейдеры
  • 🔥 13
Older posts →
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →