Цвет - отличный способ придать жизни, обеспечить визуальную целостность, сообщить информацию о каком-то состоянии, дать обратную связь в ответ на действия пользователя и помочь людям визуализировать данные. Обращайте внимание на то, как устроена цветовая схема системы iOS для получения рекомендаций при выборе акцентных цветов приложения, которые отлично смотрятся индивидуально и в сочетании, а также хорошо адаптируются к режимам доступности и выбору пользователя относительно темы.
Не полагайтесь исключительно на цвет, чтобы что-то визуально отделить или передавать важную информацию. Если ваше приложение использует цвет для передачи информации, обязательно дайте какие-нибудь текстовые подписи или иконки, чтобы пользователи с дальтонизмом или другими нарушениями зрения могли это понять.
Разумно используйте цвет для общения. Способность цвета привлекать внимание к важной информации усиливается при экономном использовании. Например, красный треугольник, предупреждающий о критической проблеме, становится менее эффективным, когда красный цвет используется в другом месте приложения для некритических причин.
Подумайте о выборе ограниченной цветовой палитры, которая согласуется с логотипом вашего приложения. Деликатное использование цвета - отличный способ донести информацию о вашем бренде.
Подумайте о выборе какого-инбудь цвета для обозначения интерактивности во всем приложении. В приложении заметки интерактивные элементы желтого цвета; в календаре интерактивные элементы красного цвета. Если вы задаете акцентный цвет, который обозначает интерактивность, убедитесь, что другие цвета в вашем приложении не конфликтуют с ним.
Создайте две версии вашего акцентного цвета, чтобы убедиться, что он хорошо выглядит как в светлой, так и в темной темах. Когда вы используете системный цвет для своего акцентного цвета, вы получаете автоматическую поддержку 2 тем.
Избегайте использования одного и того же цвета для интерактивных и неинтерактивных элементов. Если интерактивные и неинтерактивные элементы имеют один и тот же цвет, людям трудно понять, куда тапать.
Рассмотрите, как иллюстрации, картинки и прозрачность влияют на близлежащие цвета. Вариации любых изображений иногда требуют коррекции близлежащих к ним цветов для поддержания визуальной целостности и предотвращения того, что элементы интерфейса станут забирать все внимание или не достаточно акцентными. Карты, например, используют светлую тему в режиме карты, но переключаются на темную в режиме вида со спутника. Цвета также могут отличаться при размещении позади или использовании на полупрозрачном элементе, такой как панель инструментов.
Протестируйте цветовую схему вашего приложения в различных условиях освещения. Освещение значительно варьируется как в помещении, так и на открытом воздухе, в зависимости от обстановки в помещении, времени суток, погоды и многого другого. Цвета, которые вы видите на своем компьютере, не всегда будут выглядеть одинаково, когда ваше приложение используется в реальном мире. Всегда просматривайте приложение при различных условиях освещения, в том числе на открытом воздухе в солнечный день, чтобы увидеть, как отображаются цвета. При необходимости скорректируйте цвета, чтобы обеспечить наилучшее качество просмотра в большинстве юзкейсов.
Учитывайте, как технология True Tone влияет на цвет. Дисплей с технологией True Tone использует датчики окружающего освещения для автоматической настройки точки белого дисплея для адаптации к условиям освещения текущей среды. Приложения, которые в основном сосредоточены на чтении, фотографиях, видео и играх, могут усилить или ослабить этот эффект, указав стиль адаптации к точке белого на дисплее.
Подумайте, как цвета могут быть восприняты в других странах и культурах. В некоторых культурах, например, красный цвет означает опасность; в других красный имеет положительные коннотации. Убедитесь, что цвета в вашем приложении отправляют соответствующий посыл в зависимости от регион.
Избегайте цветов, которые могут затруднить восприятие контента в вашем приложении. Например, дальтоник может не различать некоторые сочетания цветов, а недостаточная контрастность может привести к тому, что иконки и текст будут сливаться с фоном и затруднят чтение контента для пользователей с ограниченными возможностями.
iOS предлагает ряд системных цветов, которые автоматически адаптируются к яркости и изменениям в настройках специальных возможностей, таких как увеличение контрастности и уменьшение прозрачности. Системные цвета отлично смотрятся по отдельности и в сочетании, как на светлом, так и на темном фоне, а также как в светлой, так и в темной темах.
Не задавайте принудительно значения системным цветам в приложении. Приведенные ниже значения цвета предназначены для референса в процессе разработки приложения. Фактические значения цвета могут варьироваться от релиза к релизу в зависимости от различных переменных окружающей среды.
iOS 13 также имеет ряд из шести непрозрачных серых цветов, которые вы можете использовать в редких случаях, когда прозрачность не работает. Например, пересекающиеся или перекрывающиеся элементы, такие как линии или полосы в сетке, выглядят лучше с непрозрачностью. В общем, используйте семантически определенные системой цвета для интерфейса.
Помимо цветов оттенков, iOS также имеет семантически заданные системные цвета, которые автоматически адаптируются как к светлой, так и к темной темам. Семантический цвет передает назначение, а не внешний вид или значения цвета. Например, iOS имеет цвета для использования в фонах и для содержимого переднего плана, такого как лейблы (подписи), разделители и заливка.