Флагманский кейс студии эстетики лица: процедурная световая топография лица на WebGL вместо стокового портрета, шейдер-грейдинг «индекса сияния» по скроллу, бенто потребностей кожи с FLIP-раскрытием и тест «Код кожи», который собирает готовую заявку в WhatsApp. Динамическая световая среда перекрашивает интерфейс под раздел. Дизайн и код — InterLAB. Студия вымышленная, это витрина подхода.
point-cloud · профиль
это не скриншот — в рамке настоящий сайт · наведите, чтобы выпрямить
боль ниши
Клиника показывает шприцы и «до/после» в жёстком свете, а прайс пишет на языке аппаратов: SMAS, BBL, биоревитализация. Человек не понимает, что он получит, боится боли и неестественности — и закрывает вкладку, так и не дойдя до записи.
решение
Никакого шок-контента: сайт говорит про сияние и ровный тон, а кожа набирает свет прямо на глазах у пользователя. Прайс переразложен по потребностям — «сияние», «упругость», «увлажнение», — протокол безопасности открыт по шагам, а вместо формы «оставьте телефон» стоит разбор из четырёх вопросов, который уходит в WhatsApp готовой картой процедур.
Кожа, которая держит свет
Oranienbaum — высококонтрастная антиква с родной кириллицей: перепад штрихов читается как гравировка, а узкие формы дают заголовку уместиться в строку. Geist — технический гротеск для набора и цен. Мода против точности, а не Playfair с Inter — и половина «дорогих» бьюти-шрифтов отпала сразу, кириллицы у них нет.
стек
Первый экран — не стоковая модель и не крупный план с иглой у лица, а рельеф лица, собранный прямо во фрагментном шейдере: сумма гауссиан даёт надбровные дуги, спинку носа, скулы и подбородок, поверх идут изолинии, и по ним за курсором скользит тёплый луч. Ни одной фотографии — значит, нечему выглядеть стоком, и весит это ноль байт.
GLSL · procedural relief
Бьюти-сайты зажаты в один статичный бежевый. Здесь тон интерфейса — состояние: наведение на потребность кожи, раскрытие карточки и ответ в тесте перекрашивают световую среду всей страницы (янтарь → платина → акварин → лиловый). Пользователь буквально управляет атмосферой.
dynamic tone theming
Стандартный слайдер до/после в косметологии показывает акне и морщины в жёстком свете — это вызывает отторжение. Мы меняем не форму, а свет: по скроллу один и тот же макро-портрет проходит грейдинг от холодной «городской кожи» к тёплой влажной, по кромке вайпа едет блик, рядом растёт счётчик. Продаём приобретение лоска, а не избавление от дефекта.
scroll grading · wipe
«SMAS», «BBL», «биоревитализация» ничего не говорят человеку без медобразования. Сетка собрана по тому, что видно в зеркале: сияние, упругость, увлажнение, рельеф. Клик разворачивает карточку FLIP-анимацией прямо в сетке — соседи перетекают вниз, оверлей и блокировка скролла не нужны. Внутри — «формула ухода»: из чего складывается цена.
bento · FLIP
Главный страх ниши — не боль, а неизвестность. Протокол 01→04 вынесен в отдельную главу: по вертикали идёт свет, шаги загораются по очереди. А вместо формы «оставьте телефон» — разбор из четырёх вопросов, который собирает предварительную карту процедур и уходит в WhatsApp вместе с ответами: в мессенджер приходит контекст, а не голый номер.
trust · wa.me
Честно
«Тон Studio» — вымышленная студия: флагман-демо шоурума InterLAB, цены, бренды препаратов и цифры — иллюстрация формата, а не реальная практика. Такой же сайт под ваш реальный бизнес собирается с вашими услугами, фото и номером WhatsApp.
Покажем черновик на нашем поддомене до любых оплат. WebGL-герой, бенто по потребностям и тест с выводом в WhatsApp — как в демо, но с вашими протоколами и ценами.