Case: Design Expivi 3D configurator voor Deli Home

Voor klantspecifieke vraagstukken werken we samen met Expivi aan UX/UI design en integratie-uitdagingen. Zoals de integratie van de Expivi 3D tool op de website van Gamma.nl (met producten van Cando/DeliHome).Voor klantspecifieke vraagstukken werken we samen met Expivi aan UX/UI design en integratie-uitdagingen. Zoals de integratie van de Expivi 3D tool op de website van Gamma.nl (met producten van Cando/DeliHome).

Wat kun je met deze configurator

We maakten een UI/UX design rondom de 3D configurator van Expivi. Middels deze configurator kunnen klanten van bouwmarkten als bijvoorbeeld Gamma online een plaat op maat bestellen.
De plaat is online te configureren op specificaties als materiaal, vorm, afmetingen en zaag afwerkingen. Tijdens de configuratie passen een 3D model en de prijs zich in real time aan naar de opgegeven specificaties. Dit model is in 360 graden te bekijken.

De toegepaste UI/UX

Het uiteindelijke systeem zal in de toekomst weggezet kunnen worden bij diverse bouwmarkten.
Het was tijdens de designfase van belang hier rekening mee te houden. We hebben daarom gekozen voor een zo neutraal mogelijke opzet. Waarbij vast gestelde kleuren en fonts kunnen wijzigen in de huisstijl van een bepaalde bouwmarkt.

Er zijn behoorlijk veel keuze mogelijkheden in de configurator. De UI neemt de gebruiker stap voor stap mee middels een metro lijn. Waarbij een venster in en uit te klappen is met een “plus” of “min”. De metro lijn zorgt ervoor dat de gebruiker een direct overzicht heeft van de stappen en waar deze zich bevind. Het 3D model staat altijd “fixed” aan de linkerzijde. De UI scrolt hier langs af zodat altijd in real time te zien is welke aanpassing er doorgevoerd worden.

We hebben eenvoudig geïllustreerde weergaven gemaakt van de vormen, en de af te werken zijdes.
Hiermee laten we de gebruiker in 1 oogopslag zien welke handelingen hij kan uitvoeren en wat deze betekenen. Zo kun je een plaat bijvoorbeeld zowel aan de boven als aan de onderzijde schuin, rond of verstek zagen. Door schuif buttons te gebruiken ziet de gebruiker direct welke van de 2 acties is toegepast.

Als de gebruiker naar het laatste punt van de configurater scrollt schuift al scrollend een overzicht naar boven met alle geconfigureerde platen en de totaal prijs hiervan. Van hieruit zijn weer nieuwe platen toe te voegen of kan men de configuratie aanpassen. Op deze manier houden we de UI overzichtelijk en gebruiksvriendelijk.