Про цю симуляцію
Морфінг-сфера — це твір генеративного мистецтва в реальному часі, який повністю працює у вашому браузері завдяки WebGL. Щокадру власний GLSL-вершинний шейдер зміщує кожну з ~40 000 вершин сфери вздовж її зовнішньої нормалі, використовуючи дробовий броунівський рух (fBm) — чотири накладених октави 3D симплексного шуму, що обчислюються на послідовно подвоєних частотах. У результаті поверхня дихає, пульсує та звивається з органічною складністю, ніколи не повторюючись. Другий прохід domain warping подає вихід шуму назад як нову вхідну координату, створюючи характерні самоподібні завитки, помітні в усіх колірних темах.
🔬 Що демонструє
Процедурне зміщення вершин через domain-warped fBm симплексний шум на ікосфері високої роздільності (деталізація 6). Збурені нормалі обчислюються попіксельно методом скінченних різниць, забезпечуючи точне освітлення динамічно деформованої поверхні. Фрагментний шейдер на основі косинусної палітри відображає значення зміщення та час у колір, формуючи веселкову, магмову, океанічну та «цукеркову» теми.
🎮 Як користуватися
Перетягуйте, щоб обертати, прокручуйте для масштабування. Масштаб шуму (0.5–6) керує кількістю горбиків — великі значення дають дрібну зморшкуватість, малі — широкі хвилі. Амплітуда (0–1) задає величину зміщення; при 1.0 поверхня майже вдвічі збільшується у пікових точках. Швидкість морфінгу (0–2) визначає, як швидко час рухається у просторі шуму. Натисніть Пульс!, щоб миттєво збільшити амплітуду й отримати ефектний спалах розширення.
💡 Цікаво знати
Domain warping популяризував Iниго Кілес у 2003 році як спосіб генерувати текстури рельєфу і хмар, що виглядають справді фрактальними, а не просто зашумленими. По суті це два рядки GLSL: результат першого виклику шуму стає координатою для другого. Техніка є основою процедурної графіки в реальному часі в іграх і демосценічних роботах.
Часті запитання
Який тип шуму живить морфінг?
Симуляція використовує 3D симплексний шум (реалізація Ashima Arts / Стефана Густавсона), складений у fBm із 4 октавами, лакунарністю 2.0 та коефіцієнтом 0.5. Симплексний шум обраний замість класичного шуму Перліна через менше спрямованих артефактів у 3D і дещо нижчу вартість обчислення у GLSL — важливо, коли він виконується для кожної вершини щокадру на ~40 000 вершинах.
Що насправді змінює повзунок «Масштаб шуму»?
Він множить позицію вершини перед тим, як вона передається до функції шуму, фактично масштабуючи поле шуму. Малий масштаб (наприклад 0.5) вибирає крихітну ділянку простору шуму, і поверхня виглядає гладкою й куляподібною. Великий масштаб (наприклад 6.0) охоплює широкий діапазон, виявляючи дрібні деталі й утворюючи щільно зморшкувату, коралоподібну текстуру.
Чому кнопка «Пульс!» дає такий виразний ефект?
Пульс тимчасово підвищує уніформ амплітуди від поточного значення на +0.65, використовуючи синусоїдальну обгортку тривалістю 1.2 секунди. Оскільки амплітуда обмежена 1.0, а при значенні 1.0 поверхня може зміщуватися майже на повний радіус, сфера на мить роздмухується, а потім повертається назад — візуально схоже на ударну хвилю, що розширюється від центру.
Чи можна зупинити анімацію?
Встановіть Швидкість морфінгу у 0.0. Уніформ часу перестане просуватися, тому поле шуму сплюватиметься в фіксованій координаті, закріплюючи поверхню в тій формі, що була в цей момент. Ви й надалі можете обертати та масштабувати сцену для огляду замороженої геометрії. Збільшуйте амплітуду під час зупинки, щоб підкреслити зміщення без руху.
Чи працює на мобільному пристрої?
Так — симуляція використовує стандартний контекст WebGL 1.0 з одним draw call, який підтримується будь-яким сучасним браузером смартфона. На слабших пристроях рекомендується тримати масштаб шуму нижче 3.0 та швидкість морфінгу нижче 1.0 для плавного кадрування, адже щокадру вершинний шейдер обчислює domain-warped fBm функцію близько 120 000 разів.