Эффекты

Искажение

Картинка ниже течёт, закручивается, раздувается, сворачивается в «маленькую планету» или смотрится сквозь рифлёное стекло.

  • эффект
  • бесшовный тайл
  • зацикленная анимация
Открыть в редакторе →

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

Как это устроено

Главный приём — обратное отображение. Вместо вопроса «куда переедет точка картинки» задаётся вопрос «откуда взять цвет для точки экрана»: out(p) = src(f(p)). Так не бывает ни дыр, ни наложений, и годится любая функция f. Остальное — выбор f в поле «Вид».

Шумовое течение сдвигает точку на вектор из двух независимых фрактальных шумов («Детали» — число октав). Сдвиг привязан к размеру шума, поэтому «Масштаб» меняет характер течения, а не его силу. Вихрь поворачивает точки вокруг центра на угол, который плавно сходит на нет к «Радиусу»; линза растягивает или сжимает окрестность центра, и её край остаётся гладким. Рябь бежит от центра кольцами, волна — две синусоиды поперёк друг друга. «В полярные» сворачивает прямоугольник в диск: горизонталь становится углом, вертикаль — радиусом, низ картинки собирается в центре. «Из полярных» делает обратное — разворачивает окружности в строки. Стеклоблоки превращают каждую ячейку Вороного в отдельную линзу, рифлёное стекло — ряд вертикальных цилиндров, каждый сжимает свою полоску, а при большой силе переворачивает её.

out(p) = src(f(p)) вихрь: f(p) = c + R(2π·s·φ(r))·(p − c), r = |p − c| рябь: f(p) = p + (p − c)/r · (2s/k)·sin(k·r − ωt)·φ(r) φ(r) — гладкий спад от 1 в центре до 0 на «Радиусе»

Немного истории

Идея стара, как анаморфоз: на «Послах» Гольбейна (1533) по полу тянется череп, который узнаётся, только если посмотреть сбоку. В 1917 году Д’Арси Томпсон в книге «О росте и форме» рисовал рыбу на координатной сетке, изгибал сетку — и получал другой вид: формы родственных видов, по его мысли, часто отличаются лишь гладким искажением пространства. Для компьютерной графики ключевой шаг сделал Кен Перлин: в статье 1985 года его мрамор — это полосы sin x, сдвинутые шумом. Рифлёное стекло — наследие ар-деко 1920–30-х, снова вернувшееся в интерьеры в наши дни.

Что покрутить

  • Знак «Силы» разворачивает эффект: вихрь закручивает в другую сторону, выпуклая линза становится вогнутой.
  • «Рифлёное стекло» с «Масштабом» 20–40 — та самая дверь ванной. Начиная примерно с «Силы» 0,6 каждая рифля переворачивает свою полоску, как настоящая цилиндрическая линза.
  • В анимации «Скорость» 1 заставляет вихрь и линзу «дышать» — сила качается от +s до −s за петлю, а рябь бежит наружу ровно целым числом волн.
  • Шумовое течение лучше всего видно на строгой геометрии: «Плитки Труше», «Лабиринт» и «Оп-арт» превращаются в мрамор и жидкий металл. «В полярные» поверх «Хребтов» или горизонтальных полос даёт готовую «маленькую планету».

Параметры

Вид
шумовое течение · вихрь · линза · в полярные · из полярных · рябь · волна · стеклоблоки · рифлёное стекло
Сила
Знак меняет направление: вихрь в другую сторону, линза вогнутая вместо выпуклой
Масштаб
Частота шума, волн и ряби, число стеклоблоков или рифлей на короткую сторону
Детали
Октавы шумового течения
Радиус
Докуда достаёт вихрь, линза, рябь и полярная развёртка
Центр по X
Центр по Y
Скорость
Циклов движения за петлю анимации