Дизайн карты: новый формат Wallet в iOS 27
В iOS 27 у карты лояльности появляется новый формат — постер с крупным фоновым изображением. В Pikarta можно подготовить оба вида одной карты: классический и постерный, настроить цвета и добавить быстрые действия.
В релизе 1.7 мобильного приложения появятся постеры для Apple Wallet на iOS 27, готовые цветовые темы и быстрые действия на карте. Настройте оформление под свой бренд — от фонового изображения до кнопок звонка и магазина. На iOS ниже 27 и на Android карта сохранит классический вид.
На скриншотах интерфейс приложения на английском языке.
Что меняется в iOS 27
Постер делает фотографию или фирменную графику главным элементом карты. В шапке остаются логотип и название бизнеса, в нижней части — баланс и имя держателя, а также описание награды. Штрихкод остаётся частью карты.
Два вида одной карты
Откройте «Дизайн карты» и листайте превью горизонтально: классическая карта и постер находятся на соседних страницах. Под постером есть отметка iOS 27 с пояснением совместимости. На iOS ниже версии 27 и на Android используется классический вид, поэтому подготовьте оба оформления.
Название карты
Укажите название бизнеса — оно отображается в шапке рядом с логотипом. Название обязательно для сохранения. Используйте короткое узнаваемое имя без лишних слов и проверьте его в обоих превью.
Цвет фона, текста и подписей
В настройках темы отдельно выбираются цвет бренда, цвет основного текста и цвет подписей. Если появляется предупреждение о низком контрасте, измените цвета или фоновое изображение. Проверьте читаемость баланса, имени и подписей поверх фотографии.
Логотип
Выберите эмодзи или загрузите логотип. Для изображения подойдёт квадратный PNG с прозрачным фоном, желательно от 256 × 256 пикселей. Проверьте, что знак и название хорошо различимы в шапке классической карты и постера.
Классический баннер
На странице классической карты загрузите горизонтальный баннер. Обрезка в приложении помогает подготовить изображение с пропорциями около 2,6:1. Этот вариант оформления нужен и клиентам с iOS 26 и более ранними версиями. Без баннера карта использует цвет бренда.
Изображение для постера
На странице постера загрузите отдельное вертикальное изображение и настройте обрезку. Если отдельного постера нет, используется баннер, а если нет и его — цвет бренда. Горизонтальный баннер может сильно обрезаться: отдельное фото даст больше контроля над композицией.
Оставляйте нижнюю часть спокойной: там Wallet размещает данные карты. Не встраивайте баланс, условия программы или штрихкод в картинку — для них есть отдельные поля.
Быстрые действия
На странице постера откройте инструмент действий. Можно добавить до двух кнопок: заказ, магазин, запись или звонок. Для первых трёх укажите HTTPS-ссылку, для звонка — номер телефона. Названия и значки кнопок в Wallet выбирает система.
На iOS 27 действия отображаются под картой. На более ранних версиях iOS этих кнопок нет.
Проверка и сохранение
Перед сохранением посмотрите оба превью: фон, название, баланс, подписи и обрезку изображения. Превью помогает оценить дизайн; окончательную раскладку проверяйте в самом Wallet.
Сохранение запускает обновление уже выданных карт. Получение изменений зависит от подключения устройства и работы Wallet, поэтому они могут появиться не сразу. Для проверки откройте карту на iPhone после сохранения.
Предыдущая версия статьи
Инструкция для прежнего редактора карты. Сохранена для справки; отдельные настройки и описание поведения могут отличаться от версии 1.7.
Дизайн карты
Карту в Wallet видит каждый ваш клиент — сделайте её узнаваемой. Можно изменить название, цвет, логотип и баннер в любое время. Карты у всех клиентов обновятся автоматически.
Экран «Дизайн карты» в настройках приложения
Название карты
Название отображается в верхней части карточки в Wallet клиента. Обычно это название вашего бизнеса.
Советы по названию:
Цвет бренда
Цвет — основной фон карточки в Wallet. Выберите из предложенной палитры цвет который ассоциируется с вашим брендом.
Логотип
Логотип показывается в левом верхнем углу карточки рядом с названием. Есть два варианта:
Рекомендации для загружаемого логотипа: минимум 256×256 px, PNG с прозрачным фоном, квадратный формат.
Баннер
Баннер — фоновое изображение которое заменяет однотонный цвет бренда. Он занимает верхнюю часть карточки в Wallet и делает её визуально богатой и запоминающейся.
Баннер отлично подходит для рекламных целей:
Технические требования
Предпросмотр
В верхней части экрана «Дизайн карты» всегда виден живой предпросмотр — именно так карта будет выглядеть у клиентов в Wallet. Используйте его чтобы убедиться что дизайн выглядит как надо перед сохранением.