Распространенные ошибки при разработке приложений ОС Аврора
- Отсутствие удобных обложек
- Неправильный выбор цвета для элемента
- Неправильное выравнивание, размер или интервал
- Слишком маленькие области касания интерактивных элементов
- Слишком много элементов в вытягиваемом меню
- Отображение неактивных элементов вытягиваемого меню
- Отсутствие индикаторов прокрутки
- Использование кнопок вместо жестов
- Отсутствие текстовых подсказок для полей ввода
- Отсутствие конфигурации кнопки «Enter»
Отсутствие удобных обложек
Активная обложка должна предоставлять достаточно сведений о содержимом приложения и о любых текущих задачах, а также предлагать ускоренный запуск любых часто выполняемых действий, таких как сохранение нового элемента или выполнение поиска.
Неправильный выбор цвета для элемента
Ключевая задача стиля элементов пользовательского интерфейса в ОС Аврора — сообщать пользователю, является ли элемент интерактивным (реагирующим на нажатие).
Для кнопок, переключателей, элементов списка и других интерактивных элементов в неактивном
состоянии применяется основной цвет Theme.primaryColor текущей атмосферы.
Для неинтерактивных элементов содержания, таких как текстовые метки, заголовки страниц и разделов,
применяется цвет подсветки Theme.highlightColor текущей атмосферы.
Выбор цвета для текстовой метки на примере
Поскольку метка не является интерактивной, корректно применять цвет Theme.highlightColor.
Цвет подсветки Theme.highlightColor должен применяться для текста и иконок интерактивных
элементов управления в момент их нажатия.
Выбор цвета для интерактивного элемента на примере
Слева элемент списка не меняет основной цвет Theme.primaryColor при нажатии, что не соответствует
стилю ОС Аврора, справа элемент списка при нажатии, как и ожидается, меняет цвет и окрашивается
в Theme.highlightColor.
Компоненты Silica со встроенным текстом, такие как Button, ComboBox и ContextMenu, будут
автоматически менять цвет текста при нажатии.
Неправильное выравнивание, размер или интервал
Использование единой логики размеров, интервалов и выравнивания очень важно для визуальной привлекательности, читаемости приложений. Элементы и содержимое пользовательского интерфейса приложения должны быть корректно и последовательно настроены в соответствии со стандартами ОС Аврора, тщательно выровнены на экране, их размеры должны задаваться в соответствии со стилем ОС Аврора.
При проектировании интерфейса важно не забывать о принципах близости и схожести:
- Внутренние расстояния элемента должны быть меньше внешних.
- Элементы, схожие по размеру, очертаниям, цвету или форме, имеют тенденцию восприниматься вместе.
В приложениях ОС Аврора текст и иконки в элементах управления, за редким исключением,
позиционируются на странице с отступами Тheme.horizontalPageMargin слева и справа
и Theme.paddingLarge сверху и снизу.
Вровень с краями страницы, за редким исключением, располагаются только графические элементы
и изображения (например, изображения в приложении «Галерея» или обложки музыкальных альбомов
в приложении «Медиа»).
Позиционирование относительно краев страницы на примере
Слишком маленькие области касания интерактивных элементов
Чтобы успешно попасть по маленькой области касания интерактивного элемента, от пользователя требуется гораздо больше когнитивных усилий. У большинства компонентов интерфейса ОС Аврора отсутствуют визуальные границы области касания, поэтому чем меньше область касания, тем выше вероятность ошибки при нажатии или выполнении других жестов.
Между областями касания элементов, расположенных столбцом, в ряд или другим способом, интервала нет. Интервал между элементами реализован за счет того, что область элемента меньше его области касания.
Размер интерактивных элементов не должен быть меньше Theme.itemSizeSmall.
Как правило, большинство интерактивных элементов имеет размер Theme.itemSizeMedium или больше,
в зависимости от их сложности.
Слишком много элементов в вытягиваемом меню
Число элементов в вытягиваемых меню следует сводить к минимуму. В традиционной панели инструментов для мобильных приложений невозможно размещение 6—8 элементов. Аналогичные ограничения установлены для вытягиваемого меню ОС Аврора.
Большинство меню в приложениях платформы содержат от одного до трех действий, в вытягиваемые
PullDownMenu или PushUpMenu рекомендуется добавлять не более четырех.
Отображение неактивных элементов вытягиваемого меню
Некоторые пункты вытягиваемых меню активны только когда выполнены определенные условия. Если все пункты вытягиваемого меню в текущий момент находятся в неактивном состоянии, все меню целиком должно быть скрыто. Показывать пользователю вытягиваемое меню, которое невозможно использовать, некорректно.
Отсутствие индикаторов прокрутки
В приложениях ОС Аврора содержимое страницы может выходить за границы отображения на экране. В этом случае необходимо применять индикаторы прокрутки. Они указывают текущее положение окна просмотра и подсказывают объем содержимого за пределами отображения на экране.
Использование кнопок вместо жестов
В ОС Аврора традиционные кнопки «Подтвердить» и «Отменить» заменяются аналогичными жестами для подтверждения или отмены действия пользователя.
Вытягиваемое меню заменяет традиционную панель инструментов приложений.
Жесты следует применять везде, где это возможно, чтобы пользовательский опыт (user experience) в приложении соответствовал опыту в стандартных приложениях платформы.
В частности, следует использовать тип Dialog вместо Page и DialogHeader вместо PageHeader.
Обработка жестов и нажатий на кнопки в заголовке диалогового окна осуществляется с помощью
обработчиков сигналов accepted и rejected.
Отсутствие текстовых подсказок для полей ввода
В ОС Аврора текстовое поле описывается для пользователя свойствами placeholderText и label.
Пока текстовое поле не заполнено, в нём отображается значение свойства placeholderText — текст,
помогающий понять, какую информацию необходимо ввести в поле.
При вводе в текстовое поле первого символа placeholderText скрывается, но под полем ввода
начинает отображаться значение свойства label.
Отсутствие конфигурации кнопки «Enter»
Нажатие кнопки «Enter» не создает новых строк в однострочном текстовом поле, следует переопределить
её назначение с помощью свойств типа EnterKey.
Обычно кнопка ввода используется для перевода фокуса клавиатуры на следующее текстовое поле. Если это поле является последним на странице, то кнопку «Enter» можно использовать для сохранения или отправки введенных данных/внесенных изменений. Если подобные действия не применимы, то функция кнопки «Enter» может быть переопределена, чтобы при нажатии на неё происходило закрытие экранной клавиатуры.
