Цвет - это отличный способ для придания жизненности, обеспечения визуального стиля, передачи информации о состоянии, для организации обратной связи в ответ на действия пользователя, а также помощи в процессе визуализации данных. При выборе цветовых оттенков приложения, которые отлично смотрятся как по отдельности, так и в комбинации, как на светлом, так и на темном фоне, обращайтесь к системе цветов iOS.

Тщательно выбирайте цвета для общения с пользователем. Способность цвета привлекать внимание к важной информации при умеренном использовании усиливается. Например, красный треугольник, который предупреждает людей о критической проблеме, становится менее эффективным, когда красный цвет используется в другом месте приложения по некритическим причинам.

Используйте дополнительные цвета во всем приложении. Цвета в вашем приложении должны хорошо сочетаться, а не конфликтовать или отвлекать. Например, если пастели важны для стиля вашего приложения, используйте координирующий набор пастелей.

Выбирайте ограниченную цветовую палитру, которая соответствует логотипу вашего приложения. Ненавязчивое использование цвета - отличный способ сообщить о своем бренде.

Подумайте о том, чтобы выбрать оттенок, ответственный за интерактивность во всем приложении. В Заметках интерактивные элементы имеют желтый цвет. В Календаре - красного цвета. Если вы определяете оттенок цвета, который обозначает интерактивность, убедитесь, что другие цвета не противоречат этой логике.

Предоставьте две версии вашего оттенка, чтобы он выглядел хорошо как в светлых, так и в темных режимах. Если вы используете системный цвет для вашего оттенка, то получите автоматическую поддержку высокой контрастности.

Избегайте использования одного и того же цвета для интерактивных и неинтерактивных элементов. Если интерактивные и неинтерактивные элементы имеют одинаковый цвет, людям трудно понять, куда можно нажать.

Подумайте, каким образом картинки и прозрачность влияют на близлежащие цвета. Изменения в картинках иногда требуют изменений в соседних цветах для того, чтобы сохранить визуальную непрерывность и не дать элементам интерфейса стать чрезмерными или недостающими. Карты, например, отображают светлую цветовую схему при использовании режима карты, но переключаются на темную цветовую схему, когда активирован спутниковый режим. Цвета также могут выглядеть по-разному, если их размещать за полупрозрачным элементом или при применении к полупрозрачному элементу, например на панели инструментов.

Проверьте цветовую схему вашего приложения в различных условиях освещения. Освещение изменяется как в помещении, так и на улице, в зависимости от обстановки, времени суток, погоды и других обстоятельств. Цвета, которые вы видите на вашем компьютере, не всегда смотрятся одинаково, если приложение используется в реальном мире. Всегда просматривайте свое приложение при нескольких условиях освещения, в том числе на улице в солнечный день, чтобы увидеть, как проявляются цвета. При необходимости отрегулируйте их, чтобы обеспечить наилучшее качество просмотра в большинстве случаев.

Посмотрите, как дисплей True Tone влияет на цвет. Дисплей True Tone использует датчики внешней освещенности для автоматической регулировки белой точки дисплея с целью адаптации к условиям освещения текущей среды. Приложения, ориентированные в основном на чтение, фотографии, видео и игры, могут усилить или ослабить этот эффект, посредством адаптации стиля белой точки. Для руководства разработчика посмотрите UIWhitePointAdaptivityStyle.

Подумайте, как ваше использование цвета может восприниматься в других странах и культурах. Например, в некоторых культурах красный символизирует опасность. В других, красный имеет положительную коннотацию. Убедитесь, что цвета в вашем приложении отправляют соответствующее сообщение.

Избегайте использования цветов, которые мешают людям воспринимать контент в вашем приложении. Например, люди, страдающие дальтонизмом, могут быть не в состоянии различить некоторые цветовые комбинации, а недостаточная контрастность может привести к тому, что значки и текст будут смешиваться с фоном и затруднить чтение содержимого. Инструкции см. В разделе Цвет и контраст.

iOS предлагает ряд системных цветов, которые автоматически адаптируются к яркости и изменениям в настройках доступности, таких как Увеличение контрастности и Уменьшение прозрачности. Цвета системы отлично смотрятся индивидуально и в комбинации, как на светлом, так и на темном фоне, а также в светлых и темных режимах.

Не кодируйте системные значения цвета в вашем приложении. Приведенные ниже значения цвета предназначены для справки в процессе разработки приложения. Фактические значения цвета могут колебаться от версии к версии, в зависимости от различных переменных среды. Всегда используйте API для применения системных цветов. Для руководства разработчика, см. UIColor.

В iOS 13 также представлен ряд из шести непрозрачных серых цветов, которые вы можете использовать в редких случаях, когда прозрачность работает недостаточно хорошо. Например, пересекающиеся или перекрывающиеся элементы, такие как линии или столбцы в сетке, выглядят лучше с непрозрачностью. В общем, используйте семантически определенные системные цвета для элементов пользовательского интерфейса.

В дополнение к цветам оттенка iOS также предоставляет семантически определенные системные цвета для использования в фоновых областях и для содержимого переднего плана, такого как метки, разделители и заливка. Эти цвета автоматически адаптируются как к светлому, так и к темному режимам пользовательского интерфейса.

iOS определяет два набора цветов фона (системный и сгруппированный), каждый из которых содержит основной, вторичный и третичный варианты, помогающие передавать иерархию информации. В общем, используйте сгруппированный набор цветов фона, когда у вас есть сгруппированное табличное представление, в противном случае применяйте системный набор цветов фона. Руководство разработчика см. В разделе Цвета элементов пользовательского интерфейса.

Вы используете варианты для обозначения иерархии с обоими наборами цветов фона следующими способами:

• Основной для общего вида
  
  
• Вторичный для группировки контента или элементов в общем представлении
  
  
• Третичный для группировки контента или элементов внутри вторичных элементов
  
  

Для содержимого переднего плана iOS определяет следующие цвета:

Не переопределяйте смысловые значения динамических системных цветов. Чтобы дать людям единообразное понимание и убедиться, что ваш интерфейс выглядит хорошо во всех контекстах, используйте динамические системы цветов.

Не пытайтесь воспроизвести динамические системные цвета. Они могут изменяться от версии к версии, в зависимости от различных обстоятельств. Вместо того, чтобы пытаться создавать пользовательские цвета, соответствующие системным цветам, используйте динамические.

Обеспечьте цветовое пространство конкретного изображения и цветовые вариации, когда работа приложения этого требует. В целом, цвета и изображения P3 имеют тенденцию отображаться, как и ожидалось, на устройствах sRGB. Однако иногда бывает трудно различить два очень похожих цвета P3 при просмотре в sRGB. Градиенты, использующие цвета в спектре P3, также могут отображаться на устройствах sRGB. Чтобы избежать этих проблем, вы можете предоставить отдельные изображения и цвета в каталоге ресурсов вашего проекта XCode, чтобы обеспечить визуальную точность как на широкоформатных устройствах, так и на устройствах sRGB.

Заранее просматривайте цвета вашего приложения на реальных sRGB и широких цветных дисплеях. При необходимости внесите коррективы, чтобы визуальный эффект был одинаково хорош на всех типах дисплеев.