Promo 
Page 
Creator

Dit 
afstudeerproject, 
dat 
ik 
gemaakt 
heb 
tijdens 
mijn 
stage 
bij 
iO, 
richt 
zich 
op 
het 
verbeteren 
van 
het 
maken 
van 
tijdelijke 
themapagina's 
voor 
promoties 
met 
behulp 
van 
generatieve 
AI. 
Het 
doel 
was 
om 
het 
werk 
sneller 
en 
gemakkelijker 
te 
maken, 
zodat 
iO 
en 
haar 
klanten 
minder 
handmatig 
werk 
hoeven 
te 
doen.
Opdrachtgever
iO 
Digital
Type
Product 
Design
Promo Page Creator

Proces

Het 
belangrijkste 
probleem 
waar 
iO 
en 
haar 
klanten 
mee 
te 
maken 
hadden, 
is 
het 
handmatig 
creëren 
van 
deze 
pagina's. 
Deze 
pagina's 
zijn 
tijdelijk 
nodig, 
en 
het 
proces 
om 
ze 
handmatig 
en 
vanaf 
nul 
te 
maken 
was 
een 
knelpunt. 
Om 
dit 
probleem 
aan 
te 
pakken 
waren 
in 
grote 
lijnen 
de 
volgende 
doelen 
opgesteld:
  • Onderzoek 
    de 
    problemen 
    en 
    eisen 
    van 
    de 
    eindgebruikers.
  • Onderzoek 
    en 
    analyseer 
    bestaande 
    AI-frameworks 
    en 
    tools.
  • Beoordeel 
    de 
    kwaliteit, 
    aanpasbaarheid 
    en 
    richtlijnen 
    van 
    deze 
    tools.
  • Maak 
    met 
    deze 
    tools 
    een 
    gebruiksvriendelijk 
    prototype.

Verzamelen 
van 
inzichten

Tijdens 
interviews 
met 
marketeers 
van 
iO 
en 
hun 
klanten 
Prominent 
en 
IGM, 
kwamen 
enkele 
belangrijke 
inzichten 
naar 
voren:
  • Marketeers 
    ervaarden 
    uitdagingen 
    bij 
    het 
    vertalen 
    van 
    ideeën 
    naar 
    daadwerkelijke 
    webpagina's.
  • Een 
    consistente 
    tone 
    of 
    voice 
    is 
    belangrijk, 
    vooral 
    bij 
    het 
    communiceren 
    van 
    de 
    visie 
    van 
    een 
    bedrijf.
  • Het 
    behouden 
    van 
    een 
    consistente 
    branding 
    was 
    ook 
    belangrijk.
  • Er 
    was 
    behoefte 
    aan 
    layout 
    templates 
    om 
    het 
    proces 
    te 
    versnellen.
  • Integraties 
    met 
    systemen 
    zoals 
    Storyblok 
    en 
    Magento 
    werden 
    als 
    waardevolle 
    toevoegingen 
    gezien.
  • Eenvoud 
    en 
    aanpasbaarheid 
    waren 
    belangrijke 
    factoren 
    voor 
    het 
    gebruik 
    van 
    de 
    tool.
Deze 
inzichten 
waren 
een 
sterke 
basis 
voor 
het 
ontwerpen 
en 
ontwikkelen 
van 
een 
tool 
die 
aansluit 
bij 
de 
behoeften 
van 
de 
gebruikers.
Promo Page Creator - Persona

Ontwerpen

Tijdens 
de 
conceptfase 
heb 
ik 
een 
layout 
ontworpen 
die 
ruimte 
biedt 
voor 
toekomstige 
uitbreidingen 
zonder 
dat 
de 
pagina 
rommelig 
wordt. 
Het 
idee 
kwam 
op 
om 
als 
basis 
een 
layout 
te 
gebruiken 
zoals 
die 
van 
ChatGPT 
Plus, 
omdat 
deze 
structuur 
een 
overzichtelijke 
weergave 
van 
verschillende 
opties 
mogelijk 
maakt. 
De 
stakeholders 
stemden 
hiermee 
in.
Daarnaast 
was 
het 
belangrijk 
dat 
de 
interface 
zowel 
georganiseerd 
als 
eenvoudig 
bleef, 
met 
voldoende 
ruimte 
voor 
toekomstige 
functies 
en 
aanpassingen. 
De 
ontwikkelde 
wireframes 
vormden 
een 
basis 
voor 
een 
schaalbare 
tool 
die 
aansluit 
bij 
de 
behoeften 
van 
de 
gebruikers 
en 
flexibel 
verder 
ontwikkeld 
kan 
worden.
Promo Page Creator - Wireframe 1
Promo Page Creator - Wireframe 2
Promo Page Creator - Wireframe 3

Eerste 
gebruikerstests

Om 
de 
gebruiksvriendelijkheid 
van 
de 
tool 
te 
testen 
en 
eventuele 
ontbrekende 
functionaliteiten 
te 
ontdekken, 
had 
ik 
gebruikerstests 
uitgevoerd 
met 
twee 
marketeers 
van 
iO 
en 
twee 
van 
hun 
cliënten: 
IGM 
en 
Prominent. 
Tijdens 
de 
tests 
doorliepen 
de 
gebruikers 
een 
scenario 
waarin 
alle 
functies 
van 
de 
tool 
werden 
gebruikt, 
gevolgd 
door 
vragen 
over 
hun 
ervaring. 
Hieruit 
kwamen 
de 
volgende 
suggesties:
  • Volledige 
    item 
    klikbaar 
    maken 
    bij 
    het 
    selecteren 
    van 
    producten.
  • Meer 
    controle 
    over 
    foto 
    generatie 
    met 
    de 
    mogelijkheid 
    deze 
    opnieuw 
    te 
    genereren.
  • Mogelijkheid 
    om 
    pagina’s 
    te 
    publiceren 
    naar 
    verschillende 
    CMS-platformen.
  • Secties 
    moeten 
    verplaatst 
    kunnen 
    worden 
    voor 
    betere 
    lay-out 
    controle.
  • Zichtbaarheid 
    van 
    pagina’s 
    op 
    verschillende 
    schermformaten.
  • Het 
    selecteren 
    en 
    hergenereren 
    van 
    secties 
    duidelijker 
    maken.

