В то время как разработчики приложений предоставляют основной контент, значки и пользовательские действия для своих медиаприложений, автопроизводители имеют возможность гибко настраивать общее визуальное оформление. Это гарантирует, что сторонние медиаприложения будут восприниматься как неотъемлемая часть информационно-развлекательной системы автомобиля.
Что могут кастомизировать автопроизводители
- Настройка панели приложений : положение, стиль и конкретные функциональные элементы панели медиаприложений.
- Настройка стиля отображения : заголовок приложения (положение и стиль), а также визуальное оформление элементов сетки и списка.
- Оформление интерфейса воспроизведения : расположение и стиль окна воспроизведения, включая свернутую панель управления.
- Разработка интерфейса поиска : внешний вид клавиатуры, элементов интерфейса и оформление результатов поиска.
- Отображение фирменной символики приложения : как значок приложения располагается на экранах с контентом и как акцентный цвет приложения интегрируется в пользовательский интерфейс.
Настройте панель приложений
Панель приложений — это основной элемент навигации и брендинга для мультимедийных приложений в автомобилях со встроенной системой Google. Она предоставляет пользователям информацию о том, где они находятся в приложении, и обеспечивает быстрый доступ к важным функциям, таким как поиск и просмотр.
Вы можете настроить панель приложений в соответствии с маркой вашего автомобиля, используя элементы дизайна для изменения ее внешнего вида, компоновки и функциональности.
Анатомия
Панель мультимедийных приложений обычно состоит из следующих элементов:
- Значок навигации: Обычно это стрелка «назад» для возврата к предыдущему экрану.
- Брендинг приложения: логотип или название вашего приложения.
- Вкладки: Навигационные ссылки для категорий верхнего уровня, таких как «Просмотр» или «Поиск».
- Значки действий: контекстные действия, такие как значок поиска.
Настройте внешний вид
Используйте токены дизайна, чтобы панель приложений соответствовала системной теме вашего автомобиля. Токены позволяют определять цвета и типографику, которые автоматически обновляются во всем пользовательском интерфейсе.
- Фон: Установите цвет фона и прозрачность панели приложения, используя соответствующие маркеры поверхности.
- Типографика: Используйте фирменный шрифт и его начертание для заголовка приложения и подписей вкладок, сопоставив их с системными типографическими токенами.
- Значки: Убедитесь, что значки навигации и действий имеют одинаковые размеры и цветовые обозначения для обеспечения читаемости во время вождения.
Функциональные конфигурации
Управление вкладками
Вы можете выбрать, какие вкладки будут отображаться на панели приложения в зависимости от структуры вашего приложения. Типичные настройки включают:
- Стандартный интерфейс: вкладки для категорий, таких как плейлисты, исполнители и альбомы.
- Интеграция с поиском: специальная вкладка или значок поиска на панели приложения для быстрого доступа к клавиатуре или голосовому поиску.
Оформление витрин
Для обеспечения целостного внешнего вида вы можете выбрать способ отображения логотипа или фирменной символики приложения на панели приложения. Вы можете выбрать один из следующих вариантов:
- Показать логотип: Разместите логотип приложения рядом со значком навигации.
- Показать заголовок: если логотип не предоставлен, используйте текст в качестве названия приложения.
Просмотр стилей
Режимы просмотра позволяют пользователям изучать медиаконтент в виде сеток и списков. Автопроизводители могут настраивать эти режимы просмотра, чтобы обеспечить соответствие медиаконтента фирменному стилю автомобиля и общему дизайну системы.
Настройка заголовка
Заголовок страницы предоставляет контекст для определения текущего местоположения пользователя в иерархии контента. Вы можете настроить следующие параметры заголовка:
- Положение и оформление: отрегулируйте вертикальное расположение и визуальное оформление заголовка, включая высоту и обработку фона.
- Элементы заголовка: Настройте отдельные компоненты, такие как стиль текста заголовка и внешний вид дополнительных значков.
Элементы сетки и списка
Медиаконтент организован в виде сеток или списков, что помогает пользователям эффективно просматривать его. Вы можете настроить эти макеты для улучшения читаемости и удобства быстрого просмотра:
- Оформление элементов: Настройте внешний вид отдельных элементов, включая размер и форму миниатюр, а также типографику заголовков и подзаголовков.
- Выбор макета: выберите между форматом сетки или списка в зависимости от типа отображаемого контента (например, используйте сетку для обложек альбомов и списки для названий треков).
- Состояния фокусировки: Определяют, как элементы отображаются при их выборе или выделении пользователем.
Макеты воспроизведения в стиле
В режиме просмотра воспроизведения пользователи получают элементы управления и метаданные для воспроизводимого в данный момент медиаконтента. Автопроизводители могут настраивать внешний вид этого режима и свернутой панели управления, чтобы создать целостный интерфейс, соответствующий бренду автомобиля.
Анатомия в режиме воспроизведения
В окне воспроизведения обычно отображаются следующие компоненты:
- Обложка альбома: визуальное представление современных медиа.
- Метаданные: информация, такая как название трека, имя исполнителя и название альбома.
- Элементы управления воспроизведением: основные действия, такие как воспроизведение, пауза, пропуск и перемешивание.
- Индикатор выполнения: визуальный индикатор текущего прогресса на трассе, часто включающий в себя указатель направления.
Параметры настройки
Вы можете использовать элементы дизайна для изменения визуального стиля воспроизведения.
Главный экран воспроизведения
- Фон и наложения: настройте цвет фона, градиенты или уровни прозрачности в соответствии с темой вашей системы.
- Типографика: Задайте шрифт, размер и толщину для названий треков и информации об исполнителе, используя системные типографические токены.
- Оформление элементов управления: настройте форму, цвет и стиль значков кнопок воспроизведения (например, воспроизведение, пауза, следующий трек), чтобы они соответствовали другим элементам управления системы.
- Индикатор выполнения: оформите дорожку и ползунок индикатора выполнения, используя фирменные цвета.
Минимизированная панель управления (MCB)
Свернутая панель управления позволяет пользователям управлять воспроизведением мультимедиа, одновременно перемещаясь по другим частям системы. Вы можете настроить:
- Расположение и компоновка: Определите, где автоматический выключатель отображается на экране и как элементы расположены внутри него.
- Видимость элементов: выберите, какие элементы управления (например, воспроизведение/пауза или пропуск) будут отображаться в свернутом состоянии.
- Оформление: Используйте единые цвета и закругленные углы, чтобы панель управления выглядела как неотъемлемая часть пользовательского интерфейса системы.
Разработайте наложение поиска.
Встроенный поиск в приложении — это важнейшая функция, позволяющая пользователям быстро находить медиаконтент, находясь в автомобиле. Разработчики приложений предоставляют контент для поиска, а автопроизводители отвечают за разработку интерфейса поиска, включая клавиатуру и отображение результатов.
дизайн клавиатуры
В зависимости от режима движения автомобиля, поисковое окно использует различные конфигурации клавиатуры в зависимости от его положения.
- Стандартная клавиатура: отображается, когда автомобиль припаркован. Это полнофункциональная клавиатура для ручного ввода текста.
- Клавиатура, оптимизированная для вождения: отображается во время движения автомобиля. В этой версии обычно приоритет отдается голосовому вводу, и она может предлагать упрощенный ручной ввод или подсказки для минимизации отвлечения внимания водителя.
Автопроизводители могут настраивать визуальный стиль этих клавиатур — например, форму клавиш, цвет фона и типографику — используя системные токены дизайна, чтобы он соответствовал фирменному стилю автомобиля.
Результаты поиска по стилю
После того, как пользователь введёт запрос, результаты отобразятся во всплывающем окне. Вы можете настроить следующие параметры этого представления:
- Макет и интервалы: Определите, как группируются результаты поиска и какое расстояние между элементами отводится для лучшей читаемости.
- Внешний вид элементов: Настройте стиль элементов списка в результатах поиска, включая стиль шрифта для заголовков и подзаголовков, а также размер соответствующих миниатюр.
- Пустое состояние и состояние ошибки: Задайте внешний вид всплывающего окна, когда результаты не найдены или возникает ошибка подключения.
Отображение фирменной символики приложения
Для создания целостного мультимедийного опыта в автомобилях со встроенным Google можно настроить интеграцию брендинга сторонних приложений в пользовательский интерфейс системы. Это гарантирует, что, хотя пользователь и знает, какое приложение он использует, визуальное оформление останется согласованным с общим дизайном автомобиля.
Элементы бренда
Вы можете настроить размещение и интеграцию следующих элементов, специфичных для вашего приложения:
- Значок приложения: основной визуальный идентификатор медиасервиса.
- Дополнительный цвет: фирменный цвет, предоставленный разработчиком приложения.
- Название приложения: текстовое название медиасервиса.
Параметры настройки
Используйте элементы дизайна, чтобы определить, как эти элементы фирменного стиля будут отображаться на разных экранах.
Размещение и оформление иконок
Вы можете гибко настраивать отображение значка приложения в медиаинтерфейсе:
- Расположение: Определите, где значок приложения будет отображаться на экранах с контентом, например, на панели приложения или в окне воспроизведения.
- Масштабирование и форма: Используйте системные токены для определения размера и радиуса скругления углов значка, чтобы он соответствовал другим значкам системного уровня.
Добавьте акцентные цвета.
Акцентные цвета приложения можно использовать для того, чтобы ненавязчиво подчеркнуть фирменный стиль приложения, не перегружая пользовательский интерфейс автомобиля:
- Адаптивный стиль: вы можете выбрать, как использовать акцентный цвет приложения в компонентах пользовательского интерфейса, таких как индикаторы выполнения, индикаторы активных вкладок или кнопки.
- Нормализация цвета: Обеспечьте соответствие цветов, предоставляемых приложением, требованиям к контрастности для безопасности и удобочитаемости, применяя определенные системой цветовые преобразования.
лучшие практики проектирования
- Поддерживайте системную гармонию: убедитесь, что брендинг приложения не отвлекает от основной задачи вождения и не противоречит общесистемной тематике автомобиля.
- Приоритет — читаемость: если вы используете акцентный цвет приложения для текста или значков, убедитесь, что он соответствует необходимым коэффициентам контрастности с выбранным фоном.
- Последовательное применение: Применяйте правила брендинга единообразно во всех сторонних медиа-приложениях, чтобы обеспечить предсказуемый пользовательский опыт.
- Используйте системные токены: всегда сопоставляйте параметры брендинга с предоставленными токенами дизайна для обеспечения совместимости с будущими обновлениями системы.