Vergaderen in het groene hart
Image default
Aanbiedingen

9 UI-ontwerptrends in 2020

Waarschijnlijk had ieder van ons de ervaring van interactie met de site, waarvan de interface zich onderscheidde door de originele stijl en onder de indruk was van zijn schoonheid, maar tegelijkertijd volkomen onhandig was. Dergelijke sites worden verkregen wanneer hun makers, in een poging om trends te volgen, de gebruikerservaring volledig vergeten, die door het ontwerp zou moeten worden bepaald. Laten we eens kijken naar enkele van de meest zichtbare trends in het ontwerpen van gebruikersinterfaces in 2020 en uitzoeken hoe we er een aantal kunnen gebruiken om de gebruiker niet te irriteren.

Kleurovergangen, levendige kleuren en eenvoud

Het gebruik van levendige kleuren en verlopen blijft aan populariteit winnen bij alle soorten webontwerpen, vooral in front-end, branding en illustratie.

Verloopontwerp in levendige kleuren

Ook in de trend is een ultraminimalistisch ontwerp, waarbij gebruik wordt gemaakt van een extreem beperkt palet, eenvoudige vormen en meer negatieve ruimte, waardoor het mogelijk is om delen van de pagina te verdelen en voorrang te geven aan visuals.

Neomorfisme

Begin 2020 heeft een trend genaamd neomorfisme zich verspreid en blijft deze aan populariteit winnen. De term neomorfisme is afgeleid van de woorden neo en skeuomorfisme. Dit laatste in interface-ontwerp betekent een techniek waarbij elementen extern vergelijkbaar zijn met echte dingen. Bijvoorbeeld wanneer de rekenmachine-applicatie eruitziet als een fysieke tegenhanger. De skeuomorphism-trend werd geïntroduceerd door Steve Jobs en werd tot 2013 in iOS gebruikt. Later vereenvoudigde Apple het ontwerp en maakte, te beginnen met de 7e versie van het besturingssysteem, geen gebruik van skeuomorfisme.

Neomorfisme is een nieuwe kijk op skeuomorfisme. Door realistische elementen te combineren met een plat ontwerp en kunstzinnig gebruik van lichte en zachte schaduwen, zijn neomorfe interfaces schoner, futuristisch en realistisch tegelijk, en brengen ze een nieuwe zintuiglijke ervaring naar vertrouwde interfaces. De moeilijkheid van het gebruik van deze stijl is om het praktisch en comfortabel te houden voor gebruikers. Het spel van licht, schaduwen en volumes kan de gebruiker verwarren over wat wel en niet aan te klikken is.

Om fouten te voorkomen, moet de ontwerper niet alleen de basisprincipes van tekenelementen volgen, maar ook zorgvuldig hun aanvullende status overwegen om de bruikbaarheid duidelijk genoeg te maken. Een andere manier om de gebruiker voor mogelijke verwarring te behoeden, is door deze techniek alleen in statische of alleen in interactieve elementen te gebruiken.

Plaatsing van navigatie-elementen

Directe en consistente toegang tot de navigatiebalk is al lange tijd een van de belangrijkste principes van webdesign en gebruikersinterface. Vandaag verandert deze aanpak langzaam. Knoppen op websites worden steeds meer verborgen achter één menuknop, waardoor je meer informatie op het scherm kunt plaatsen met behoud van toegang tot de navigatiebalk.

De navigatiebalk optimaliseren

Vaak kunnen de knoppen niet helemaal overeenkomen met het hoofdontwerp, dan is het vooral belangrijk om ze te verbergen. Is het je opgevallen dat grote knoppen met het label “Categorieën” steeds minder vaak voorkomen en worden vervangen door kleine pictogrammen? Bovendien vereenvoudigt het verkleinen van de navigatiebalk het werk van de ontwerpers en bespaart het de klant geld, omdat het een zeer zorgvuldige studie vereist wanneer het nodig is om volledige overeenstemming met het hoofdontwerp vast te stellen. Het is veel gemakkelijker om één kleine knop te ontwerpen en gebarenbediening toe te voegen dan om afzonderlijke UI-elementen te maken.

Animatie

