Лендинги

Centipede Repaints — перекрас конных миниатюр

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

Год
2026
Роль
Дизайн и вёрстка
  • HTML
  • CSS
  • JavaScript
  • SVG
  • Canvas

Открыть проект

/play/centipede-repaints/index.html

Загляните в «Студию перекраса»: переключите масть, отметину и постановку — модель перерисуется сразу. Наведение на карточку в разделе «Масти» переодевает лошадь в студии выше.

Галерея

О проекте

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

Что внутри

  • Студия перекраса: четыре независимых переключателя, мгновенная перерисовка и карточка модели, которая копируется в буфер — заказчику остаётся вставить готовый текст в сообщение
  • Лошадь нарисована кодом, а не картинкой: один силуэт даёт десять мастей в трёх местах страницы, а пропорции заданы анатомической сеткой — глубина корпуса равна длине ноги от локтя до земли
  • Объём даёт не заливка, а светотень: размытые пятна тени в паху, на подпруге и под гривой плюс блики по верхней линии, всё обрезано маской по силуэту
  • Грива и хвост собираются из прядей поверх сплошной массы: одни пряди дают решето, одна масса — наклейку
  • Фотографии подхватываются из папки по имени файла; если снимка нет, карточка честно показывает пустую рамку вместо выдуманной заглушки
  • Три палитры перекрашивают и вёрстку, и пигментную взвесь на canvas — цвета лежат в CSS-переменных, и фон читает их оттуда же