De Online Boekfabriek en De Boekwerkplaats vormen samen één helder ecosysteem voor schrijvers: eerst leren en overzicht krijgen, daarna de juiste experts inschakelen. De Online Boekfabriek is het kennisplatform met praktische artikelen en tools over boeken schrijven en uitgeven. De Boekwerkplaats is het matchingsplatform waar schrijvers gekoppeld worden aan freelancers die kunnen helpen bij het maken van een boek (zoals redacteurs, schrijfcoaches en illustrators).
Dit project heb ik uitgevoerd namens Spotlight Webdesign, in samenwerking met Mariette Zwaneveld. Ik heb het grootste deel van het UX- en UI-ontwerp opgepakt en nauw samengewerkt met een developer voor de technische realisatie van de maatwerk onderdelen.
De uitdaging
De opdracht vroeg om twee verschillende websites met één gezamenlijke belofte: schrijvers helpen om van idee naar professioneel boek te komen.
Belangrijkste uitdagingen:
- Een duidelijke structuur neerzetten voor een kennisplatform: bezoekers moeten snel vinden waar ze zijn, wat ze kunnen leren en wat de volgende stap is
- Een matchingsplatform ontwerpen dat voor twee doelgroepen logisch werkt:
- schrijvers die hulp zoeken
- freelancers die gevonden willen worden en hun aanbod professioneel willen tonen
- Complexe functionaliteit (zoals profielen, filters, reviews en statistieken) vertalen naar een ervaring die simpel en prettig blijft
- Een visuele stijl neerzetten die professioneel en modern is, maar ook warm en toegankelijk
Aanpak
Het project is opgeknipt in behapbare stappen:
- Doelen en doelgroepen scherp gezet (schrijvers vs freelancers)
- Informatie-architectuur en navigatie uitgewerkt voor beide onderdelen
- Wireframes en prototypes in Figma voor de belangrijkste pagina’s en flows
- UI-design uitgewerkt in een consistente stijl (componenten, states, herbruikbare patronen)
- Intensieve afstemming met stakeholders en developer over details, edge cases en maatwerk functionaliteiten
Tijdens de ontwikkeling van deze website hebben we, naast de developer, ook samengewerkt met:
- Huisstijl & illustraties: Suzan de Nijs van Suzign
- Fotografie: Joy van der Valk
Werkwijze & tools
Voor dit project werkten we met Figma als ontwerptool, waarbij we elk project startten vanuit een flexibel design system. Het ontwerp werd voornamelijk in desktopvariant uitgewerkt, omdat onze klanten zo het beste overzicht kregen en makkelijker feedback konden geven. We bouwden de website in WordPress met Elementor als page builder, vanwege de balans tussen toegankelijke code en gebruiksgemak voor de klant. Meer over deze werkwijze lees je op de projectpagina van Spotlight Webdesign.
Onderdeel 1: De Online Boekfabriek (kennisplatform)
De Online Boekfabriek is ontworpen als een laagdrempelig startpunt voor schrijvers die overzicht zoeken in alles wat er komt kijken bij schrijven en uitgeven. De positionering is helder: boeken schrijven en uitgeven, stap voor stap, zonder overweldigd te raken. Naast praktische, kennis en tools vind je hier ook toegankelijke producten zoals e-books, templates, masterclasses en cursussen. De website biedt duidelijke routes naar de juiste content, zoals de uitgebreide kennisbibliotheek en het productaanbod, en is opgebouwd met een rustige, toegankelijke uitstraling. Alles is erop gericht om vertrouwen te geven en bezoekers uit te nodigen om verder te lezen, te leren en zelfverzekerd aan de slag te gaan.
Bekijk de website hier: deonlineboekfabriek.nl/
Onderdeel 2: De Boekwerkplaats (matchingplatform)
De Boekwerkplaats draait volledig om het snel en met vertrouwen koppelen van schrijvers aan de juiste freelancer. Het platform is zo ontworpen dat zowel schrijvers als freelancers zich direct thuis voelen en makkelijk hun weg vinden. Voor schrijvers betekent dit gericht zoeken naar de juiste hulp, terwijl freelancers hun aanbod professioneel kunnen presenteren. Alles is gericht op overzicht, vertrouwen en gebruiksgemak.
Belangrijke UX/UI onderdelen die zijn ontworpen:
- Zoeken en filteren: zodat schrijvers gericht kunnen kiezen
- Profielen die vertrouwen geven in één oogopslag (expertise, tarieven, ervaring)
- Reviews om kwaliteit zichtbaar te maken
- Dashboards/‘mijn account’-structuren voor beide rollen
- Schrijver-profiel met o.a. basisgegevens, instellingen, overzicht en reviews
- Freelancer-profiel met o.a. skills/ervaring, tarieven (per woord/project/uur/op aanvraag) en project-/statusbeheer
- Statistieken om inzicht te geven en het platform te laten voelen als een professioneel systeem
Bekijk de website hier: deboekwerkplaats.nl
Resultaat
Samen vormen De Online Boekfabriek en De Boekwerkplaats een compleet en logisch geheel. Schrijvers kunnen eerst zelfstandig kennis opdoen en daarna (als ze willen) moeiteloos door naar de juiste hulp. Het platform voelt overzichtelijk en betrouwbaar, ook met veel content en functionaliteit. De twee onderdelen versterken elkaar: kennis bouwt vertrouwen op, de match maakt de volgende stap concreet.
Leermomenten & uitdagingen
Dit was ons eerste écht grote platformproject, én de eerste intensieve samenwerking met onze huidige developer (Evelien). Het vroeg om veel meer voorwerk: alle scenario’s, edge cases en technische wensen moesten vooraf helder zijn. Ondanks onze voorbereiding kwamen we tijdens het ontwikkelen toch nog situaties tegen die extra aandacht vroegen, zoals het optimaliseren van de filters in De Boekwerkplaats, zodat filteropties dynamisch op elkaar reageren. Ook liepen we tegen technische hobbels aan, bijvoorbeeld met e-mails die in spam terechtkwamen. We hebben steeds snel geschakeld met de juiste specialisten en hielden de klant op de hoogte van voortgang en keuzes.
Een belangrijke les: hoe groter het project, hoe belangrijker het is om ruimte te houden voor onverwachte technische uitdagingen én voor goede communicatie met alle betrokkenen.
Toegankelijkheid
Voor dit project kozen we bewust voor Elementor als basis: een page builder die een goede balans biedt tussen toegankelijke code en gebruiksgemak voor de klant. We testten kleurcontrasten met Adobe Color; aanpassingen (zoals het donkerder maken van lila) stemden we af met de klant, die dit waar nodig met de brand designer terugkoppelde om optimale leesbaarheid te waarborgen.