Een goede app draait om veel meer dan alleen eersteklas code. Eén van de belangrijkste aspecten is design. We vroegen aan Sr. Visual & UX Designer bij Pinch Roel Orth wat dé UI-trends van dit moment zijn.
UI-design: voor bruikbare en aantrekkelijke apps
User interface (UI) is de grafische schil die een gebruiker en een systeem met elkaar laat communiceren. UI-design is de discipline die digitale producten – in het geval van Pinch apps – bruikbaarder en aantrekkelijker maakt door visueel design toe te voegen aan het UX-design. UI-designers gebruiken daarvoor functionaliteiten als schermen, knoppen, scrolfuncties en formulieren. Wil je gebruikers kunnen pleasen, dan moet jouw app een eigentijds UI-design hebben. Sr. Visual & UX Designer bij Pinch Roel Orth legt uit wat dé UI-trends van dit moment zijn.
Micro-animaties
Roel: “Animaties zijn niet alleen eye candy, maar kunnen ook een betere user experience geven. Neem micro-animaties, die een boodschap kunnen overbrengen en zo een emotionele band creëren tussen de interface en de gebruiker. Stel, de gebruiker plaatst een product in een winkelmandje en het mandje licht op met een geanimeerd vinkje om te laten zien dat de actie is gelukt. Dit geeft de gebruiker positieve feedback en brengt hem of haar in een positieve flow. Een micro-animatie haalt bovendien het statische gevoel weg én maakt een app levendig.”
Glassmorphism
Roel: “Apple gebruikt het al lang binnen macOS en iOS: glassmorphism, oftewel glasachtige effecten bij achtergronden of wanneer iets wordt uitgelicht. Het is een moderne look, die breed toepasbaar is op verschillende huisstijlen en net dat beetje extra glans geeft. Het resultaat? De gebruiker ervaart een gevoel van luxe. Naast Apple zetten ook andere bedrijven deze stijl al een tijdje in. Ik verwacht dat de populariteit het komende jaar flink toeneemt.”
Holographic-neon
Roel: “Deze stijl zie ik vaak terugkomen bij games en cryptogerelateerd design. Het is een futuristische, abstracte cyberspace-achtige stijl met referenties naar films als Tron. Veel kleurverlopen, duidelijke typografie met grote letters en cijfers. De slagschaduw om diepte te creëren die we de afgelopen jaren vaak hebben gezien, wordt steeds meer gecombineerd met een glow-effect.”
“Deze stijl past zeker niet bij elke branding. In de Proudwheels-app voor autoliefhebbers die we vorig jaar hebben gereleaset is deze stijl verwerkt. Zo wilde ik het gevoel van bewegingssnelheid, koplampen in het donker en neon oproepen. De inspiratie kwam vooral uit games als Cyberpunk, Asphalt en Gran Turismo.”
Aurora-achtergronden
Roel: “Een prachtige achtergrondstijl. Qua vorm kun je denken aan een oneindig heuvellandschap of iets met golven. Het zijn mooie abstracte vormen met samenhangende kleuren. Goede voorbeelden zijn de achtergronden die je op macOS en iOS vindt. Ze zijn rustig voor het oog en geven contrast met het deel waarop je je moet concentreren.”
Cardboard-stijl
Roel: “Deze stijl is eigenlijk de tegenhanger van holographic-neon en aurora. Het is minimalistisch met kenmerken zoals eco en clean, iets dat past bij een milieubewuste manier van leven. Less is more, geen over de top gekleurde afbeeldingen. Met schreefloze typografie laat je de boodschap luchtig overkomen. Deze stijl is vooral geschikt om je boodschap duidelijk, zonder te veel afleiding en to the point voor het voetlicht te brengen.”
Limitless imagery en layered effects
Roel: “Limitless imagery gaan we dit jaar vaker zien bij fotocollages zoals hero images. Het idee is dat een deel van de foto buiten het kader lijkt te vallen. De achtergrond loopt bijvoorbeeld door tot een bepaalde hoogte terwijl het personage op de voorgrond wat verder uitsteekt. Combineer je deze stijl met layered effects, dan staan de elementen op de afbeelding meer in verbinding met elkaar via bijvoorbeeld overlapping.”
Asymmetrische menu’s en galerijen
Roel: “Asymmetrische grids gaan we dit jaar vaker tegenkomen. Denk aan cards met verschillende hoogtes, waardoor ze anders worden uitgelijnd. Als gebruiker ervaar je de app daardoor wat speelser, niet alles is in hetzelfde stramien. De kans is groot dat er cards half op de fold zichtbaar zijn: dit kan de gebruiker triggeren om door te blijven scrollen. Ik zie deze toepassing vooral voor me bij e-commerce apps zoals Bol.com, Zalando en Asos.”
Wild typography
Roel: “Deze stijl zie je vooral in de kledingindustrie: grote teksten, die soms willekeurig geplaatst lijken te zijn. Deze populaire trend knipoogt voornamelijk naar de jaren 90 en wordt met name gebruikt door merken die zich richten op een jonge doelgroep. In animaties en op affiches zie je bijvoorbeeld grote teksten en logo’s voorbijkomen. Het mag gerust druk en over de top zijn. Een lezer zal altijd eerst scannen. Met deze stijl kun je vier of vijf kernwoorden duidelijk laten opvallen.”
Onconventionele tekstuitlijning
Roel: “Hierbij draait het om verticale en diagonale tekstuitlijning, wat overigens niet per se optimaal is voor kleine schermen. Visueel kan het wel verfrissend zijn, zoals bij hero images. Omdat het niet conventioneel is, trekt het de aandacht bij het scannen van een pagina. De apart uitgelijnde teksten zijn de vreemde eend op de pagina, waar je ogen naartoe gezogen worden.”
Brutalist design
Roel: “De typografische stijl brutalist design zie ik vooral voor me in de culturele sector, zoals bij musea en poppodia. Het is een stijl die je ook signaleert op abri’s: vanaf een afstand herken je duidelijke kernwoorden, die to the point zijn en geen uitleg nodig hebben. In apps zie ik deze stijl bij onboarding slides of het aanmaken van een account. Deze confronterende stijl past overigens niet overal bij.”
