Nieuws

Webdesigntrends 2017

By 26 september 2017 No Comments

Webdesigntrends 2017

Webdesigners hebben in 2017 de opdracht om een onderscheidend ontwerp te combineren met een aangename gebruikerservaring. Geen eenvoudige opgave, want een eigenzinnig design staat vaak op gespannen voet met optimaal gebruikersgemak, vooral ook op mobiel.

1. Conversational interfaces

Meer dan de helft van het verkeer voor veel websites komt van smartphones. De kleine schermpjes vereisen dat webdesigners slim omgaan met de beperkte ruimte. Daarbij halen ze steeds vaker hun inspiratie bij toepassingen die mensen vooral op hun smartphones gebruiken, zoals social media en berichten apps.

Een duidelijk voorbeeld daarvan zijn de zogenoemde ‘conversational interfaces’. Dit zijn ontwerpen die een natuurlijk gesprek tussen de website en de bezoeker proberen te creëren. Soms puur als ‘gimmick’, zoals bij de nieuwssite Quartz. Een fraai overzicht met voorbeelden van conversational interfaces kun je hier onder bekijken

Video bekijken

2. Cinemagraphs

Ben ik nou gek, of zag ik die foto ineens bewegen? Een mooie trend van de laatste tijd is die van de cinemagraphs. Dat zijn subtiele, foto-realistische animaties binnen een afbeelding. In feite zijn het geraffineerde GIF-animaties, maar dan met een realistisch effect. Ze ‘loopen’ zodanig, dat de beweging natuurlijk en ononderbroken lijkt.

3. Millenial pink

Webdesign volgt, als het om kleur gaat, de bredere mode trends. Geïnspireerd door de roze iPhone zien we de kleur pink steeds sterker terugkomen in de designwereld en ook webdesigners kijken voor 2017 door een roze brilletje.

Volgens het PANTONE Fashion Color Report Spring 2017 zullen naast Pale Dogwood ook de kleuren ‘Niagara’, ‘Primrose Yellow’, ‘Lapis Blue’, ‘Flame’, ‘Island Paradise’, ‘Greenery’, ‘Pink Yarrow’, ‘Kale’ en ‘Hazelnut’ het beeld gaan bepalen:

Bekijk ze alle 10

4. Kaders

De laatste tijd zien we steed meer websites die gebruik maken van witte kaders om de pagina’s heen. Het lijkt een reactie op alle vrijstaande, open ontwerpen die we de laatste jaren veel zien bij responsive websites. We zagen het al een beetje bij een eerdere trend als cards. De behoefte om structuur en overzicht te bewaren.

5. Verticale navigatie

Als alternatief voor het hamburger-menu zien we steeds vaker dat webdesigners kiezen voor verticale teksten aan de randen van responsive webpagina’s. Persoonlijk vinden wij deze trend niet echt fraai, want het is niet echt gebruikersvriendelijk. Maar onderscheidend is het momenteel wel. En daarnaast ook wel een beetje gedurfd.

6. Reuzachtige knoppen

Voor veel webpagina’s is het belangrijk dat bezoekers een duidelijke volgende stap krijgen voogeschoteld. Een onmiskenbare ‘call-to-action’. In de strijd om de aandacht van consumenten zien we steeds meer dat webdesigners veel werk maken van het ontwerpen van opvallende knoppen. Een nieuwe trend daarbij is groot, groter, grootst. Reuzachtige knoppen moeten bezoekers verleiden tot die o zo belangrijke klik.

7. Zichtbare gridlijnen

Een webdesign trend die een gevoel van structuur moet geven is die van de zichtbare gridlijnen. Dit zijn de horizontale en verticale lijnen waarmee webdesigners hun pagina’s indelen. Meestal blijven die lijnen onzichtbaar in het uiteindelijke ontwerp. Het effect kan heel fraai zijn, zoals in dit voorbeeld waarbij de ontwerper de horizontale gridlijnen zichtbaar heeft gemaakt:

Voorbeeld bekijken

8. Particle backgrounds

Video backgrounds zien we al wat langer (zie ook trend 13). Maar een nieuwere trend van de laatste tijd is die van de particle backgrounds. Beweging op de achtergrond werkt namelijk goed om een webpagina interessanter te maken en op te laten vallen. Maar video’s hebben twee belangrijke nadelen: ze zijn doorgaans erg groot en ze trekken vaak teveel de aandacht ten koste van de content. Ze treden als het ware als achtergrond teveel op de voorgrond.

Bekijk voorbeeld

9. Micro interacties

Kleine, verfijnde effectjes om de interactie tussen gebruiker en website of app te stroomlijnen. Ze werken vaak ook als ‘delighters’, en om de gebruiker een handje te helpen.

Bekijk voorbeeld

10. Material design

Deze trend ontwikkelt zich gestaag verder en blijft daarom ook in 2017 en ongetwijfeld ook daarna nog zeer relevant. Material design is een vervolg op ‘flat design’ dat al een aantal jaren opgang maakt in webdesign.

Bekijk voorbeeld

11. Achtergrond video’s

Aantrekkelijk om dezelfde redenen als de cinemagraphs (trend 2) en particle backgrounds (trend 8): ze trekken de aandacht en kunnen een verhaal vertellen. Probeer de ‘loop’ zodanig te maken, dat de video ononderbroken lijkt. En laat het geluid weg!

Voorbeeld bekijken

12. Interactive storytelling

Een manier om je als merk of bedrijf te onderscheiden van je concurrenten is door middel van storytelling.

Vertel je bezoekers het eigen verhaal dat jouw organisatie en/of product zo uniek maakt. Het verhaal waarmee je jouw klanten weet te pakken en te overtuigen. Een verhaal, bovendien, dat je vertelt door middel van de beste multimediale webtechnologie die je tegenwoordig ter beschikking staat.

Bekijk voorbeeld