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

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

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

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

Значок абстрактного приложения для гипотетического приложения карт.

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

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

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

Значок корзины от Значки Segoe Fluent.

Windows 11 представлен новый системный шрифт значка Segoe Fluent Icons. Этот новый шрифт дополняет геометрию в Windows 11.

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

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

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

Определение размера

Значок принтера правильного размера.

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

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

Структура

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

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

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

Значок файла.

Только базовый значок
Сам по себе значок бумажного листа сообщает о концепции файла.

Значок файла, наложенный значком стрелки вверх.

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

Организация уровней

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

Черно-белый значок папки и бежевый значок папки без контуров равен бежевой папке с черным контуром.

Локализация

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

Примеры

Совет

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