Link 1     Link 2     Link 3

Case

ESTG webdesign op basis van UX/UI design

KEG_1200x800_fotoholder_headert_case_ESTG
ESTG KEG_300x300px_case_logo_diap
Project details
Klantnaam:
ESTG B.V.

Project:
Webdesign op basis van UX/UI design

Oplossing:
Designen van de webshop

Webdesign op basis van UX/UI design

Kega is voor ESTG aan de slag gegaan om de webshop te optimaliseren met een focus op UX/UI design, wat staat voor user experience en user interface, met als doel de frontend beleving voor de klant te verbeteren. Hierbij wordt zowel aan de backend als de frontend van de webshop gewerkt om een Composable Commerce omgeving te realiseren.

KEG_805x500_laptopphone_content_case_ESTG
Research

De wens van ESTG op het gebied van webdesign was om een verbeterde klantbeleving te realiseren. Kega ging hiermee aan de slag door eerst de user experience (UX), oftewel gebruikerservaring, te verbeteren. UX design bepaalt de structuur en functionaliteit van de webshop, en Kega begon dit traject met onderzoek onder gebruikers en stakeholders. Hiervoor werden interviews gehouden met klanten van ESTG en werd er gekeken naar de concurrenten.

Daarnaast vond er een Brown Paper Sessie (stakeholdersmeeting) plaats met ESTG. Hieruit werd nieuwe informatie verkregen voor het design. Deze feedback werd vervolgens meegenomen in de uitwerking van wireframes en prototypes.

Werkwijze

Vanuit Kega wordt er samen met ESTG gewerkt met één team, bestaande uit een projectmanager, designers en developers. In overleg met ESTG is afgesproken om de huidige huisstijl te behouden en hiermee verder te gaan. Vervolgens wordt de styleguide, waaronder de grid- en kolomindeling, bepaald, waarna de designers de webshop in Figma ontwerpen. Figma is een design-tool voor het ontwerpen van interfaces, websites en apps.

Het gehele designtraject wordt opgedeeld in de volgende pagina’s:

  • Header & footer
  • Homepage
  • PLP (Productlijstpagina)
  • PDP (Productdetailpagina)
  • Winkel & checkout
  • Mijn account

Voor elk onderdeel wordt direct een vertaling gemaakt naar mobiel en tablet. Nadat elk onderdeel is afgerond, wordt een prototype van de betreffende webpagina gepresenteerd aan ESTG. Het is een intensieve samenwerking, met wekelijks intern overleg en twee keer per week een designmeeting met de klant, waarbij het hele team samenkomt. Tijdens deze meetings worden het design, de feedback en de voortgang besproken. De Product Owner van ESTG, Willem van der Linden, is ook regelmatig fysiek aanwezig op het kantoor van Kega.

Ondertussen bouwen de developers aan de frontend en bekijken wat er vanuit het design geïmplementeerd moet worden en of dit mogelijk is. Samenwerking is hierbij cruciaal, met consistente feedbackmomenten tussen de projectmanager, designers, developers en ESTG. Hierdoor kan er effectief gewerkt worden en kan er zowel een functionele als aantrekkelijke webshop worden gerealiseerd voor de gebruiker.

"Het vraagt om heel dichtbij je stakeholders en klanten te staan. Niet alleen de stakeholders, maar juist ook de klanten. Wat vinden zij prettig? Wat willen zij zien aan functionaliteit op de webshop?"

 Willem van der Linden
Dealen met Digital

Podcastaflevering met Willem van der Linden (ESTG) over hoe ESTG bestaand maatwerk ombouwt naar een 'schoon' platform

Dealen met Digital

Over ESTG

ESTG B.V., ofwel European Sustainable Technology Group, is een distributeur van duurzame energieproducten waar positieve energie centraal staat. Sinds 2010 heeft ESTG een opmerkelijke groei doorgemaakt, wat resulteerde in vijf verhuizingen om de snelle expansie bij te houden. Vandaag de dag levert ESTG aan 38 landen in Europa en is het assortiment uitgebreid met EV-laadpalen, energieopslag en thermische verwarmingsoplossingen.

Onze diensten


Digital commerce

Vanuit onze Unified Commerce visie ontwikkelen wij apps en composable commerce platformen die onze opdrachtgevers extra omzet opleveren.

Learn more


Digital strategy

Met uitvoerbare roadmaps waarin zowel klant als medewerker centraal staan, helpen wij opdrachtgevers met de digitale transformatie.

Learn more


Digital solutions

Besparen met slimme, digitale oplossingen. Wij helpen opdrachtgevers bij het kiezen of ontwikkelen van de juiste tools en functionaliteiten voor hun organisatie.

Learn more