design package · v0.2 · 2026

katama
visual system + key screens

Дизайн-система и макеты ключевых экранов для самописного имиджевого сайта-портфолио. 7 кейсов + меню-пин на сфере. Digital-minimalist подача: geometric sans, neutral cards, cool accents. Никаких editorial-serif и тёплых золотых акцентов.

8файлов 3экрана 7палитр кейсов 2viewport · mobile / desktop

Дизайн-система

01 · палитра, типографика, компоненты

ds · responsive Design system Тёмная база, 7 палитр кейсов с холодными акцентами, geometric sans + Inter + Mono, спейсинг, радиусы, кнопки, поля, лоадеры, FX-демо, motion-заметки. Открыть

Экран 1 · Hero со сферой

02 · sphere-only · idle / in-focus / drag

mobile · 390×844 · 3 frames Hero · mobile Сфера на весь экран, только угловой микро-текст. Idle / in-focus card / drag — три состояния стеком. Открыть

desktop · 1440 · 3 frames Hero · desktop Та же логика для desktop: сфера в центре, без заголовков. Focus — состояние карточки (1.5px костяная рамка), не отдельный экран. Открыть

Экран 2 · Кейс · Gentle Monster

03 · фон в палитре кейса

mobile · вертикальный скролл Case · mobile Полный экран кейса. Brief · Process · Result · Media · nav. Фон в палитре кейса с холодным акцентом. Открыть

desktop · multi-column Case · desktop Hero split + три текст-секции + media-mosaic + nav к следующему кейсу. Открыть

Экран 3 · Меню-оверлей

04 · о студии · команда · контакты

mobile · fullscreen Menu · mobile Короткий factual блок о студии, список брендов, команда (Кирилл, Маша, Женя), контакты, тихий RU/EN-линк в футере. Открыть

desktop · fullscreen Menu · desktop Центральная колонка 720px: о студии, команда, контакты. Без манифеста, без громких заголовков. Открыть

Что внутри

Digital minimalism, не editorial luxury. Geometric sans (PP Neue Montreal → Aeonik → Söhne → Inter Display → Inter), нет italic serif, нет золотых акцентов.
Тёмная база: 4 ступени графита от #0a0c10 до #3d4351. Нейтральная пустота, чуть в синеву — не «люксовый» чёрный.
7 палитр кейсов: сэмплированы из реальных визуалов в /Кейсы/. Каждый кейс получает свой холодный платиновый акцент (никакого ochre/gold).
Сфера: 8 пинов — 7 кейсов + 1 меню-пин «katama» с тонкой dashed-рамкой (bone-dim).
Focus — это состояние внутри hero, не отдельный экран. Карточка по центру получает 1.5px костяную рамку и мягкий cool inner glow, играет видео (Гоша / Аутлеты), показывает мини-подпись внутри себя. Клик → провал в case-экран.
Эффекты для R3F: chromatic aberration ≤ 1px · soft DoF · film grain 4.5%. Без bloom и warm glow.
Шрифты: PP Neue Montreal (display, лицензировать; фоллбэк на Inter) · Inter (UI/body) · JetBrains Mono (индексы и метаданные).
Двуязычность: auto-detect языка системы, тихий RU/EN-линк в футере меню. Все макеты на русском.