Ikonografia w Windows

Ikonografia to zestaw obrazów i symboli wizualnych, które ułatwiają użytkownikom zrozumienie i przejście przez aplikację. Ikony są używane w całym interfejsie użytkownika jako metafory wizualne, które reprezentują koncepcję, akcję lub stan.

Windows 11 używa trzech typów ikon: aplikacji, systemu i typu pliku. Ten artykuł koncentruje się na dwóch pierwszych.

Wskazówka

W tym artykule opisano sposób stosowania języka projektowania Fluent Design do aplikacji Windows. Aby uzyskać więcej informacji, zobacz Fluent Design — Iconography.

Ikony aplikacji

Ikony aplikacji reprezentują Twoją aplikację w powłoce Windows. Są one używane głównie do otwierania aplikacji, ale również reprezentują aplikację wszędzie tam, gdzie jest wyświetlana w powłoce Windows.

Ikony aplikacji powinny reprezentować podstawowe funkcje aplikacji za pomocą metafory. Aby uzyskać więcej informacji na temat projektowania i konstruowania ikony aplikacji, zobacz Ikony aplikacji.

Ikony systemowe

Użyj ikon systemowych w interfejsie użytkownika aplikacji dla elementów, takich jak paski poleceń, nawigacja lub wskaźniki stanu. Windows 11 wprowadzono nową czcionkę ikony systemu, Segoe Fluent Icon. Ta nowa czcionka uzupełnia geometry w Windows 11.

Wszystkie glify w ikonach Segoe Fluent są rysowane w stylu monoliniowym. Oznacza to, że są one tworzone za pomocą pojedynczego pociągnięcia o grubości 1 epx.

Glify w Segoe Fluent Icons są zgodne z trzema zasadami estetycznymi.

• Minimalny: Glify zawierają tylko szczegóły niezbędne do przekazywania pojęcia.
• Harmonijne: Glify są oparte na prostych i geometrycznych formach.
• Ewoluowany: Glify posługują się nowoczesnymi metaforami, które są łatwe do zrozumienia.

Aby uzyskać więcej informacji na temat używania ikon w interfejsie użytkownika aplikacji, zobacz Icons w aplikacjach Windows.

Rozmiar ikony

Metryki czcionek dla ikon Segoe Fluent Icon pasują do tego, jak projektanci i deweloperzy są przyzwyczajeni do pracy z ikonami SVG i mapy bitowej.

Każdy glif czcionki jest zaprojektowany tak, aby obszar ikony miał kształt kwadratu o boku długości em. Ikona o rozmiarze 16-epx jest odpowiednikiem ikony 16x16-epx, aby rozmiar i pozycjonowanie były bardziej przewidywalne.

Modyfikatory

Możesz wizualnie skonstruować glyphs ikony systemu, łącząc ikonę podstawową z ikoną modyfikatora.

ikony podstawowe są głównym elementem metafory wizualnej. Podstawowe elementy powinny zajmować całą powierzchnię ikony.

Ikony modyfikatora modyfikują znaczenie ikony podstawowej. Elementy modyfikujące powinny być umieszczone w jednej z dolnych ćwiartek obrysu ikony.

ikona podstawowa tylko
Samodzielnie ikona arkusza papieru komunikuje koncepcję pliku .

ikona podstawowa i ikona modyfikatora
Dodanie strzałki w górę do ikony pliku zmienia znaczenie ikony, aby oznaczać przesłany plik.

Warstwowanie

Warstwowanie ikon to technika, której używasz do nakładania się dwóch glifów. Zalecamy użycie warstw ikony w celu utworzenia innego stanu tej samej ikony (na przykład aktywnego lub wybranego stanu).

Lokalizacja

Poznaj konotacje kulturowe symboli. Chociaż ikonografia nie wymaga lokalizacji w większości przypadków, niektóre ikony mogą być dopuszczalne w jednej kulturze, ale nie w innej. Zweryfikuj opcje ikonografii przy użyciu kontekstu, w którym będą używane.

Examples

Otwórz aplikację Galerii WinUI 3 i zobacz Zasady ikonografii w działaniu

Aplikacja Galeria WinUI 3 zawiera interaktywne przykłady kontrolek i funkcji WinUI. Pobierz aplikację z Microsoft Store lub przejrzyj kod źródłowy GitHub.