Уровень 2 — Адаптивные рекомендации по качеству приложений , которые подготавливают ваше приложение для отображения на экранах любого размера.
Адаптивно оптимизированные приложения используют преимущества больших экранов устройств, обеспечивая продуктивный и увлекательный пользовательский опыт.
Оптимизированные приложения создаются с использованием адаптивного дизайна, который подстраивается под портретную и альбомную ориентацию, многооконный режим, а также сложенное и разложенное состояние устройства. Навигационные панели и выдвижные меню улучшают пользовательский интерфейс, динамически форматируя и позиционируя такие элементы, как кнопки, текстовые поля и диалоговые окна, для оптимального взаимодействия с пользователем.
Адаптивно оптимизированные приложения поддерживают навигацию с помощью клавиатуры, сочетания клавиш, а также масштабирование, щелчок правой кнопкой мыши и наведение курсора на экран с помощью мыши и трекпада.
Что можно и чего нельзя делать
Делать
- Создание макетов с двумя панелями
- Используйте сеточную и столбчатую компоновку.
- Замените панели навигации на направляющие и выдвижные панели навигации.
- Используйте встраивание действий в устаревшие приложения, поддерживающие несколько действий.
- Поддержка расширенных функций клавиатуры, мыши и тачпада.
Не
- Растягивайте элементы пользовательского интерфейса (текстовые поля, кнопки, диалоговые окна), чтобы заполнить лишнее пространство.
- Растянуть или обрезать изображения
- Изготавливайте панели или листы во всю ширину.
Руководящие принципы
Следуйте рекомендациям второго уровня, чтобы оптимизировать ваши приложения для всех форм-факторов, включая большие экраны.
Пользовательский интерфейс
Поддержка экранов всех размеров на устройствах всех типов с адаптивным дизайном, обеспечивающим оптимальное взаимодействие с пользователем.
Что
Макет приложения соответствует размерам экрана. Пользовательский интерфейс приложения включает в себя:
- Передовые направляющие и выдвижные ящики для навигации
- Сеточные макеты, учитывающие изменение размера окна.
- Макеты столбцов
- Панели с задним краем, которые по умолчанию открыты на больших экранах.
Двухпанельная компоновка использует преимущества большого экранного пространства. Многофункциональные приложения реализуют встраивание действий для создания многопанельных макетов действий, расположенных рядом друг с другом.
Зоны касания большие и легкодоступные. Интерактивные элементы интерфейса позволяют фокусироваться на них.
Почему
Устройства с большими экранами включают в себя множество форм-факторов, в том числе планшеты, складные устройства, настольные компьютеры, автомобильные дисплеи и устройства расширенной реальности (XR). Размеры дисплеев различаются. Устройства часто — а иногда и преимущественно — используются в альбомной ориентации.
Как
См. обзор пользовательского интерфейса .
Клавиатура, мышь и тачпад
Поддержка внешних аппаратных устройств ввода повышает удобство использования приложения и удовлетворенность пользователей.
Рекомендации:
Что
Приложение обеспечивает расширенную поддержку ввода с клавиатуры, мыши и трекпада. Контекстные меню доступны при щелчке правой кнопкой мыши или трекпада (дополнительная кнопка мыши или дополнительное касание). Содержимое приложения можно масштабировать с помощью колесика мыши и жестов масштабирования на трекпаде. Элементы пользовательского интерфейса имеют состояния при наведении курсора.
Почему
К устройствам с большими экранами часто подключаются периферийные устройства, такие как клавиатуры, мыши и тачпады. Устройства на ChromeOS обычно имеют встроенную клавиатуру и тачпад. Пользователи привыкли использовать сочетания клавиш, несколько кнопок мыши, колесико мыши и жесты на тачпаде.
Как
См. обзор клавиатуры, мыши и тачпада .