Иконография в Windows

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

Windows 11 использует три типа значков: приложения, системы и типа файлов. В этой статье рассматриваются первые два.

Совет

В этой статье описывается применение языка Fluent Design к приложениям Windows. Дополнительные сведения см. в разделе Fluent Design — Iconography.

Значки приложения

Значки приложения представляют приложение в оболочке Windows. Они в основном используются для открытия приложения, но они также представляют приложение, где бы оно ни отображалось в оболочке Windows.

Значки приложений должны представлять основные функциональные возможности приложения через метафору. Дополнительные сведения о проектировании и создании значка приложения см. в разделе "Значки приложений".

Системные значки

Используйте системные значки внутри пользовательского интерфейса приложения для таких элементов, как панели команд, индикаторы навигации или состояния. В Windows 11 представлен новый шрифт значка системы Segoe Fluent Icon. Этот новый шрифт дополняет геометрию в Windows 11.

Все глифы в Segoe Fluent Icons выполнены в монолинейном стиле. Это означает, что они создаются одним штрихом толщиной 1 epx.

Глифы в Segoe Fluent Icons следуют трем эстетическим принципам.

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

Дополнительные сведения об использовании значков в пользовательском интерфейсе приложения см. в разделе "Значки" в приложениях Windows.

Размер значка

Метрики шрифта для Значков Segoe Fluent соответствуют тому, как конструкторы и разработчики привыкли работать с SVG и значками растрового изображения.

Каждый глиф шрифта разработан таким образом, чтобы пространство области значка было квадратным em. Значок с размером шрифта 16 epx эквивалентен значку 16x16-epx, чтобы сделать размер и размещение более предсказуемым.

Модификаторы

Вы можете визуально создать глифы системных значков, объединив базовый значок с значком модификатора.

Базовые значки являются основным элементом визуальной метафоры . Базовые элементы должны занимать весь объем значка.

Значки модификатора изменяют значение базового значка. Элементы модификатора должны размещаться в одном из нижних квадрантов области значка.

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

Значок базы + значок модификатора
Добавление стрелки вверх к значку файла изменяет значение значка для представления отправленного файла.

Наслоение

Метод наложения иконок — это техника, используемая для перекрытия двух символов. Мы рекомендуем использовать слой значков для создания другого состояния одного значка (например, активного или выбранного состояния).

Локализация

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

Примеры

Откройте приложение коллекции WinUI 3 и просмотрите принципы значков в действии

Приложение WinUI 3 Gallery включает интерактивные примеры большинства элементов управления, функций и возможностей WinUI 3. Получение приложения из Microsoft Store или получение исходного кода на GitHub