Trend projektowania interfejsu Glassmorphism na rok 2023

May 06 2023
Zrozumienie pochodzenia, przypadków użycia i twórców tego fenomenu nowoczesnego projektowania Wprowadzenie Glassmorphism to trend w projektowaniu interfejsu użytkownika, który pojawił się w 2020 r., urzekając zarówno projektantów, jak i użytkowników wyglądem przypominającym matowe szkło, półprzezroczystymi elementami i żywymi kolorami. To nowoczesne zjawisko projektowania zostało przyjęte przez niektóre z największych nazwisk w branży technologicznej, w tym Microsoft i Apple, i trafiło na różne platformy cyfrowe.

Zrozumienie pochodzenia, przypadków użycia i twórców tego fenomenu współczesnego projektowania

Źródło: https://uxmisfit.com/2021/02/03/glassmorphism-guide-to-visual-hierarchy/

Wstęp

Glassmorphism to trend projektowania interfejsów użytkownika, który pojawił się w 2020 roku i urzeka zarówno projektantów, jak i użytkowników wyglądem przypominającym matowe szkło, półprzezroczystymi elementami i żywymi kolorami.

To nowoczesne zjawisko projektowania zostało przyjęte przez niektóre z największych nazwisk w branży technologicznej, w tym Microsoft i Apple, i trafiło na różne platformy cyfrowe.

Cechy charakterystyczne:

  • Wygląd przypominający matowe szkło — elementy interfejsu użytkownika przypominają półprzezroczyste lub półprzezroczyste szklane powierzchnie.
  • Półprzezroczyste elementy — komponenty interfejsu mają różne poziomy przezroczystości, tworząc efekt warstw.
  • Rozmycie tła — rozmyte tła dodają głębi i poprawiają wizualną hierarchię interfejsu.
  • Żywe kolory — szkłomorfizm często obejmuje jasne, żywe kolory, które kontrastują z półprzezroczystymi elementami.
  • Światła i cienie — użycie subtelnych świateł i cieni poprawia trójwymiarowy wygląd i tworzy wrażenie głębi.
  • Podświetlanie obramowania — elementy interfejsu użytkownika mogą zawierać podświetlenia obramowania lub akcenty, które pomagają zdefiniować ich krawędzie i kształt.

Początki Glassmorphism sięgają wprowadzonego w 2017 roku systemu Microsoft Fluent Design System, który zawierał materiał akrylowy — półprzezroczysty, rozmyty efekt tła. Apple wkrótce poszedł w jego ślady, wprowadzając aktualizację macOS Big Sur w 2020 roku, zawierającą podobne elementy wizualne. Trend projektowy zyskał powszechną popularność, gdy projektanci zaczęli przyjmować i rozszerzać te zasady, ostatecznie ukuwając termin „szklanomorfizm”, aby opisać charakterystyczny szklany wygląd elementów interfejsu użytkownika.

Przypadki użycia dla glassmorfizmu

  • Projektowanie stron internetowych i aplikacji: Glassmorfizm dodaje odrobinę nowoczesności i głębi do interfejsów stron internetowych i aplikacji, czyniąc je atrakcyjnymi wizualnie i atrakcyjnymi dla użytkowników.
  • Interfejsy pulpitu nawigacyjnego: Półprzezroczyste elementy morfizmu szklanego można wykorzystać do tworzenia bogatych w informacje interfejsów pulpitu nawigacyjnego, w których karty i widżety wydają się unosić nad zawartością tła.
  • Karty i modale: Efekt matowego szkła jest szczególnie odpowiedni dla kart i modali, ponieważ poprawia hierarchię wizualną i pomaga wyróżnić te elementy na tle.
  • Projekty przycisków: Przyciski Glassmorphic mogą zapewnić użytkownikom wyjątkowe wrażenia dotykowe, zachęcając do interakcji i zaangażowania.
  • Microsoft: Wraz z Fluent Design System firma Microsoft wprowadziła materiał akrylowy, prekursor morfizmu szkła, który prezentował rozmyte tła i półprzezroczyste elementy w interfejsie użytkownika.
  • Apple: Aktualizacja systemu macOS Big Sur zawiera elementy glassmorphic, co dodatkowo wzmacnia obecność trendu projektowego w nowoczesnych interfejsach cyfrowych.
  • Ulepszona hierarchia wizualna: rozmyte tła i półprzezroczyste elementy morfizmu szkła tworzą wrażenie głębi i warstw, ułatwiając użytkownikom poruszanie się po złożonych interfejsach.
  • Nowoczesna estetyka: Elegancki, futurystyczny wygląd Glassmorphism dodaje odrobiny wyrafinowania platformom cyfrowym, odróżniając je od konkurencji.
  • Zaangażowanie użytkownika: Dotykowy, interaktywny charakter elementów glassmorphic może zachęcić użytkowników do eksploracji i interakcji z interfejsami cyfrowymi.
  • Dostępność: po prawidłowym wdrożeniu morfizm szkła może poprawić czytelność i dostępność interfejsów cyfrowych, szczególnie dla użytkowników z wadami wzroku.

