Les 10 - Wireframe (productpagina) - Profieldeel E-comm
Profieldeel E-comm
1 / 15
volgende
Slide 1: Tekstslide
Online marketingMBOStudiejaar 1
In deze les zitten 15 slides, met tekstslides en 1 video.
Lesduur is: 60 min
Onderdelen in deze les
Profieldeel E-comm
Slide 1 - Tekstslide
Aan het einde van de les...
... kan je uitleggen waar je op moet letten bij het maken van een wireframe (productpagina);
... heb je een wireframe voor jouw productpagina gemaakt.
Slide 2 - Tekstslide
Portfolio
Uitgewerkte opdrachten bewaar je in een portfolio
Alles in 1 document!
Kwaliteit
Volledigheid
Slide 3 - Tekstslide
Even terug...
Slide 4 - Tekstslide
Wireframes
Wireframes zijn simpele tekeningen of schetsen die laten zien hoe een website eruit kan zien voordat deze wordt gemaakt.
Ze geven de indeling van een website weer, zoals waar tekst, plaatjes, knoppen en menu’s komen. Het is alsof je een blauwdruk maakt, maar dan voor een website.
Slide 5 - Tekstslide
Slide 6 - Video
Heat maps
Een heatmap voor websites is een soort kaart die laat zien waar bezoekers op een website het meest klikken, bewegen of kijken.
Het gebruikt kleuren om dit duidelijk te maken: warme kleuren zoals rood en oranje betekenen veel activiteit, terwijl koelere kleuren zoals blauw minder activiteit aangeven.
Slide 7 - Tekstslide
Wat kun je ermee doen?
Zien wat werkt: Je kunt ontdekken welke knoppen, links of afbeeldingen bezoekers vaak gebruiken.
Verbeteren: Als je merkt dat mensen een belangrijke knop niet opmerken, kun je de website aanpassen.
Beter begrijpen: Je leert hoe bezoekers door je website navigeren.
Slide 8 - Tekstslide
Slide 9 - Tekstslide
Slide 10 - Tekstslide
Slide 11 - Tekstslide
Waar moet je op letten (wireframe productpagina)
Duidelijke indeling: Zorg dat de belangrijkste dingen (zoals productfoto, naam, prijs en knop "Koop nu") meteen zichtbaar zijn.
Overzicht: Plaats productbeschrijvingen, specificaties en reviews logisch en niet te druk.
Navigatie: Zorg voor een makkelijke weg terug naar andere producten of categorieën.
Mobiel-vriendelijk: Denk aan hoe de pagina eruitziet op een telefoon.
Call-to-action: Zorg dat de knop voor actie (bijvoorbeeld "In winkelwagen") goed opvalt.
Plaats voor vertrouwen: Laat ruimte voor reviews, keurmerken of garantie-informatie.
Slide 12 - Tekstslide
Opdracht 9 - Wireframe Productpagina
Ga naar www.wireframe.cc
Maak een wireframe voor jouw toekomstige productpagina.
Wij gebruiken cookies om jouw gebruikerservaring te verbeteren en persoonlijke content aan te bieden. Door gebruik te maken van LessonUp ga je akkoord met ons cookiebeleid.