yoga studiobrand book · v1.0
brand book  /  05  /  компоненты

атомы
из чего состоит

Девять атомов, из которых собирается каждый экран. Все в Rose-стиле — другая тема невозможна.

9 атомов
05.1 карточки занятий
a · 01

пастельная карточка

Главный атом приложения. Цвет фона — категория. Внутри: название, описание, время, цена. Glass-оверлей сверху для лёгкости.

radius20px shadow0 4px 0 #e91e8c26 height96px (rose) / 88px (compact) bgpastel + 40% white overlay
a · 01
vinyasa flow
алёна · main hall
пн · 08:00 · 60мин 800₽
yin restore
маша · zen room · 4 free
ср · 10:30 · 75мин 1000₽
05.2 новости
b · 02

карточка новости

Прямоугольник с одним из 4 цветов news-палитры. Сверху мелкая мета-строка, снизу заголовок и автор. Без иконок.

radius20px height120–130px colorsyellow / pink / lavender / glass titlenunito 900 / 18px
b · 02
апр 24 · промо
скидка 30%
студия · 2 мин
апр 22 · студия
новый зал
аня · 5 мин
апр 18 · события
мастер-класс
алёна · 3 мин
апр 14 · обновление
новое расписание
студия · 1 мин
05.3 строки расписания
c · 03

строка занятия

Узкий вариант для дневного списка. Время слева в акценте, описание в центре, статус-плашка справа.

radius16px height~64px bgwhite timenunito 900 / accent
c · 03
08:0060min
vinyasa flowалёна · main hall
free · 4
10:3075min
yin restoreмаша · zen room
2 left
19:0060min
ashtanga ledиван · main hall
full
05.4 онлайн
d · 04

онлайн карточка

Тамбнейл слева (gradient или фото-плейсхолдер), описание справа. Используется в ленте online-курсов и стриминговых занятий.

radius18px thumb80×80, gradient tagsmono 700 / 9px
d · 04
дыхание для сна

15-минутная практика дыхания на расслабление. Записано с алёной.

online15 mineasy
утренний поток

Виньяса на 30 минут — для раскачки и фокуса утром.

online30 minmedium
05.5 курсы
e · 05

карточка курса

Большая пастельная карточка с прогрессом. Используется в разделе "мои курсы". Уровень — плашка сверху, прогресс — внизу.

radius20px height~190px progress6px / accent fill
e · 05
средний
основы
аштанги

8 занятий · с иваном · понедельники

прогресс5/8
начинающий
введение
в виньясу

6 занятий · с алёной · среды

прогресс2/6
05.6 календарь
f · 06

неделя в сетке

7 квадратных ячеек. Сегодня — заливка акцентом. Точка под цифрой = есть занятия в этот день.

cell1:1, 12px radius todayaccent fill + shadow marker5px circle, accent
f · 06
пн21
вт22
ср23
чт24
пт25
сб26
вс27
05.7 таб-бар
g · 07

нижняя навигация

Четыре вкладки. Активная — белая подложка плюс цветные иконка и подпись. Никаких бейджей, никаких тенек на иконках.

height72px bg#fdf2f8 activewhite bg + accent fg
g · 07
главная
занятия
онлайн
профиль
05.8 кнопки
h · 08

кнопки и cta

Три уровня плюс круглый icon-button. Никаких градиентов, никаких outline-кнопок с цветным бордером — только сплошной акцент или белый.

radius14px (rect) · 50% (icon) shadow0 3px 0 #e91e8c40 textmono 700 / 12px
h · 08
05.9 заголовок секции
i · 09

заголовок секции

Маджентовая плашка-маркер. Используется один раз в начале каждой логической группы (классы, новости, курсы).

radius14px bgaccent shadow0 4px 0 #e91e8c26
i · 09
индивидуальные занятия04 sessions
новости студии3 new
тихий вариантlight