# Ultrahuman Ring PRO — Анализ дизайна и UX > Источник: https://www.ultrahuman.com/global/ring-pro/ > Сохранено: 2026-04-02 > Цель: вдохновение для редизайна Pulse App --- ## 🎨 Визуальный дизайн сайта ### Общий стиль - **Тёмная тема** как основная — почти чёрный фон (`#0a0a0a`, `#111`), текст белый - **Акцентный цвет** — насыщенный тёмно-зелёный / teal (`#00c896` примерно), используется для иконок, индикаторов, меток состояния - **Типографика** — крупные, жирные заголовки (видимо sans-serif, похоже на Inter/Neue Haas), огромный кегль на hero-секциях - **Контраст** — очень высокий, метрики выделяются большими цифрами на тёмном фоне ### Фотографии и визуалы - Телефон в руке — реалистичные 3D-рендеры, не скриншоты - Фоновые фото людей в движении — размытые, тёмные, атмосферные (оранжевые, синие градиенты) - Каждая функция — отдельная «карточка» с реальным скриншотом приложения + фото/паттерн на фоне - Использование градиентных blob-овалов как фоновых элементов (зелёные, синие, розовые свечения) ### Компоненты - **Таб-бар** внизу экрана телефона — горизонтальный, полупрозрачный тёмный фон, активный таб белый жирный - **Карточки метрик** — скруглённые углы, плотный padding, маленький лейбл сверху + большое число - **Индикаторы статуса** — цветные теги (зелёный «Excellent», красный «Needs attention») - **Мини-графики** — sparkline прямо в карточке, тонкие линии - **Прогресс-бар** — тонкий, цветной (зелёный/красный) --- ## 📱 UX и структура приложения ### Навигация Четыре основных раздела в таб-баре: | Таб | Содержимое | |-----|-----------| | **Sleep** | Sleep Index, стадии сна, REM/Deep/Light, детальный timeline | | **Vitals** | HR, RHR, HRV, VO2 Max, Temp, Cardio Age | | **PowerPlugs** | Маркетплейс плагинов (Women's Health, Respiratory, Heart) | | **Longevity** | Ultra Age = Brain Age + Pulse Age + Blood Age | ### Ключевые экраны #### Dashboard / Longevity - Центральный элемент — **большое число** (возраст: 32, с маркером "+3 years older") - Под ним — объяснение одной фразой: *"You're currently aging at a faster aging pace than expected for your age"* - Contributors: три субметрики (Brain Age 32, Pulse Age 28, Blood Age 31) с иконками #### Sleep - Score крупно (74), под ним timeline-график сна по стадиям - Стадии: Awake, REM, Light Sleep, Deep Sleep — цветовая кодировка - Мини-гистограмма активности по ночи #### Vitals - Сетка карточек 2×n - Каждая карточка: лейбл + значение + delta (`+2`) + статус (Within typical range) + мини-sparkline - Метрики: Heart Rate, Resting HR, HRV, VO2 Max, Temp Deviation, Cardio Age #### PowerPlugs - App Store-стиль: карточки с gradient-обложками - Каждый плагин: иконка + название + категория + кнопка Get / Installed --- ## 💡 Фичи для вдохновения в Pulse ### Что можно взять напрямую | Идея | Где в Pulse | Сложность | |------|------------|-----------| | **Readiness Score как центральный элемент** — большое число, одна фраза-объяснение | Health Dashboard | Низкая — данные уже есть | | **Contributors под скором** — разбивка на 3 субметрики (сон, HRV, RHR) | Health Dashboard | Низкая | | **Цветовые статусы** — Excellent / Good / Needs attention | Везде | Низкая | | **Sparkline в карточке** — мини-график прямо рядом с числом | Health, Финансы | Средняя | | **Tab-bar снизу** — Sleep / Vitals / Habits / Finance | Главная навигация | Низкая | | **Timeline сна** — гистограмма по часам с фазами | Sleep раздел | Средняя | | **Delta значений** — `+2 bpm vs yesterday` рядом с числом | Все метрики | Низкая | ### Концепции посложнее | Идея | Описание | Сложность | |------|---------|-----------| | **"Biological Age" аналог** | Индекс долгосрочного здоровья на основе сна + HRV + активности | Высокая | | **PowerPlugs аналог** | Маркетплейс трекеров/модулей (привычки, финансы, здоровье) | Высокая | | **AI-объяснения** (как Jade) | *"Low glymphatic clearance is slowing mental recovery"* — причина + рекомендация | Высокая | | **Stress Rhythm** | Трекинг стресса по HRV в течение дня | Высокая (нет датчика) | --- ## 🖌️ Дизайн-система для адаптации в Pulse ### Цвета ``` Фон: #0d0d0d — #111111 Карточки: #1a1a1a — #1e1e1e Акцент: #00c896 (teal/зелёный) — уже близко к нашему Deep Teal Хорошо: #00c896 green Внимание: #ff4d4d red Нейтральный: #888888 gray Текст: #ffffff primary, #aaaaaa secondary ``` ### Типографика - Заголовки: очень крупные (48px+), жирные, Inter или аналог - Метрики: 32–48px, bold - Лейблы: 10–12px, uppercase, letter-spacing - Описание: 14px, regular, серый ### Карточки ``` border-radius: 16–20px padding: 16–20px background: rgba(255,255,255,0.05) или #1e1e1e ``` --- ## 📋 Приоритетный план для Pulse **Фаза 1 (быстрые wins):** 1. Редизайн Health Dashboard — большой Readiness Score + 3 contributors 2. Добавить цветовые статусы к метрикам (Excellent / Needs attention) 3. Delta значений (`+2 vs yesterday`) везде **Фаза 2 (средний срок):** 4. Sparklines в карточках метрик 5. Timeline-график сна по фазам 6. Tab-bar навигация (Sleep / Vitals / Habits / Finance) **Фаза 3 (амбициозно):** 7. AI-интерпретации метрик (Cosmo объясняет что значит HRV = 45) 8. "Pulse Age" — агрегированный индекс здоровья --- *Сохранено Cosmo, 02.04.2026*