Fluent Design System to od czasów Windows 10 wiodący styl designu w produktach Microsoftu. Zastąpił on estetykę Flat/Metro z epoki Windowsa 8, ale współistniał jeszcze z innym płaskim stylem, określanym jako Corporate Memphis, choć gigant posługuje się tu inną nazwą. Przez ostatnią dekadę Fluent ewoluował i można to łatwo zaobserwować, porównując choćby wygląd Windows 10 i 11. A jak zmienił się styl ilustracji?
Ilustracje pełnią ważną rolę w komunikowaniu myśli i idei. Zwykle towarzyszą tekstowi, wideo i innym środkom przekazu, a czasem całkowicie je zastępują. Jak w przypadku każdego innego medium, również tu trendy przychodzą i odchodzą. Przykładowo w latach 90. bez żenady wrzucaliśmy do dokumentów Cliparty, by później wyszukiwać obrazy w Internecie, a nawet generować je przy pomocy AI. W obecnym świecie technologii trendy wizualne często wyznaczają najwięksi giganci z sektora big tech, tacy jak Facebook/Meta, Microsoft, Google i Apple. Jako że na CentrumXP interesuje nas głównie ekosystem Microsoft, to jemu przyglądamy się z zaciekawieniem i śledzimy inspirujące posty, które co jakiś czas wrzuca dział Microsoft Design. Ten dzisiejszy dotyczy ilustracji. Jeśli o nie chodzi, na pewno spotkaliście się z grafikami w tym stylu:
Tę grafikę Microsoft podpisał jako wizualne odniesienie do poprzedniego płaskiego, opartego na postaciach i wektorach stylu ilustracji Fluent. My tu w ogóle Fluentu nie widzimy, za to zidentyfikowaliśmy podręcznikowe użycie estetyki Corporate Memphis, którą w okolicach 2017 roku rozpromował Facebook, a następnie podchwycili niemal wszyscy (niekoniecznie ku naszej uciesze). Tak czy inaczej Microsoft Design twierdzi, że ten styl odchodzi do lamusa (w końcu!), a teraz nadszedł czas na dalszą ewolucję Fluent Design System. Sprawdźmy, co projektanci graficzni piszą na ten temat:
Podczas gdy zespół Brand w Microsoft aktywnie pracuje nad ewolucją swoich zasad marki, pojawiła się możliwość partnerstwa, która pozwoli zarówno naszej marce, jak i produktom wzrastać razem w zgodzie z misją i wartościami firmy. Integracja kształtów i symboli z naszego języka designu Fluent zarówno w przygodach użytkownika, jak i kampaniach marketingowych, wygeneruje większą spójność i harmonię dla naszych klientów, wspierając tym samym bardziej płynną podróż użytkownika od początku do końca. Aby to osiągnąć, musieliśmy najpierw ugruntować nasze ilustracje w naszych uniwersalnych zasadach marki: ludzkiej, żywej, wymiarowej.
Ewolucja naszych ilustracji Fluent oznacza rozwinięcie osobowości naszych produktów i utworzenie dynamicznych doświadczeń użytkownika. Mając to na uwadze, obraliśmy za cel przygotowanie biblioteki ilustracji, które odzwierciedlałyby zabawność, współpracę i inkluzywność, napędzając przy tym inspirację i połączenie. Doprowadziło to do 5 zasad, które kierują dziś naszą pracą ilustratorską.
— Microsoft Design
Wspomniane zasady zawierają się w 5 punktach:
- Ludzkość (Humanity). Kształty, kolory i symbole niosą szerokie znaczenie kulturowe. Ilustracje Microsoftu są inkluzywne, włączające perspektywy pracowników z całego świata i odzwierciedlające ideały oraz wartości firmy. Znaczące jest tu odejście od przedstawiania portretów indywidualnych osób zanurzonych w konkretnych scenariuszach służbowych na rzecz uproszczonych symboli ludzkiej kreatywności i produktywności, które rezonują z szerszym spektrum czynności i kultur. Pozwoli to uniknąć wzmacniania stereotypów i zamiast tego promuje wiadomość o kolektywnym potencjale i jedności ludzkości, co czyni te ilustracje łatwo dostępnymi i ponadczasowymi.
- Kolor i gradienty (Color and Gradients). Wybór odpowiedniej palety kolorów ma znaczący wpływ na nastrój i emocje. Przez pewien okres Microsoft posługiwał się stonowaną paletą, którą zamienił na bardziej żywą – a więc też energetyzującą i inspirującą.
- Wymiar (Dimension). W przeszłości ilustracje bywały postrzegane jako "naklejki" czy "dekoracje" umieszczane w interfejsie użytkownika, aby dopełnić jego doświadczenie. Aby ożywić te doświadczenia produktów, Microsoft zdecydował się wyrzeźbić trójwymiarowe kształty i figury z ich powierzchni oraz zaprojektować ilustracje wtopione w interfejs.
- Wyrafinowanie (Sophistication). Wraz z dojrzewaniem smaku i percepcji klientów ewoluować muszą w parze także metody angażowania Microsoftu. Odchodząc od stylu ilustracji, który stanowił echo czystości i niewinności bajek dziecięcych, Microsoft aspiruje do bardziej wyrafinowanej estetyki. Ten nowy kierunek faworyzuje rendery 3D, dające poczucie głębi i ruchu, uchwycające złożoność i bogactwo dorosłej wyobraźni. Wyrafinowane rendery zapraszają do kontemplacji, mnogości interpretacji oraz przeżywania różnych emocji. Ma to pomóc Microsoftowi połączyć się z klientami na głębszym poziomie.
- Wesołość (Playful). Wyrafinowanie jest kamieniem węgielnym tego nowego kierunku, ale równie istotna jest wesołość. Wizerunek marki Microsoft balansuje gdzieś pośrodku tych dwóch krańców. Poprzedni styl ilustracji stawiał na ostre kontury i bardziej prostolinijne kompozycje z dużym poczuciem dosłowności. Przejście do bardziej płynnych (nomen omen – fluid) form ma zapewnić wrażenia rytmu i żywotności. Projektanci zaadaptowali organiczne kształty, krzywe i asymetrie, czyli elementy odzwierciedlające świat naturalny (pamiętacie skeumorfizm?), co pozwoli eksplorować abstrakcyjne idee i oderwać się od sztywnych ram. Wesołość to także ruch, dlatego w ilustracjach spotkamy też dynamiczne elementy.
Omawiany tu styl ilustracji zaczął przenikać do produktów Microsoftu już kilka lat temu, dlatego mamy tu raczej do czynienia z kolejnym rozdziałem w ewolucji Fluent Design System aniżeli z radykalną zmianą. Więcej na temat estetyki stosowanej przez Microsoft Design pisaliśmy w artykułach:
- Czy Windows 10 może się nadal podobać?
- Microsoft przeprojektowuje ponad 100 ikon w oparciu o Fluent Design
- System wewnątrz systemu, czyli jak zostały zaprojektowane nowe ikony w Windows 10?
- Fluent UI. Jak prezentuje się wieloplatformowy Fluent Design System?
- Nowe tła na spotkaniach Teams - jak zostały zaprojektowane?
- Fluent Mobile, czyli o tym, jak Microsoft wprowadza Fluent Design na Androida i iOS
- Microsoft prezentuje nowe Emoji 3D dla Windows i Teams
- Fluent w Office 365 dopiero raczkuje. Jak to widzą jego designerzy?
Źródło: https://microsoft.design/articles/embracing-vibrant-universality-in-fluent-illustrations
