Les 10 - Wireframe (productpagina) - Profieldeel E-comm

• Online marketing
• MBO
• Studiejaar 1

Profieldeel E-comm

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.

Portfolio

Uitgewerkte opdrachten bewaar je in een portfolio

• Alles in 1 document!
  
• Kwaliteit
  
• Volledigheid

Even terug...

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.

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.

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.

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.

Opdracht 9 - Wireframe Productpagina

Ga naar www.wireframe.cc

Maak een wireframe voor jouw toekomstige productpagina.