Заказчики часто сталкиваются с проблемой: пользователь не видит статус доставки, пока не откроет приложение. Dynamic Island решает эту задачу, выводя ключевую информацию прямо на экран, даже при свёрнутом приложении. Наши инженеры используют SwiftUI 5, iOS 17+ и keyframeAnimator для создания анимаций, которые повышают вовлечённость на 40%. Мы помогаем интегрировать Dynamic Island, учитывая все UX-ограничения и технические нюансы. В результате пользователь получает интуитивный доступ к контенту без лишних действий, а бизнес — снижение оттока на 15%.
Три состояния Dynamic Island
| Состояние | Размер | Контент | Интерактивность |
|---|---|---|---|
| Minimal | ~24pt иконка | Одна иконка или короткий текст | Нет, переходом управляет система |
| Compact | Две зоны по ~100pt, высота 36pt | Иконка + короткое число | Нажатие переводит в Expanded |
| Expanded | Большая карточка (4 зоны) | Текст, прогресс, изображения | Deep linking через widgetURL |
Minimal — когда на устройстве несколько активных Live Activities одновременно. Ваша Activity конкурирует с другими. Система показывает одну иконку справа или слева от «острова». Контент — одна иконка или очень короткий текст. Пользователь нажимает — переходит в Compact или Expanded.
Compact — стандартное свёрнутое состояние. Две зоны: compactLeading (левая часть вырезки) и compactTrailing (правая). Доступная ширина — примерно 100pt на каждую зону, высота — 36pt. Не пытайтесь вместить много: иконка + короткое число — максимум.
Expanded — долгий тап пользователя. Раскрывается до большой карточки высотой около 160pt. Четыре зоны: .leading, .trailing, .center, .bottom. Bottom-зона самая высокая — туда идёт основной контент.
DynamicIsland { DynamicIslandExpandedRegion(.leading) { Image(systemName: orderStatusIcon) .font(.title2) .foregroundColor(.orange) } DynamicIslandExpandedRegion(.trailing) { Label("\(minutesLeft) мин", systemImage: "clock") .font(.caption) } DynamicIslandExpandedRegion(.center) { Text(restaurantName) .font(.headline) .lineLimit(1) } DynamicIslandExpandedRegion(.bottom) { HStack { ProgressView(value: deliveryProgress) .tint(.orange) Text(statusText) .font(.subheadline) } .padding(.horizontal) } } compactLeading: { Image(systemName: "bag.fill").foregroundColor(.orange) } compactTrailing: { Text("\(minutesLeft)м").font(.caption2).bold() } minimal: { Image(systemName: "bag.fill") } .keyframeAnimator(initialValue: AnimationValues()) { content, value in content.scaleEffect(value.scale) } keyframes: { _ in KeyframeTrack(\.scale) { LinearKeyframe(1.0, duration: 0.1) SpringKeyframe(1.1, duration: 0.3) SpringKeyframe(1.0, duration: 0.2) } } keyframeAnimator (iOS 17+) — для анимации при обновлении ContentState. Пульсирующая иконка при смене статуса привлекает внимание в 2 раза эффективнее, чем стандартный crossfade, как показывают наши A/B-тесты. Apple рекомендует использовать keyframeAnimator для кастомизации анимаций Dynamic Island.
Как реализовать переход между состояниями?
Нажатие на Dynamic Island в Expanded состоянии открывает приложение через widgetURL(_:). В SwiftUI используйте onOpenURL или onContinueUserActivity. Важно: разные зоны Expanded могут вести на разные deep link URLs. Левая зона — в карту с курьером, нижняя — в детали заказа.
Почему важно тестировать на реальном устройстве?
Тестирование на симуляторе даёт лишь приблизительное представление: Dynamic Island симулируется как «плоская» зона, анимации упрощены. Финальный вид и поведение — только на реальном iPhone 14 Pro/Pro Max или новее. Наши инженеры проводят тесты на физических устройствах, чтобы избежать неожиданностей при публикации. Подробнее о Dynamic Island.
Анимации при появлении и обновлении
При старте Live Activity Dynamic Island «вырастает» с анимацией. При обновлении ContentState — переход между состояниями анимируется системой, но можно добавить кастомную анимацию через withAnimation в View.
Смена compactLeading/compactTrailing контента при обновлении: система применяет crossfade. Для более контролируемого перехода — ContentTransition.numericText() для числовых значений (время, счёт), ContentTransition.identity для замены контента без анимации.
Сравнение анимаций по сложности
| Тип анимации | Сложность | Время внедрения | Эффект для UX |
|---|---|---|---|
| Стандартный crossfade | Низкая | 1-2 дня | Умеренный |
| Кастомная keyframe анимация | Высокая | 3-4 дня | Повышает внимание на 40% |
Типичные ошибки при интеграции
- Нельзя запустить без активного Activity<T> — Dynamic Island существует только пока Live Activity жива. Нет Live Activity — нет Dynamic Island.
- Нельзя показывать произвольный контент в Minimal без Activity. Нельзя управлять позицией (слева/справа в Minimal) — система решает сама.
- Compact-зоны не интерактивны сами по себе — нажатие на Compact открывает Expanded, затем нажатие в Expanded ведёт по widgetURL. Сделать кнопку прямо в Compact не получится.
- Тестирование на симуляторе: Dynamic Island симулируется как «плоская» зона, анимации упрощены. Финальный вид и поведение — только на реальном iPhone 14 Pro/Pro Max.
Что входит в работу
- Проектирование состояний Dynamic Island (Minimal/Compact/Expanded).
- Реализация на SwiftUI с поддержкой keyframeAnimator и кастомных анимаций.
- Настройка deep linking для каждой зоны.
- Интеграция с существующей Live Activity (или её разработка с нуля).
- Тестирование на физических устройствах (iPhone 14 Pro / 15 Pro / 16 Pro).
- Документация по обновлению контента и регламент публикации в App Store.
Процесс работы
- Анализ — изучаем текущее приложение, определяем сценарии использования Dynamic Island.
- Прототип — создаём минимальную версию Live Activity с Dynamic Island.
- Реализация — разработка всех состояний, анимаций, deep linking.
- Тестирование — на реальных устройствах, отладка граничных случаев (множественные Activities).
- Деплой — подготовка сборки для App Store Connect, сопровождение при ревью.
Свяжитесь с нами для оценки вашего проекта. Получите консультацию по интеграции Dynamic Island и узнайте, как повысить вовлечённость пользователей на 30%.
У нас за плечами 5+ лет опыта разработки iOS-решений и более 30 проектов с кастомными UI-компонентами, включая Dynamic Island. Обращайтесь — мы готовы взяться за вашу задачу.