Glassmorphism i UX/UI-Design: Den genomskinliga trenden

Glassmorphism, som fick sitt namn och populariserades av UI-designern Michal Malewicz år 2020, har snabbt blivit en framträdande stil inom UX/UI-design. Denna stil utmärker sig genom sin användning av transparens och oskärpa för att efterlikna effekten av frostat glas, vilket bidrar till ett djup och skapar en unik upplevelse som skiljer sig från tidigare designstilar. Till skillnad från skeumorfismen, som eftersträvar att efterlikna verkliga objekt, syftar glassmorphism till att bidra med en känsla av glas snarare än en exakt representation av materialet.
Intressant nog kan designstilens rötter spåras tillbaka till Apples operativsystem iOS 7 år 2013, som introducerade UI-element med en halvtransparent, frostat glaseffekt. Denna tidiga användning av glasliknande element har influerat utvecklingen av glassmorphism som en distinkt och långlivad trend inom digital design.
Vad är Glassmorphism?
Glassmorphism kombinerar oskärpa med transparens för att ge pixlarna ett genomskinligt utseende, likt frostat glas. Denna designstil använder diffussering, reflektioner och tunga skuggor för att skapa en känsla av realism och djup, ofta med användning av ljusa färger och övertoningar under ”glaset” för att skapa dramatiska effekter. Vidare används det ofta olika nivåer av transparens på olika delar av gränssnittet, vilket bidrar till en effekt av olika lager. För att underlätta för användaren att navigera och förstå gränssnittet, integreras ofta tydliga konturer eller kanter. Dessa hjälper till att skilja mellan olika delar av gränssnittet och förbättrar därmed användbarheten och tillgängligheten.

Användningsområden för Glassmorphism inom UI
- Genom att framhäva vissa element med glaseffekten kan designstilen effektivt skapa en visuell hierarki som vägleder användarna mot viktiga element.
- Glaseffekten är särskilt användbar för att dra uppmärksamhet till specifika element i gränssnittet, såsom notiser, knappar eller viktiga meddelanden. Genom att använda glassmorphism kan dessa element sticka ut från resten av designen.
- Designstilen gör instrumentpaneler (Dashboards) i appar visuellt slående och hjälper användaren att snabbt uppfatta datavisualiseringen.

Fler exempel där Glassmorphism används



Mer läsning
- Michal Malewiczs artikel om Glassmorphism i användargränssnitt
- Mer om Glassmorphism (interaction-design.org)
- Webbdesign på Wikipedia.