Android-приложение NailLounge для онлайн-записи в студии
Разработали отдельный Android-канал для NailLounge: booking-first приложение на Jetpack Compose, где клиент выбирает услугу, студию, мастера, дату и время, а запись создаётся через защищённый cache/proxy-слой с источником mobile_app.
Итог: Собран проверяемый MVP-контур Android-приложения: фирменный Material 3 UI, навигация записи, профили студий и мастеров, интеграция с Nail-Lounge-Cache, AppMetrica-события и roadmap до production-релиза без раскрытия YCLIENTS-токенов.
Product surface
Website + web booking
7
ключевых экранов booking-flow в MVP
3
канала NailLounge связываются через одну booking-архитектуру
1.8×
font scale, который учитывается в Android UX-проверках
API key
мобильный клиент не хранит YCLIENTS partner token
01 / Brief
С чем пришёл клиент
После запуска сайта и Telegram Mini App у NailLounge появился следующий продуктовый слой: нативный Android-канал, где постоянный клиент может записаться без браузера, сохранить любимую студию и быстрее вернуться к повторной записи.
Приложение нельзя было делать отдельной витриной с собственной логикой: источником правды остаются YCLIENTS и Nail-Lounge-Cache, а дизайн должен продолжать брендовую систему студий — espresso, cream, ember, крупные CTA и спокойные motion-состояния.
Главный риск мобильного релиза — безопасность и нагрузка на расписание. Нативный клиент не должен хранить чувствительные iClient/YCLIENTS-токены, а запросы дат и слотов должны проходить через proxy/cache-слой с warmup, idempotency и диагностикой.
02 / Execution
Как мы это решали
Решения разложены как цепочка продуктовых слоёв: от входа в запись до аналитики, кэша и SEO-структуры. Каждый слой поддерживает основной сценарий, а не существует ради отдельной технологии.
MVP как единый booking-маршрут
В приложении собран маршрут Home → Services → Studios → Masters → DateTime → Confirm → Success, плюс экраны салонов, профиля мастера, визитов и профиля клиента. Выборы сохраняются в состоянии навигации, чтобы пользователь не терял контекст между шагами.
Cache API вместо прямого раскрытия токенов
Android вызывает Nail-Lounge-Cache через Retrofit и X-API-Key: salons, services, masters, nearest-slots, available-days-summary, slots, warmup-hint и mobile book. Чувствительные YCLIENTS/iClient данные остаются на серверной стороне.
Предзагрузка доступности до открытия календаря
При выборе услуги, студии или мастера приложение отправляет warmup-hint, затем грузит summary дней и prefetch ближайших слотов. Повторный тап по дате может отработать из свежего in-memory cache, а аналитика фиксирует источник network, prefetch или memory.
Any master и «Молчаливый мастер» как реальные сценарии
MVP поддерживает выбор конкретного мастера или любого доступного мастера, а услуга «Молчаливый мастер» вынесена в отдельный toggle. При создании записи этот контекст попадает в comment и source mobile_app.
Доступность до визуальной полировки
Приложение проектируется под Android-реальность: 44dp touch targets, читаемая плотность, high text contrast, font_scale 1.8, safe zones и сценарий без hover-зависимостей. На Pixel уже зафиксирована необходимость тестировать крупный системный шрифт.
Аналитика как часть продукта
AppMetrica встроена как отдельный AnalyticsTracker. События booking_dates_load_success, booking_slots_prefetch_success, booking_submit_success/error и ошибки загрузки позволяют видеть не только факт записи, но и место потери клиента.
03 / Design system
Мобильная версия Studio Ember
Android-приложение наследует дизайн-систему сайта, но переводит её на Material 3: тёмная espresso-сцена, кремовые панели, один яркий orange-action, крупные нижние CTA и понятные состояния загрузки/ошибки/успеха.
Registered token rail
Цвета показаны как роли дизайн-системы, а не как декоративная палитра.
Background
--brand-color-background
Inverse text and host-required white background.
Foreground
--brand-color-foreground
Primary ink, CTA text on ember, dense copy on cream.
Accent
--brand-color-accent
Single dominant action, active focus, emotional emphasis.
Surface
--brand-color-surface
Warm editorial panels, fields and light sections.
Muted
--brand-color-muted
Dark stage, footer metadata, overlays behind imagery.
Border
--brand-color-border
Rules, card outlines, form borders.
Accent secondary
--brand-color-accent-secondary
Secondary text on dark stage, quiet links, dividers.
Measured copper
reference color
Measured evidence from reference surfaces, not a primary token.
Component specimen
Запись в студию
Nail artist
Маникюр, укрепление, дизайн
State
Контекст сохранён
Палитра
ink, ember, cream
CTA
один orange-action
Mobile
touch-first booking
Motion
hero + micro states
Компоненты
shared token contract
Флоу
сайт ведет в запись
Compose tokens
Палитра зафиксирована в ui/theme: DarkPrimary #F97316, DarkBackground #1D1410, DarkSurface #251912, LightBackground #FBF5E8. Голубого focus-цвета в Android-контракте нет.
Material 3 без шаблонности
Используем привычные Android-паттерны — bottom CTA, карточки выбора, календарь, списки мастеров — но сохраняем брендовый характер NailLounge через цвет, плотность и tone of voice.
Readable density
MvpReadableDensity защищает ключевой сценарий от поломки на крупном системном шрифте: интерфейс остаётся плотным, но не превращается в мелкий desktop-макет на телефоне.
Motion как обратная связь
Анимации не отвлекают от записи: лёгкий вход экранов, состояния загрузки дат/слотов, акцент на выбранном времени и спокойный success state после создания записи.
04 / Android app
Как выглядит мобильный сценарий записи
Визуальный блок собран из реальных экранов Android-приложения: быстрый старт на главной, выбор услуги, выбор мастера, свободные слоты и финальная проверка записи.
Главная с быстрой записью
Клиент видит выбранную услугу, салон, мастера и ближайшее окно прямо на первом экране.
Выбор услуги
148 услуг, поиск, категории и отдельный toggle для сценария «Молчаливый мастер».
Выбор мастера
Есть сценарий «Любой мастер», рейтинги, фото сотрудников и переход к профилю мастера.
Дата и свободные слоты
Календарь показывает плотность доступности, а выбранное время фиксируется sticky CTA.
Проверка записи
Финальный экран собирает время, услугу, мастера, студию и контакты перед подтверждением.
Compose UI
Экран держит выбор услуги, студии, мастера, даты, времени и контактов.
ViewModel
StateFlow управляет загрузкой, selected slot, ошибками и success-состоянием.
Cache API
Retrofit-слой вызывает summary, slots, warmup и mobile book через API key.
YCLIENTS
Запись создаётся через серверный слой, а мобильный клиент не видит токены.
source
Каждая запись маркируется как mobile_app
warmup
Доступность прогревается до открытия календаря
44dp
Touch targets и сценарий под реальные Android-экраны
no PII
Аналитика событий без лишних персональных данных
04 / Stack
На чём собрано
Технический стек показан как производственная схема: интерфейс, интеграции и инфраструктура поддерживают одну цепочку записи.
Android
- Kotlin 2.4, Gradle 9.4, AGP 9.2, JDK 17
- Jetpack Compose BOM 2026.06.01 и Material 3
- Navigation Compose, Lifecycle runtime, SplashScreen
- minSdk 24, compileSdk/targetSdk 37
Архитектура
- Clean Architecture: domain, data, ui, di
- Hilt 2.60, KSP, repository interfaces и ViewModel StateFlow
- Retrofit + OkHttp + kotlinx.serialization
- TokenStore, AppSettingsStore и NoOpCacheService как сменяемый contract
Интеграции
- Nail-Lounge-Cache: salons, services, masters, available-days-summary, slots, warmup-hint, mobile book
- YCLIENTS API как fallback/read layer в текущем MVP
- AppMetrica AnalyticsTracker для booking_* событий
- Coil 3 для медиа студий и мастеров
05 / Evidence
Визуальные артефакты кейса
Визуалы поданы как продуктовые артефакты: мобильный flow, архитектура cache/proxy и дизайн-система Android-экранов.
Product surfaces
Главная не является маркетинговым экраном: она сразу показывает выбранный контекст записи и ведёт в подтверждение.
Связанные материалы
Как этот проект связан с экосистемой NailLounge
Вопросы, которые чаще всего задают по проекту
Коротко по техническим и продуктовым решениям NailLounge.
Приём заявок временно приостановлен
Мы временно не обрабатываем заявки через форму. Свяжитесь с нами напрямую:
- Email: it@nextprism.ru
- Телефон: +7 904 555 92 92