В iOS 13 для представления задач и режимов в вашем приложении или более поздней версии предпочтительнее использовать символы SF. Если ваше приложение работает в iOS 12 или более ранней версии или если вам необходимо создать собственные растровые значки, следуйте приведенным ниже инструкциям.

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

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

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

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

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

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

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

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

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

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

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

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

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

Ширина и высота цели (круглые символы)

Целевая ширина и высота (квадратные символы)

Целевая ширина (широкие символы)

Высота цели (высокие символы)