social-facebook social-twitter

2010 — 2019: de trends in digital design van toen en nu [DEEL 1]

24 december 2018 • 9 minuten lezen

Kun je het je voorstellen? 2019 betekent dat we steevast met de stroom meevaren naar het laatste hoofdstuk van dit decennium. Het internet is flink gegroeid en veranderd de afgelopen 10 jaar: mobiel browsen is groter dan ooit en we hebben onszelf het leven moeilijker gemaakt door nóg meer afkortingen te introduceren in de digitale markt, zoals AI (Artificial Intelligence), AR (Augmented Reality), VR (Virtual Reality) en AMP (Accelerated Mobile Pages).

Een terugblik op 10 jaar digital design, in alle vormen en maten

Naast nieuwe technologieën, hebben de trends van de afgelopen jaren ook voor de nodige opschudding gezorgd. Waar sommige trends hebben bijgedragen aan een moderner uiterlijk van het web, hebben andere een compleet nieuwe standaard gezet in gebruikerservaring.

In deze twee delen neem ik je mee op een 'trip down memory lane' en vertel ik je welke verschuiving in digital design bepalend is geweest voor dat specifieke jaar. Zet je schrap!

Foto: The Transfinite, Park Avenue Armory, New York
© Ryoji Ikeda

 

2010: Minimalisme

Het jaar van het vernieuwde minimalisme. Websites gebruiken nog steeds veel witruimte, maar we worden vaker voorgesteld aan gewaagde, krachtige typografie en verrassende kleurenschema’s. Hoewel puristen het niet helemaal eens zijn over het gebruik van kleur in minimalisme, een stijl die oorspronkelijk bestond uit een onverzadigd zwart-witpalet, zijn designers het er over eens: minimalisme hoeft niet altijd koud te zijn.

Om een minimalistisch design zo effectief mogelijk te maken, wordt er vaak gekozen voor een intuïtief grid-systeem. Van nature is witruimte een belangrijk onderdeel van de stijl, waardoor het geheel onoverzichtelijk of slordig kan ogen. Het grid draagt bij aan de structuur van het totaalplaatje.

Minimalisme is sterk, maar lastig om onder de knie te krijgen. De stijl bevat niets anders dan de kern van je design. Door het weghalen van overbodige elementen, kun je doordringen tot de essentie van je boodschap. En dat zorgt voor maximale impact.

Minimalisme

 

2011: Mobile ready

Sinds het begin van de mobiele telefoon worden websites al ontworpen met een verscheidenheid aan schaalbare scenario’s in het achterhoofd. In dit jaar zien we echter een enorme push naar volledige subsites (herinner je je de m.-domeinen nog?) die specifiek worden gemaakt voor het bekijken op een handheld-scherm. De start van deze trend is te danken aan de iPhone. De golf van mobiele websites verspreidt zich, en voor we het weten moeten we ons best doen om een website te vinden die geen mobiele subsite heeft.

Smartphones, tablets, netbooks. Voorspellers wisten het zeker: 2011 zou het jaar worden waarin er meer mobiele devices dan PC’s verkocht zouden worden. Deze overvloed aan nieuwe apparaten heeft een nieuwe norm in webdesign teweeggebracht. Is je website niet mobielvriendelijk? Dan loop je mensen mis. Heel veel mensen.

Mobiele schermen forceren designers om creatief om te gaan met een relatief kleine bewegingsruimte. De boodschap moet eerder aankomen bij de gebruiker, call-to-actions horen gemakkelijker aanklikbaar te zijn in een touchscreen-omgeving, en content moet moeiteloos te lezen zijn. Het maken van een mobiele website vereist meer dan alleen het verwijderen van alle toeters en bellen. Doe je dat wel, dan kan dit een afstandelijk en onpersoonlijk design opleveren. Dat wil je natuurlijk niet. De sleutel? Destilleer de magie van je desktopontwerp naar een pure representatie van je merk.

Niet veel later staat de opvolger van mobile ready al voor de deur: responsive design. Je website optimaliseren voor één specifieke viewport? Dat is verleden tijd. Responsive is een aanpak waarbij de code van je layout automagisch reageert aan de hand van de schermresolutie. Met behulp van CSS3, voornamelijk media queries, wordt dit proces behapbaar gemaakt voor webdevelopers.

Eén ding is zeker: we bevinden ons midden in de mobiele generatie.

Wil je meer te weten komen over de mobile first-benadering?
Lees dan mijn andere blog.

Mobile ready

 

2012: One-pagers

De one-pager is de directe nasleep van het mainstream worden van mobiel browsen. Waar we het een aantal jaar geleden 'not done' vonden om op een homepage te scrollen, nemen de websites dit jaar een duik in het diepe. Het muiswieltje mag weer gebruikt worden. Eindelijk!

Designers hoeven geen bergen meer te verzetten om alles in één scherm te persen. De boodschap is nog steeds bovenaan te vinden, maar de 'vouw' waar je langs zoeft — het gedeelte van de website dat direct zichtbaar is, zonder dat er is gescrold — is een stuk minder belangrijk geworden. Tekst wordt zoals vanouds onder elkaar geplaatst, al wordt er vaker geopteerd voor een structuur waarbij contentblokken zijn opgedeeld in gescheiden secties.