Verschillende geanimeerde elementen die worden gebruikt om gerichte gebruikersacties aan te moedigen, geven de site een soort pit. Veel advies-, rekruterings-, financiële en medische diensten gebruiken deze tool om hun serieuze en vaak saaie onderwerpen af ​​te zwakken. Helaas kan niet iedereen de nodige terughoudendheid betrachten, waardoor interfaces overbelast raken. Het is belangrijk om discreet te zijn bij het gebruik van geanimeerde elementen. Zo zijn relatief grote animaties geschikt om slechts één of twee oproepen tot actie aan te gaan, terwijl kleine elementen zorgvuldig worden gebruikt om acties aan te moedigen die tot microconversies leiden.

Lege ruimte

Succes bij het vestigen van de aandacht op een site hangt af van hoe de ontwikkelaar de belangrijkste elementen kan benadrukken. De hierboven genoemde kleuren en animaties, evenals bepaalde schema’s, helpen hierbij. De efficiëntie daalt echter vaak wanneer informatie te dicht bij elkaar staat. Witruimte heeft zich dus gevestigd als een van de belangrijkste componenten van minimalistisch design, dat al enkele jaren in de trend is en aan populariteit wint. U kunt al veel sites vinden waarvan de hoofdpagina wordt beperkt door de aanwezigheid van een slogan. Sommigen zijn van mening dat het gebrek aan informatie-inhoud de site ondoelmatig maakt. Dit idee wordt in de praktijk vaak weerlegd, omdat op deze manier direct meer aandacht op het gepresenteerde product kan worden gevestigd. Het is belangrijk dat het belangrijkste element, de basis, de details erachter verbergt. Een laconieke uitdrukking kan de promotie van zoekmachines echter belemmeren, aangezien de pagina niet de benodigde hoeveelheid informatie bevat in vergelijking met concurrenten uit de TOP-10.

Tegen de regels

Onlangs zijn modieuze trends in design zulke overlappende richtingen geworden als:

  • esthetiek van straatkunst;
  • anti-designer brutalisme;

Alles wat onmogelijk is is mogelijk geworden: asymmetrische lay-out, flitsende kleuren, getekende elementen, chaotische volgorde van hun opstelling en zelfs elkaar overlappen. Er is echter één voorbehoud: dit mag de gebruiker niet storen of irriteren. De trend is nogal merkwaardig, omdat het ernaar streeft om verder te gaan dan traditie en iets origineels en interessants te creëren, en niet aan te passen aan de vastgestelde patronen. Het is belangrijk om te begrijpen dat een dergelijke interface waarschijnlijk niet geschikt is voor sites met serieuze onderwerpen die een bepaalde focus op informatie vereisen. Maar voor creatieve evenementen of bijvoorbeeld online winkels voor een jong publiek, kan het best organisch zijn.

Variabele lettertypen

Meer recentelijk zijn browsers begonnen met het ondersteunen van variabele lettertypen, dat wil zeggen bestanden met één lettertype waarmee u typografie op uw site kunt aanpassen. U kunt dus de afstand tussen letters, hun stijl en dikte wijzigen en het perfecte lettertype voor een specifieke taak maken. Door verschillende variaties te gebruiken van het lettertype dat in hetzelfde ontwerp wordt gebruikt, kunt u nadruk en contrast creëren tussen de hoofdinformatie en aanvullende informatie. Bij het gebruik van dergelijke lettertypen is het ontwerp gevuld met dynamiek en energie. En in combinatie met de trend van ingetogen animatie, kun je een oplossing bereiken die indruk zal maken op iedereen. Aangezien browsers sinds kort variabele lettertypen ondersteunen, moet u ervoor zorgen dat ze correct worden weergegeven op de apparaten en programma’s die uw doelgroep gebruikt voordat u ze gebruikt.

Items maken

Het verzoek om items te maken keert weer terug en vertoont dus enige cycliciteit. Deze richting volgt de algemene trend, die tot uiting komt in de afwijzing van striktheid en nauwkeurigheid in stijl. Site-eigenaren willen steeds vaker handgetekende illustraties en lettertypen, texturen en korrelige effecten. Handgetekende illustraties voegen menselijkheid toe aan de interface, wat vooral belangrijk is voor sites die de nadruk moeten leggen op de zorg voor mensen. Deze omvatten bijvoorbeeld liefdadigheidsinstellingen, medische organisaties, kinderkampen, projecten om het milieu te verbeteren, enz.

Flexibiliteit in het ontwerpsysteem

