Vernieuwde Webshop Kupan


  • Webshop Kupan

  • De ideeën en de oplossing
    Allereerst ben ik begonnen met het houden van interviews met de verschillende gebruikersgroepen. Zo kwam ik er al snel achter dat de oude webshop een aantal essentiële functionaliteiten misten, zoals het filteren bij een productgroep, gebruik van groot beeldtaal duidelijke uitleg over het product en een gebruikersaccount. Tevens werd de mogelijkheid om documenten te downloaden als een gemis ervaren. Al deze elementen zijn verwerkt in de nieuwe webshop waardoor de gebruiker sneller wordt gefaciliteerd.

    Homepage
    Op de homepage is direct in de hero een call to action aanwezig om zo de aandacht van de gebruiker te trekken. Daaronder volgen direct alle productcategorieën zodat de gebruiker getrechterd wordt en eerder op punt van bestemming komt. Voor Kupan was het belangrijk om aan te tonen aan welke eigenschappen hun producten voldoen. Dit is gevisualiseerd middels iconen die doorlinken naar een informatiepagina. In de footer is de belangrijkste bedrijfsinformatie over Kupan te vinden.

    Productgroep
    De gebruiker begint met het selecteren van een productgroep. Van daaruit is hij in staat om te filteren op een productcategorie en specificaties. De actieve filters worden bovenaan getoond en zijn gemakkelijk te deactiveren door op het rode kruisje te klikken. Tevens bestaat er de mogelijkheid om alle filters in één keer te deactiveren. De resultaten van het filter worden aan de rechterkant getoond door middel van productblokken. Deze blokken bestaan uit een foto, titel en prijs van het product.

    Productdetail
    Op de productdetail wordt middels tabbladen alle informatie over het desbetreffende product getoond. Hier zijn ook de downloadbare documenten te vinden. Er is gekozen voor het overzichtelijke tabbladen systeem om zo alle informatie bij elkaar te houden. De gebruiker kan direct switchen tussen deze tabbladen voor ander soort informatie over het product. Tevens vindt de gebruiker op het productdetail bijhorende artikelen voor de bijverkoop.

    Gebruikersaccount
    Wat in de oude webshop een gemist was is nu wel aanwezig, namelijk het gebruikersaccount. Via het account kan de gebruiker zijn bestellingen terugkijken en facturen downloaden voor eigen administratie. Tevens is de gebruiker in staat zijn gegevens te wijzigen. Het gaat hierbij om adresgegevens, persoonlijke gegevens (zoals e-mailadres en telefoonnummer) en login informatie (wachtwoord aanpassen). De webshop biedt een mogelijkheid om een verlanglijst bij te houden. Dit is gemakkelijk als de gebruiker het product nog niet direct wil kopen maar wel wil opslaan.

  • Het project

  • De opdracht
    De focus ligt hier op het ontwikkelen van de ultieme user experience voor de klanten van Kupan. De digitale klantbeleving staat voorop. Om dit te bewerkstelligen zijn er requirements opgesteld.

    Mijn uitdadingen
    • Welke essentiële onderdelen mist de gebruiker nu op de webshop.
    • Hoe ga ik de webshop vanaf het 0-punt opbouwen.

    Specifieke rol
    Conceptontwikkeling, Onderzoek, User testing, Interaction Design, User Experience, Graphic Design en Development.


Webshop Kupan Homepage
Webshop Kupan Productgroep
Webshop Kupan Productdetail
Webshop Kupan Gebruikersaccount
Webshop Kupan Betalingsproces



Gebruikte programma's

Adobe Illustrator
In Adobe Illustrator heb ik alle wireframes uitgewerkt aan de hand van de user needs en card sorting test. Van daaruit heb ik deze wireframes omgezet naar een grafisch eindontwerp.

Axure Pro
In Axure Pro is er het prototype ontwikkelt zodat er getest kon worden met de eindgebruikers.

Magento 2
De website is gebouwd op het CMS Magento 2. Zo kunnen de contentmanagers gemakkelijk content aanpassen en aanvullen.

Unieke ontwerpen

Nieuwsgierig naar mijn unieke ontwerpen?
Bekijk ze hiernaast, door te klikken op één van deze vier ontwerpen kom je direct bij de projecten.
Veel plezier!