Pomimo wielu zalet morfizm szkła stwarza również pewne potencjalne wyzwania:

  • Problemy z czytelnością: półprzezroczyste elementy morfizmu szklanego, jeśli nie zostaną wykonane ostrożnie, mogą prowadzić do problemów z czytelnością, zwłaszcza gdy są używane ze złożonymi lub zagraconymi tłami.
  • Obawy dotyczące wydajności: efekty wizualne związane z morfizmem szkła, takie jak rozmycie i przezroczystość, mogą wymagać dużych zasobów, potencjalnie wpływając na wydajność interfejsów internetowych i aplikacji na wolniejszych urządzeniach.
  • Nadużywanie efektów: Jak w przypadku każdego trendu projektowego, istnieje ryzyko nadużywania elementów glassmorphic, co może skutkować przesadnym lub zagraconym wyglądem. Znalezienie właściwej równowagi między estetyką a funkcjonalnością ma kluczowe znaczenie dla skutecznego projektu glassmorphic.
https://www.microsoft.com/design/fluent/
https://www.apple.com/pl/newsroom/2020/06/apple-introduces-macos-big-sur-with-a-beautiful-new-design/
https://opensea.io/
https://open.spotify.com/

Końcowe przemyślenia

Glassmorphism stał się popularnym trendem w projektowaniu UX, oferującym atrakcyjną wizualnie i nowoczesną estetykę interfejsów cyfrowych. Podczas gdy morfizm szkła stwarza pewne potencjalne wyzwania, takie jak problemy z czytelnością i wydajnością, jego zalety w zakresie zwiększania hierarchii wizualnej, promowania zaangażowania użytkowników i poprawy dostępności sprawiają, że jest to atrakcyjny wybór dla projektantów, którzy chcą tworzyć urzekające cyfrowe doświadczenia.

Przyszłość glassmorfizmu wydaje się obiecująca, ponieważ trend w projektowaniu nadal zyskuje na popularności zarówno wśród projektantów, jak i firm technologicznych. Jego atrakcyjna wizualnie, nowoczesna estetyka może dalej ewoluować i dostosowywać się do pojawiających się technologii, takich jak interfejsy rzeczywistości wirtualnej (VR) i rzeczywistości rozszerzonej (AR). Jednak jego trwałość będzie zależała od zdolności projektantów do zrównoważenia estetyki z funkcjonalnością, sprostania wyzwaniom, takim jak czytelność i wydajność, przy jednoczesnym zachowaniu charakterystycznego wyglądu przypominającego szkło, który sprawia, że ​​morfizm szkła jest tak urzekający. Tak długo, jak projektanci będą w stanie skutecznie sprostać tym wyzwaniom, morfizm szkła prawdopodobnie pozostanie popularnym i wpływowym trendem projektowym w nadchodzących latach.

Dziękuję bardzo za przeczytanie i mam nadzieję, że dostarczyłem kilku cennych informacji. A także, jeśli kiedykolwiek pojawią się jakiekolwiek pytania lub wątpliwości dotyczące treści, które piszę, nie wahaj się skontaktować lub zostawić komentarz!

Jeśli chcesz być na bieżąco z najnowszymi informacjami dotyczącymi UX, projektowania i kariery, rozważ subskrypcję mojej listy e-mailowej ! Możesz również wesprzeć moją pracę, rejestrując się w członkostwie Medium, korzystając z mojego linku polecającego , ponieważ otrzymuję procent opłaty. Zainwestuj w swój rozwój i pomóż mi tworzyć dla Ciebie bardziej wartościowe treści.