Ondanks de vraag naar creativiteit, streven bedrijven ernaar om zich te houden aan stijleenheid om bewustzijn te behouden en te ontwikkelen, zowel op internet als daarbuiten. De ontwikkeling van een flexibel ontwerpsysteem helpt om die eenheid te bereiken en de ontwikkeling van de huisstijl voort te zetten zonder de creatieve benadering van ontwerpers te beperken. Tot voor kort werd aangenomen dat het werken aan het ontwerpen van gebruikersinterfaces een rigide systeembenadering veronderstelt, die strikt beperkt is tot een bepaalde reeks visuele regels. Het doel van deze aanpak werd overwogen om de veiligheid en consistentie in alle interfaces en producten van het bedrijf te waarborgen. Tegenwoordig wordt het ontwerpsysteem eerder als een vector gezien, waarna het mogelijk moet zijn om de visuele communicatie van het bedrijf online en offline flexibel te ontwikkelen. Google heeft bijvoorbeeld geen strikt voorgeschreven uniforme stijl voor alle producten van het bedrijf en wordt zelfs aangemoedigd als ontwerpers niet eerder met hen hebben gewerkt, omdat ze een betere kans hebben om nieuwe ideeën binnen te brengen. Het is merkwaardig hoe Emily Blank, een specialist in de ontwikkeling van het visuele oplossingssysteem van Google, vertelde hoe zij en haar collega’s in een van de design sprints naar het Walt Disney Museum in San Francisco gingen, en ze werden geïnspireerd door een verscheidenheid aan visuele en stilistische oplossingen die het altijd mogelijk maken om Disney-films te onderscheiden van iemand anders. Het belangrijkste idee hier is dat je in UX- en UI-ontwerp de eenheid moet behouden, je moet onderscheiden van anderen en constant visuele oplossingen moet ontwikkelen. UI / UX-ontwerpers moeten in staat zijn om elementen zoals afbeeldingen, tekst, kleuren en interacties in de interface te combineren tot holistische systemen en om merkconvergentie door de gebruiker te bereiken.

Samenvatting

Dus nogmaals kort over de meest opvallende trends in interface-ontwerp in 2020:

  • Kleurovergangen en levendige kleuren in een beperkt palet in een ultra-minimaal ontwerp.
  • Neomorfisme kan een website een stijlvolle en futuristische uitstraling geven, maar het gebruik ervan moet zeer zorgvuldig worden benaderd, aangezien de kans groot is dat de gebruiker in de war raakt.
  • Navigatie-elementen verbergen om de bruikbare ruimte te vergroten.
  • Animatie helpt om de gebruiker in de richting van gerichte actie te duwen en saaie onderwerpen te diversifiëren, maar het mag niet opdringerig zijn en de site overbelasten.
  • Lege ruimtes voor duidelijkere accenten.
  • Anti-design past zich goed aan een jong publiek aan en ziet er organisch uit wanneer het wordt gepresenteerd met creatieve thema’s.
  • Variabele lettertypen zijn een interessante oplossing, maar hebben in sommige browsers beperkingen.
  • De ambachtelijke stijl is het meest geschikt voor organisaties die menselijke waarden en zorg voor mensen willen uitdragen.
  • Flexibele ontwerpsystemen stellen u in staat om visuele oplossingen te ontwikkelen, een uniforme stijl van het bedrijf te behouden en in te spelen op trends.

Gevolgtrekking

Ik zou graag willen opmerken dat voordat u de trends volgt en probeert deze in uw interfaces in te bedden, u duidelijk moet begrijpen of dit precies is wat u nodig heeft. Het is bekend dat de meeste online winkels qua uiterlijk behoorlijk op elkaar lijken, aangezien dit wordt bepaald door de gebruikerservaring.

Het punt is dat de ontwerptaak ​​is om een ​​gebruikerspad te bouwen en de bezoeker naar de doelactie te begeleiden. Dat wil zeggen, het ontwerp moet afhangen van de gebruikerservaring, die verschillend of vergelijkbaar kan zijn.

Neem contact met ons op en we bespreken verschillende mogelijkheden.

E-mail: info@webdevelopmentapp.com

BE: +32 499 41 46 24

Franklin Rooseveltplaats 12, 2060 Antwerpen, Belgie

webdesign antwerpen

webdeveloper

https://webdevelopmentapp.com/nl/