UK 
EnglishТипова
Polski🎨 Процедурні Текстури
GLSL фрагментний шейдер процедурних текстур: мармур, кільця дерева, хмари, вогонь, клітини Вороного та лава. шум fBm, шум Ворлі, анімація з юніформом часу.
Про процедурні текстури
Ця симуляція рендерить шість класичних процедурних текстур — мармур, дерево, хмари, вогонь, клітини Вороного та лаву — повністю на GPU за допомогою єдиного GLSL-фрагментного шейдера. Жодні файли зображень не завантажуються; кожен піксель обчислюється з математики координат. Основний примітив — шум значень, побудований з ґратки хешу на основі синуса, підсумований по октавах як fractal Brownian motion (fBm): кожна октава подвоює частоту й зменшує вдвічі амплітуду, створюючи деталі на багатьох масштабах.
🔬 Що показано
Повзунок Scale (0.5×–4×) масштабує поле шуму, Speed (0×–3×) керує годинником анімації, а Octaves (1–8) задає, скільки шарів fBm підсумовується, обмінюючи деталь на швидкість. Вкладки пресетів перемикають гілку шейдера, а чипи Palette перефарбовують через яскравість у Grayscale або теплову рампу Heat. Ті самі техніки живлять кіно- та ігрове мистецтво: кора, мармур, дим і лава зазвичай генеруються, а не фотографуються.
🎮 Як користуватись
Клацніть пресет текстури, щоб перемкнути режим шейдера. Повзунок Scale масштабує поле шуму — мале значення показує велику структуру, велике — дрібну деталь. Time Speed керує швидкістю анімації — перетягніть до 0, щоб заморозити. Режим Grayscale показує сире значення шуму до накладання палітри. У Voronoi кожен забарвлений регіон — територія випадкової «точки-насінини», концепція, що використовується в обчислювальній геометрії, біології та генерації рельєфу в іграх.
💡 Чи знали ви?
Кен Перлін винайшов когерентний шум у 1983 році, працюючи над фільмом Трон, — пізніше він отримав технічну премію «Оскар». Стівен Ворлі винайшов клітинний/Voronoi-шум у 1996 році. Сьогодні практично кожен 3D-фільм і відеогра використовує процедурні текстури: кора, камінь, вода й шкіра, які ви бачите, — здебільшого математичні функції, а не фотографії. Процедурні текстури в реальному часі стали практичними завдяки програмованим GPU-шейдерам на початку 2000-х.
Часті питання
Що таке процедурні текстури?
Це текстури, кожен піксель яких обчислюється математичною функцією, а не зчитується із збереженого растрового зображення. Оскільки колір виводиться з координат пікселя, результат безшовний, тайлується і доступний за будь-якої роздільної здатності. Ця демонстрація обчислює всі шість текстур наживо у фрагментному шейдері, що працює на вашому GPU.
Що таке fBm і навіщо він тут використовується?
Fractal Brownian motion підсумовує кілька шарів шуму, кожен з подвоєною частотою й половинною амплітудою попереднього. Це дає і загальні форми, і дрібні деталі поверхні, тому й виникають природні на вигляд хмари, мармур і вогонь. Повзунок Octaves керує тим, скільки шарів — від 1 до 8 — додається.
Що роблять повзунки Scale, Speed і Octaves?
Scale (від 0.5× до 4×) масштабує семплювання шуму, тож низькі значення показують велику структуру, а високі виявляють дрібне зерно. Speed (від 0× до 3×) множить годинник анімації, а перетягування до 0 заморожує текстуру. Octaves (від 1 до 8) задає кількість шарів fBm, додаючи багатство ціною роботи шейдера.
Як насправді генерується базовий шум?
Хеш-функція перемішує кожну цілочисельну точку ґратки за допомогою fract від sin скалярного добутку, даючи псевдовипадкове значення для кожного кута сітки. Далі шум значень плавно інтерполює чотири навколишні кути кривою smoothstep, а fBm накладає кілька масштабованих копій цього шуму, щоб побудувати фінальне поле.
Чим пресет Voronoi відрізняється від інших?
Режим Voronoi використовує шум Worley, або клітинний шум, замість шуму значень. Він розкидає точку-насінину в кожній клітинці сітки і для кожного пікселя знаходить найближчу насінину, повертаючи цю відстань і хеш насінини. Кожна клітинка потім забарвлюється за своєю насіниною й затемнюється біля меж, утворюючи характерну мозаїку регіонів.
Що змінюють чипи Palette?
Кожна текстура має власну вбудовану колірну рампу, яку чип Original залишає незмінною. Grayscale перетворює результат на яскравість за стандартними вагами 0.299, 0.587, 0.114, оголюючи сире значення шуму. Heat бере ту саму яскравість і пропускає її через чорно-червоно-помаранчево-жовту вогняну рампу, перефарбовуючи будь-яку текстуру на теплову карту.
Чи фізично точні ці текстури?
Ні, це художні наближення, а не фізичні симуляції. Вогонь і лава не розв'язують рівнянь гідродинаміки; вони анімують поля fBm за допомогою масок і синусоїдальних викривлень, щоб імітувати рух. Мета — переконлива, керована візуальна деталізація за швидкості реального часу, і саме так процедурні текстури використовуються у продакшн-рендерингу.
Навіщо використовувати фрагментний шейдер замість заздалегідь обчислених зображень?
Виконання у фрагментному шейдері означає, що GPU обчислює текстуру незалежно для кожного пікселя паралельно, тож зображення не залежить від роздільної здатності й ніколи не показує швів тайлування чи розмиття при збільшенні. Це також коштує майже нуль пам'яті, оскільки нічого не зберігається, а текстура може анімуватися безперервно, подаючи час у математику.
Що робить гамма-корекція наприкінці шейдера?
Після обчислення кольору його підносять до степеня 0.4545, тобто одиниця поділена на 2.2. Це перетворює колір лінійного світла, у якому працює математика, у простір sRGB, який очікує ваш дисплей, тож середні тони виглядають коректно яскравими, а не надто темними. Це стандартний фінальний крок у виводі шейдера.
Де процедурні текстури використовуються в реальному світі?
Вони всюди в 3D-фільмах та іграх: камінь, дерево, мармур, вода, хмари, шкіра й рельєф зазвичай генеруються, а не фотографуються. Ті самі функції шуму керують картами висот рельєфу, поверхнями планет і спецефектами. Шум Voronoi зокрема з'являється в обчислювальній геометрії, моделях клітинної біології та картах регіонів ігрового світу.