Ook de footers worden niet vergeten. Voorheen werd er in het bijzonder gekozen voor smalle footers en was er, naast de contactgegevens, niet veel te vinden onderaan de website. De hedendaagse hekkensluiter daarentegen, zorgt ervoor dat de bezoeker weet dat het einde van het avontuur is bereikt. Ook zien designers meer mogelijkheden om nog nét dat laatste stukje branding te gebruiken en daarmee de bezoeker te overtuigen van hun merk.

Maar hoe maak je je one-pager nou zo interessant dat de bezoeker door móet blijven scrollen? Simpel: met parallax scrolling. En nee, dan bedoelen we niet de methode die wordt gebruikt in retro-videogames. Deze tactiek wordt gebruikt om een gevoel van diepte in de pagina te leggen. Scroll je naar beneden, dan worden bepaalde lagen over elkaar heen bewogen waardoor je het idee krijgt alsof je door het gaatje van een kijkdoos kijkt. Parallax is gemakkelijk te implementeren met behulp van CSS-trucjes en dient als een secundaire toevoeging op je design, bijvoorbeeld als visuele boost voor een header, footer of achtergrondfoto.

One-pagers

 

2013: Visuele storytelling

Met dank aan responsive webdesign, waardoor websites geconverteerd kunnen worden naar schermen van elk denkbaar formaat, vinden designers meer manieren om gebruikers het gevoel te geven alsof ze naar een film in de bioscoop aan het kijken zijn. Informatieve teksten worden ingeruild voor grote foto’s en video’s, soms zelfs zo groot dat ze het hele venster beslaan.

Hoewel voorheen serif-lettertypes werden beschouwd als oud en onleesbaar op een scherm, worden deze klassieke typefaces steeds meer gebruikt als sterke toevoeging op de look en feel van je website. Kortom: zolang je stilistische keuze aansluit bij de wereld van jouw merk, bestaan er geen grenzen.

Door middel van innovatieve navigatie word je meegevoerd in de boodschap van het merk. De kracht van storytelling? Er ontvouwt zich een verhaal voor de ogen van de gebruiker, zonder dat er veel interactie is vereist. Het resultaat is een unieke, cinematische ervaring. Een manier om je bezoekers aan te grijpen zonder dat het ze overweldigt.

De grote headerfoto, ook wel de hero genoemd, was rond deze periode al een tijdje in de mode. Doordat we meer toegang krijgen tot afbeeldingen van hoge kwaliteit en snellere technologie, zien we dat websites deze authentieke vorm van storytelling naar een hoger niveau tillen. De voorloper hiervan is PayPal, die een update van de website lanceerde met een fullscreen video-achtergrond. Een mijlpaal die heeft geholpen bij het mainstream maken van dit concept.

Het is geen gemakkelijke opgave om storytelling te verwerken als rode draad in je website. Het vraagt om een oog voor detail en verstand van de doelgroep die je wilt bereiken. Een goed uitgedachte verhaallijn die je bezoekers aanspreekt, is essentieel. Maar als je dit goed doet, onthouden mensen je merk, je website én je prachtige verhaal.

Visuele storytelling

 

2014: Flat design

Herinner je je de fotorealistische apps van de iPhone 5 nog? De Voice Memo-app waarmee het leek alsof je in een levensechte microfoon aan het zingen was, of de stiksels in de Notes-app waarvan je zou zweren dat je ze los kon maken? In dit jaar hebben we het skeuomorfisme vaarwel gezwaaid en heeft flat design zich gevestigd als de go-to-stijl in webdesign. Met name iOS 7 van Apple, Material Design van Google en Metro Design van Microsoft hebben de designfilosofie een extra impuls naar populariteit gegeven.

De denkwijze achter flat design is dat door het jarenlange gebruik van allerlei soorten media, mensen inmiddels de functie van de apps en websites herkennen. Daardoor is het niet langer nodig om realistische interfaces te ontwerpen, maar kunnen designers door middel van logica de focus leggen op gebruiksgemak.

Hoewel er in het begin een scepticisme bestond over de zoveelste ogenschijnlijke rage, bleek de trend toch langer aan te houden dan verwacht. Tot op de dag van vandaag zien we het framework nog steeds terugkomen. De reden? Flat design is minimalisme, maar dan zonder de grafische kenmerken van minimalisme. Het draait allemaal om clean, modern en simpel. Het stimuleert gebruik van minder visuele herrie, meer witruimte en over-all een betere gebruikerservaring. Het forceert designers om meer te bereiken door minder te gebruiken.

Flat design

 

Dit zijn de trends die in het eerste gedeelte van dit decennium voor een omslag hebben gezorgd in digital design. Ben je benieuwd naar de rest? In het tweede en laatste deel blikken we terug op 2015 tot en met 2018 én geef ik je alvast een voorspelling voor 2019.

 

Heb jij een tof merk of idee, maar komt het maar niet van de grond? Wij weten precies hoe je jouw concept onder de mensen kan brengen en in de markt kan positioneren. Neem contact met ons op en we denken met je mee!

Ja, ik wil met jullie brainstormen
 
 
Ferry

Ferry van der Stelt

Ferry is Interaction Designer bij Elevate Digital. Hij houdt zich bezig met webdesign, graphic design, UI/UX-design en branding. Ferry werkt mee aan creatieve online concepten en strategieën. Hij zorgt ervoor dat jouw project er scherp uitziet! Ferry leren kennen? Neem dan contact op!

Deel dit artikel

Digital marketingstrategie: waar liggen de kansen in 2019?

Marketingreview aanvragen?

Haal het maximale uit jouw online strategie, vraag onze marketingreview aan!

aanvragen x