Geert-Jan Hendriks
Geert-Jan Hendriks
11 juni 2021

Het designproces van onze Four Auctions veilingsoftware

We vertellen je graag meer over hoe het design voor onze veilingsoftware tot stand is gekomen.

Het designproces van onze Four Auctions veilingsoftware

Enige tijd geleden zijn we begonnen met de ontwikkeling van onze nieuwe veilingsoftware Four Auctions. De filosofie achter deze veilingsoftware is dat het voor iedereen mogelijk moet zijn om eenvoudig een veilingwebsite te beginnen. De software is geheel ontwikkeld in eigen huis. We vertellen je graag wat meer hoe het design tot stand is gekomen.

Fase 1: Brainstormen

In de beginfase van het ontwerpproces stelden wij ons de volgende vragen:

  • Wat moet de software kunnen?
  • Welke views en welke pagina’s hebben we nodig?
  • Hoe tonen we alle informatie en componenten op een overzichtelijke manier?

Hierbij gingen we uit van een MVP (minimum viable product) waarbij je als bezoeker kan registreren, een bod kan uitbrengen op een kavel en een kavel kan winnen. Een site-eigenaar moet makkelijk een veiling met kavels kunnen aanmaken. Op een whiteboard tekenden we de flow uit van registreren tot bieden tot het winnen van een kavel.

Tevens een vereiste voor het ontwerp was om een strak, modern en overzichtelijk design te maken wat door meerdere klanten kan worden gebruikt door zaken als kleuren, typografie en logo aan te passen. Een simpel ontwerp zonder al te veel poespas helpt hierbij en komt de gebruiksvriendelijkheid ten goede.

Fase 2: Wireframes maken

Nu we de vragen uit de brainstormfase hebben beantwoord, kunnen we doorgaan naar de volgende fase: het maken van wireframes. In de wireframes bepalen we welke elementen waar moeten te komen staan zoals buttons, invoervelden, teksten en afbeeldingen. Hierbij kijken we nog niet naar zaken als kleurgebruik en welke fonts er gebruikt moeten worden (Dit komt pas in de designfase).

De wireframes

Omdat we met meerdere designers tegelijk aan het ontwerp werkten, hebben we gebruik gemaakt van Invision. Deze tool stelt ons in staat om in teamverband op hetzelfde moment aan een ontwerp te werken. Dit heeft als voordeel dat wanneer collega A een component heeft gemaakt dit direct kan worden hergebruikt door collega B.

Fase 3: Design in sketch

Na een aantal iteraties zijn de wireframes gereed om verder uitgewerkt te worden. Hiervoor gebruikten we Sketch. In Sketch kunnen we ook herbruikbare componenten ontwerpen. Een ander voordeel van Sketch is dat het ontwerp makkelijk kan worden gedeeld in de cloud met andere collega’s. Ook hier hielden we in ons achterhoofd dat het design in de basis geschikt moet zijn voor iedere klant.

Het ontwerp in Sketch

Voor de basiskleuren hielden we de kleuren aan van de Four Auctions huisstijl. (Overigens ging de huisstijl van Four Auctions ook op de kop, een nieuwe informerende website met nieuw logo werd tegelijk ontwikkeld en gelanceerd).

Nadat de designs intern waren goedgekeurd konden we aan de slag met de daadwerkelijke ontwikkeling (Hierover zullen we je wellicht in de nabije toekomst meer over vertellen). Inmiddels zijn de eerste veilingsites live. Ook benieuwd naar onze nieuwe veilingsoftware? Neem dan eens een kijkje op www.fourauctions.nl of maak een afspraak voor een demo.

We love code