Verbeteringen

Na 
de 
eerste 
ronde 
gebruikerstests 
heb 
ik 
waardevolle 
feedback 
ontvangen 
om 
de 
gebruikservaring 
van 
de 
tool 
te 
verbeteren. 
Tijdens 
deze 
tests 
konden 
gebruikers 
direct 
aangeven 
wat 
goed 
werkte 
en 
wat 
beter 
kon. 
Deze 
inzichten 
hielpen 
bij 
het 
vinden 
van 
de 
belangrijkste 
verbeterpunten 
die 
ik 
kon 
implementeren. 
Het 
doel 
was 
om 
de 
tool 
gebruiksvriendelijker 
te 
maken 
op 
basis 
van 
de 
ervaringen 
van 
de 
testers. 
De 
volgende 
iteraties 
waren 
gemaakt 
op 
basis 
van 
feedback:

Sectie-bewerking

Voorheen 
werd 
een 
sectie 
gewijzigd 
door 
in 
bewerkmodus 
een 
prompt 
in 
te 
voeren 
via 
een 
invoerveld 
linksonder 
in 
het 
scherm. 
Dit 
was 
echter 
onduidelijk 
voor 
een 
aantal 
gebruikers. 
Het 
invoerveld 
is 
nu 
direct 
onder 
de 
geselecteerde 
sectie 
geplaatst, 
wat 
het 
veel 
eenvoudiger 
maakt 
om 
wijzigingen 
aan 
te 
brengen. 
Ook 
wordt 
nu 
het 
volledige 
scherm 
gebruikt 
in 
bewerkmodus, 
waardoor 
de 
focus 
volledig 
op 
de 
secties 
ligt.

Product 
selectie

Voorheen 
moest 
de 
gebruiker 
specifiek 
op 
een 
selectievakje 
klikken 
om 
een 
product 
te 
kiezen, 
wat 
onhandig 
was. 
Het 
volledige 
productitem 
is 
nu 
klikbaar, 
waardoor 
de 
selectie 
van 
producten 
sneller 
en 
eenvoudiger 
verloopt.

Publicatiefunctie

Een 
ontbrekende 
functionaliteit 
was 
de 
mogelijkheid 
om 
de 
pagina 
te 
publiceren. 
Deze 
functie 
moest 
worden 
toegevoegd 
zonder 
de 
zichtbaarheid 
van 
de 
gegenereerde 
pagina 
te 
belemmeren. 
Een 
header 
was 
toegevoegd 
aan 
de 
interface 
met 
de 
publicatieknop 
rechtsboven. 
Dit 
zorgt 
voor 
een 
duidelijke 
en 
toegankelijke 
publicatiefunctie.

Titelbewerker

Als 
laatste 
is 
besloten 
dat 
een 
titelbewerker 
een 
waardevolle 
toevoeging 
aan 
de 
tool 
zou 
zijn. 
Met 
deze 
functie 
kunnen 
gebruikers 
een 
passende 
titel 
invoeren 
voordat 
ze 
de 
pagina 
publiceren, 
wat 
de 
gebruiksvriendelijkheid 
van 
de 
tool 
verder 
vergroot. 
Daarnaast 
draagt 
deze 
optie 
bij 
aan 
een 
betere 
SEO, 
doordat 
de 
titels 
optimaal 
kunnen 
worden 
aangepast 
op 
zoekmachines 
en 
daarmee 
de 
zichtbaarheid 
en 
vindbaarheid 
van 
de 
pagina's 
wordt 
verbeterd.

Resultaat

Ten 
slotte 
heb 
ik 
een 
laatste 
ronde 
gebruikerstests 
uitgevoerd 
met 
twee 
andere 
marketeers 
van 
iO. 
Deze 
tests 
waren 
gericht 
op 
het 
verfijnen 
van 
de 
gebruikerservaring 
en 
het 
valideren 
van 
de 
meest 
recente 
aanpassingen 
aan 
de 
tool. 
De 
marketeers 
doorliepen 
een 
scenario 
waarin 
ze 
alle 
functies 
van 
de 
tool 
gebruikten 
en 
gaven 
feedback 
over 
hun 
gebruikservaring.
Hun 
inzichten 
bevestigden 
de 
effectiviteit 
van 
de 
verbeteringen 
die 
tijdens 
eerdere 
iteraties 
waren 
doorgevoerd, 
en 
gaven 
een 
laatste 
bevestiging 
dat 
de 
tool 
aansluit 
bij 
de 
behoeften 
van 
de 
gebruikers. 
Na 
deze 
afrondende 
gebruikerstests 
was 
het 
eindresultaat 
een 
functionele, 
gebruiksvriendelijke 
tool 
die 
de 
marketeers 
ondersteunt 
bij 
het 
snel 
en 
efficiënt 
creëren 
van 
tijdelijke 
promotie 
pagina's.
Volgend project (Range Lab)

© Luuk Briels