Ontwikkeldoel 2

Leerdoel 2

Ik wil tijdens mijn stage leren hoe ik mezelf professioneel kan presenteren via een persoonlijke portfoliowebsite, zodanig dat ik vóór het einde van mijn stageperiode een eigen huisstijl en website heb ontwikkeld die mijn studie, stageproducten en persoonlijke ontwikkeling duidelijk laten zien.

Ik had al een persoonlijke website waarop mijn schoolproducten stonden, maar deze paste niet goed bij wie ik ben. De website zag er verouderd uit en liet mijn persoonlijkheid, vaardigheden en ontwikkeling niet duidelijk zien. Met mijn toekomstige carrière in gedachten wilde ik daarom een portfolio maken waar ik zelf trots op ben en waarmee ik mezelf professioneler kan presenteren.

Actie 1: Huisstijl ontwikkelen

Ik ontwikkel een eigen huisstijl voor mijn persoonlijke portfoliowebsite. Hierbij bepaal ik welke kleuren, typografie, vormen, beeldstijl en tone of voice bij mij passen.

Actie 2: Website bouwen met Codex AI

Ik gebruik Codex AI als ondersteuning bij het bouwen van mijn persoonlijke portfoliowebsite. Hierbij laat ik AI meedenken en code genereren, maar controleer en pas ik de code zelf aan waar dat nodig is. Het doel is dat ik beter leer begrijpen hoe mijn website technisch is opgebouwd en hoe ik AI kan gebruiken als hulpmiddel bij digitale uitvoering.

Acties doel 2

Nulmeting

Aan het begin van mijn stage had ik al een persoonlijke website waarop mijn schoolproducten stonden. Deze website was vooral functioneel, maar paste niet goed bij hoe ik mezelf professioneel wilde presenteren. De uitstraling was vrij simpel en liet mijn persoonlijkheid, creativiteit en vaardigheden niet duidelijk zien. Ik had nog geen duidelijke eigen huisstijl voor mijn portfolio. Ik wist wel ongeveer welke uitstraling ik mooi vond, maar ik had dit nog niet concreet vertaald naar kleuren, typografie, vormen, beeldgebruik en tone of voice. Daardoor voelde mijn website nog niet als iets wat echt bij mij paste. Ook had ik nog weinig ervaring met het zelf bouwen en aanpassen van een website met code. Ik kon wel meedenken over de inhoud en opbouw van een website, maar ik had nog geen vaste werkwijze om technische aanpassingen zelfstandig uit te voeren. Codex AI had ik nog niet eerder structureel gebruikt als hulpmiddel bij het bouwen van een persoonlijke website. Daardoor was mijn startpunt dat ik wel wist dat ik een betere portfoliowebsite wilde maken, maar nog moest leren hoe ik mijn eigen stijl kon vertalen naar een professioneel ontwerp en hoe ik AI kon gebruiken om de website technisch te bouwen en te verbeteren.

Actie 1 – Huisstijl document

Voor mijn studie Commerciële Economie aan Avans ontwikkel ik een eigen portfolio website. Deze website is bedoeld om mijn studieontwikkeling, stage, projecten, en bewijsstukken op een duidelijke manier te presenteren. De website is een verzamelplek voor school, maar ook een persoonlijk digitaal visitekaartje. Daarom heb ik gekozen om een eigen huisstijl te ontwikkelen. Deze huisstijl vormt de basis voor de nieuwe portfolio website. In dit document leg ik uit welke keuzes ik heb gemaakt op het gebied van kleur, typografie, vormen, beeldstijl en tone of voice. Ook onderbouw ik waarom deze keuzes bij mij, mijn studie en mijn professionele ontwikkeling passen.

Plan

Planning actie 1

Stageweek Actie Onderwerp Week 15 1 Starten met het ontwikkelen van mijn eigen huisstijl. Bepalen welke uitstraling bij mij past en welke kernwoorden centraal moeten staan.

Week 16

1 Uitwerken van de visuele richting. Keuzes maken voor kleuren, typografie en beeldstijl. Week 17 1 Aanscherpen en concreet maken van de huisstijl. Beoordelen of de keuzes goed passen bij mijn studie, stage en toekomstige carrière.

Do

Tijdens deze actie heb ik mijn eigen huisstijl ontwikkeld voor mijn persoonlijke portfoliowebsite. Hierbij heb ik nagedacht over de uitstraling die bij mij past en hoe ik mezelf professioneel wil presenteren richting school, stage en toekomstige werkgevers. Ik heb de huisstijl uitgewerkt in een apart huisstijldocument. In dit document staan de belangrijkste keuzes voor kleurgebruik, typografie, beeldstijl, vormen en tone of voice. Ook heb ik onderbouwd waarom deze keuzes passen bij mijn persoonlijkheid, mijn studie Commerciële Economie en de richting waarin ik mij ontwikkel. De huisstijl is opgebouwd rond het idee van een gestructureerd creatief portfolio. De website moest overzichtelijk blijven voor school, maar ook duidelijker laten zien wie ik ben en waar mijn interesses liggen. Daarom heb ik gekozen voor een combinatie van professionele basiskleuren, een opvallende blauwe accentkleur, grote typografie, grafische elementen en handgeschreven details. De visuele uitwerking heb ik daarna gebruikt als basis voor de bouw van mijn nieuwe portfoliowebsite. Hierdoor ontstond er eerst een duidelijke stijlrichting, voordat ik met de technische uitwerking van de website verder ging. Zie bijlage leerdoel 2 voor het volledige huisstijldocument.

Check

Tijdens het ontwikkelen van de huisstijl heb ik steeds gekeken of de stijl nog paste bij het doel van de website. De website moest persoonlijk zijn, maar niet te speels. Ook moest hij creatief zijn, maar wel duidelijk genoeg voor school. Daarom heb ik steeds gezocht naar een balans tussen vormgeving en leesbaarheid.

Ik heb gemerkt dat vooral de combinatie van donkere kleuren, off white vlakken en electric blue goed werkt. De donkere basis geeft de website een professionele uitstraling. De blauwe accenten zorgen ervoor dat de site meer energie krijgt. De lichte vlakken zorgen dat teksten beter leesbaar blijven. De eerste versies waren soms nog te druk of te veel gericht op vorm. Daarom heb ik later beter gekeken naar rust, witruimte en leesbaarheid. Niet elk visueel detail hoeft overal terug te komen. Juist door accenten beperkt te gebruiken, wordt de huisstijl sterker.

Feedback mede stagiair Tijn

Ja, ik vind echt dat je een goede huisstijl hebt gemaakt, ik vind het wel bij jou passen, dat blauwe past goed in het thema van AI. En het ziet er wel professioneel uit voor een schoolporftolio. Ik krijg het beeld alsof je echt al een professional bent op het gebied van ai toepassingen en het bouwen van websites.Ja het is duidelijk waarom je de keuzes hebt gemaakt voor deze kleuren en lettertypes. Als tip zou ik nog kunnen zeggen dat je wat meer foto’s mag gebruiken op je site, om de bezoeker beter te laten zien waar je nou echt mee bezig bent geweest.

Reflectie

Door deze actie heb ik geleerd dat een huisstijl meer is dan alleen kleuren en lettertypes kiezen. Het gaat vooral om het vertalen van wie ik ben en wat ik wil uitstralen naar een visuele stijl. Mijn oude portfolio liet vooral zien welke producten ik had gemaakt, maar niet echt wie ik ben of hoe ik mij ontwikkel. Deze huisstijl past beter bij mij omdat hij structuur en creativiteit combineert. Ik wil professioneel overkomen, maar niet standaard. De website moet laten zien dat ik bezig ben met commerciële economie, marketing, onderzoek en AI toepassingen. De huisstijl helpt om die onderdelen op een herkenbare manier samen te brengen. Deze actie heeft mij ook geholpen om bewuster na te denken over persoonlijke profilering. Ik heb geleerd dat een portfolio niet alleen een plek is om bestanden te verzamelen. Het is ook een manier om te laten zien hoe ik werk, wat ik belangrijk vind en welke richting ik op wil.

Act – Toekomstige stappen

Als vervolgstap wil ik mijn huisstijl blijven gebruiken als vaste basis voor mijn portfoliowebsite. Ik heb gemerkt dat het helpt om eerst duidelijk te bepalen welke uitstraling bij mij past, voordat ik losse pagina’s of onderdelen ga maken. Daardoor blijft de website meer één geheel. In de toekomst wil ik de huisstijl nog verder verbeteren op basis van feedback. Vooral de balans tussen creatief en professioneel blijft belangrijk. De website moet opvallen, maar moet ook duidelijk blijven voor school, stage en toekomstige werkgevers. Ook wil ik mijn huisstijl blijven toepassen op nieuwe onderdelen van mijn portfolio. Als ik nieuwe projecten, bewijsstukken of reflecties toevoeg, wil ik controleren of deze nog steeds passen bij de gekozen kleuren, typografie, beeldstijl en tone of voice. De belangrijkste vervolgstap is dat ik de huisstijl niet alleen als ontwerp zie, maar als manier om mezelf professioneel te presenteren. De stijl moet blijven meegroeien met mijn ontwikkeling, maar wel herkenbaar blijven als mijn eigen portfolio.

Actie 2 – Website bouwen met codex

Voor deze actie wilde ik een portfoliowebsite gaan bouwen met de huisstijl van actie 1. Ik heb gekozen om Codex AI te gebruiken, omdat ik zelf nog weinig ervaring had met coderen. Ik wilde wel leren hoe een website technisch is opgebouwd en hoe ik AI kan gebruiken zonder de controle kwijt te raken. ChatGPT gebruikte ik om technische dingen beter te begrijpen en om goede prompts voor Codex te schrijven. Codex gebruikte ik daarna om code aan te passen het programma Visual Studio Code.

Plan

Stageweek Actie Onderwerp Week 15 2 Starten met de technische opzet van de portfoliowebsite. Leren hoe ik Codex het beste kan gebruiken.

Week 16

2 De huisstijl vertalen naar de website. Onder andere de visuele opbouw, homepage en pagina’s van eerdere jaren. Week 17 2 De website verder verbeteren en controleren. Technische problemen oplossen en de website klaarmaken om te delen en feedback op te halen.

Do

Tijdens deze actie heb ik met behulp van ChatGPT en Codex AI gewerkt aan mijn persoonlijke portfoliowebsite. De website is opgebouwd met Next.js, TypeScript en Tailwind CSS. Dit was voor mij nieuw, waardoor ik ChatGPT vooral gebruikte om technische onderdelen beter te begrijpen. Codex gebruikte ik daarna als hulpmiddel om code aan te passen en nieuwe onderdelen te bouwen. Een belangrijk onderdeel was het goed aansturen van Codex. Ik gebruikte ChatGPT om prompts te schrijven die ik daarna in Codex kon plakken. Daardoor kon ik gerichter uitleggen wat Codex moest aanpassen. Bijvoorbeeld dat Codex niet zomaar de hele website opnieuw moest bouwen, maar alleen een specifiek onderdeel moest aanpassen. Ook leerde ik dat Codex duidelijke grenzen nodig heeft, zoals: behoud de bestaande routes, pas alleen de gevraagde component aan en verander de huisstijl niet zonder reden. Een groot deel van de actie ging over het technisch toepassen van mijn huisstijl. De website moest geen standaard schoolportfolio worden, maar een gestructureerd creatief portfolio. Daarom is gewerkt met grote typografie, donkere basiskleuren, off white vlakken, electric blue accenten, grafische lijnen, dot patterns, handgeschreven details en dossierkaarten. Ook heb ik geleerd dat AI output niet altijd meteen goed is. In één van de eerste bouwrondes kwam de website er anders uit dan ik wilde. De stijl voelde nog te veel als een standaard AI ontwerp en sloot niet goed genoeg aan op mijn brand book. Daarom heb ik feedback gegeven en is er een nieuwe prompt gemaakt waarbij Codex de oude visuele richting moest loslaten en opnieuw moest bouwen vanuit de huisstijlbestanden. Dit was een belangrijk moment, omdat ik merkte dat ik zelf kritisch moest blijven op het resultaat. Daarna heb ik met ChatGPT en Codex verschillende onderdelen verbeterd. De homepage werd aangepast met een sterkere hero, mijn portretillustratie, grote typografie en projectkaarten. Ook is de jaarstructuur verbeterd, zodat Jaar 1, Jaar 2, Jaar 3 en Jaar 4 duidelijker werden weergegeven. Jaar 3 CE kreeg meer nadruk, omdat dit het belangrijkste jaar is voor mijn stage, actieonderzoek en persoonlijke ontwikkeling. Tijdens het bouwen liep ik ook tegen praktische codeproblemen aan. Een voorbeeld hiervan was de homepage hero. Daar zat te veel lege ruimte tussen de header en de titel, waardoor de pagina niet goed uitkwam. Door samen naar de code te kijken, ontdekte ik dat dit zat in components/CreativeHero.tsx. Ik leerde dat classes zoals pt-10, lg:pt-20 en min-h invloed hebben op de ruimte en hoogte van een onderdeel. Door die waarden aan te passen, werd de hero compacter. Dit zorgde ervoor dat ik de code zelf steeds beter begon te begrijpen, en dus niet meer volledig afhankelijk was van codex om aanpassingen op de website te doen. Naast de visuele en technische verbeteringen heb ik ook gewerkt aan de inhoud van de website. Ik heb teksten aangepast voor de homepage, de jaarpagina’s, de stage onderdelen en de CTA’s. Hierbij ging het erom dat de website duidelijk laat zien wat ik tijdens mijn studie en stage heb gedaan. De teksten moesten korter, concreter en persoonlijker worden. ChatGPT hielp om teksten te verbeteren, maar ik bepaalde zelf welke toon en inhoud passend waren. Wat ik goed vond aan het gebruik van AI in deze actie, is dat het mij hielp om technische stappen uit te voeren die ik zonder hulp nog niet goed begreep. ChatGPT legde uit waar ik moest zoeken, welke bestanden waarschijnlijk belangrijk waren en hoe bepaalde Tailwind classes werkten. Codex hielp vervolgens om onderdelen technisch aan te passen. Hierdoor kon ik sneller bouwen en tegelijkertijd beter begrijpen hoe mijn website in elkaar zat. Wat minder goed werkte, is dat AI soms te veel aannames deed of te grote wijzigingen wilde maken. Soms kwam een oplossing er visueel anders uit dan bedoeld. Soms moest ik opnieuw uitleggen dat Codex niet de hele website mocht veranderen, maar alleen een specifiek onderdeel. Ook merkte ik dat ik screenshots en code moest blijven controleren, omdat een kleine fout in een component de layout kon verstoren. Mijn eigen inbreng zat vooral in het bepalen van de richting, het beoordelen van de output en het bijsturen van Codex. Ik bepaalde zelf hoe de website eruit moest zien, welke structuur belangrijk was voor Avans, welke onderdelen op de website moesten komen en wanneer een AI oplossing niet goed genoeg was. AI hielp dus bij de technische uitvoering, maar nam de keuzes niet volledig over. Website link: https://matsluijten.nl

Check

Feedback

Reflectie

Door deze actie heb ik geleerd dat een website bouwen niet alleen gaat over mooie vormgeving. Het gaat ook over structuur, componenten, routes, code, styling, testen en publiceren. Voor deze actie had ik nog minimale ervaring met het werken in een codeproject. Door ChatGPT en Codex te gebruiken, heb ik beter geleerd hoe een websiteproject is opgebouwd en hoe ik technische problemen stap voor stap kan aanpakken. Ik heb ook geleerd dat AI vooral goed werkt wanneer ik heel duidelijk ben in mijn opdracht. Als mijn prompt te algemeen was, kreeg ik vaak een te algemene of te grote aanpassing terug. Wanneer ik duidelijk aangaf welk bestand aangepast moest worden, wat behouden moest blijven en wat het doel van de wijziging was, werd de output veel bruikbaarder. Deze actie laat zien dat ik AI heb gebruikt als hulpmiddel om mezelf professioneler te presenteren. De website is niet zomaar door AI gemaakt. Ik heb zelf de huisstijl bepaald, de structuur bewaakt, output gecontroleerd, fouten gecorrigeerd en geleerd hoe ik onderdelen zelf kan aanpassen. Daardoor heb ik niet alleen een betere portfoliowebsite ontwikkeld, maar ook meer technische kennis opgedaan over digitale uitvoering.

Act – Toekomstige stappen

Als vervolgstap wil ik mijn portfoliowebsite blijven verbeteren en aanvullen. De basis van de website staat nu goed, maar ik wil hem blijven gebruiken als levend portfolio. Nieuwe projecten, stageproducten en bewijsstukken wil ik daarom blijven toevoegen. Ook wil ik beter worden in het zelf begrijpen en aanpassen van code. Tijdens deze actie heb ik veel met Codex AI gewerkt, maar ik merkte dat het belangrijk blijft om zelf te snappen wat er gebeurt. In de toekomst wil ik dus minder afhankelijk worden van AI bij kleine aanpassingen, zoals teksten, spacing, kleuren en componenten. Daarnaast wil ik Codex AI gerichter blijven gebruiken. Ik heb geleerd dat Codex betere output geeft wanneer mijn opdracht duidelijk is. Daarom wil ik bij toekomstige aanpassingen steeds specifieker aangeven welk bestand aangepast moet worden, wat behouden moet blijven en wat het doel van de wijziging is. De belangrijkste vervolgstap is dat ik mijn website blijf doorontwikkelen als professioneel bewijsstuk. Niet alleen voor school, maar ook voor mijn stage, toekomstige sollicitaties en mijn ontwikkeling binnen marketing, AI en digitale uitvoering.

Algemene feedback leerdoel 2

Feedback stagebegeleider Akio: https://mymedia.avans.nl/media/t/0_3xp25xcn

Reflectie

De feedback van Akio laat voor mij zien dat leerdoel 2 goed is gelukt. Aan het begin had ik alleen mijn oude JouwWeb website. Die was prima om wat schoolproducten op te zetten, maar ik was er niet echt trots op. Het liet ook niet goed zien wie ik ben, wat ik kan en welke richting ik op wil. Met mijn nieuwe portfoliowebsite is dat volgens Akio veel beter gelukt. Hij vond de structuur, uitstraling en interactieve onderdelen professioneel overkomen. Dat vind ik zelf ook fijn om terug te horen, omdat ik juist wilde dat de website meer werd dan alleen een plek met verslagen. Het moest echt voelen als mijn eigen portfolio. Ik herken ook wat hij zegt over dat de website meer laat zien dan een LinkedIn profiel. Op LinkedIn kun je natuurlijk wel ervaring en vaardigheden laten zien, maar op mijn website kan ik veel beter laten zien hoe ik werk, welke projecten ik heb gedaan en hoe ik mij ontwikkel. Vooral de combinatie van marketing, AI en digitale uitvoering komt nu duidelijker naar voren. Wat ik meeneem uit deze feedback, is dat de keuzes voor de huisstijl en websiteopbouw goed hebben gewerkt. De website laat niet alleen mijn schoolproducten zien, maar ook mijn stijl en digitale vaardigheden. Dat past goed bij hoe mijn stage zich heeft ontwikkeld, vooral richting AI toepassingen en online uitvoering. Ik ben dus tevreden met de ontwikkeling binnen dit leerdoel. Tegelijk is de website nog niet iets wat helemaal af is. Ik wil hem blijven aanvullen en verbeteren, vooral als ik nieuwe projecten of bewijsstukken heb. De basis staat nu goed en de feedback van Akio bevestigt voor mij dat de website een professioneel bewijsstuk is geworden van mijn ontwikkeling.

Reflectie doel 2

Ik heb weer de vijfvingermethode gebruikt om te reflecteren op leerdoel 2.

Wat was het doel?

Het doel was om mezelf professioneler te presenteren via een eigen portfoliowebsite. Ik wilde geen standaard schoolwebsite meer, maar een portfolio dat beter laat zien wie ik ben, wat ik kan en welke richting ik op wil.

Wat ging er goed?

De huisstijl en website zijn veel sterker geworden dan mijn oude JouwWeb website. Vooral de structuur, uitstraling, interactieve onderdelen en de koppeling met marketing, AI en digitale uitvoering zijn goed gelukt. Wat ging er minder of lastig? Het bouwen met code was soms lastig, omdat ik nog niet precies wist waar alles stond en hoe componenten met elkaar samenwerkten. Ook merkte ik dat AI of Codex niet altijd meteen de juiste oplossing gaf, waardoor ik veel moest testen en bijsturen. Waar wil ik trouw aan blijven? Ik wil trouw blijven aan mijn eigen stijl. De website moet professioneel zijn, maar wel persoonlijk blijven. Ook wil ik AI blijven gebruiken als hulpmiddel, zonder dat het de keuzes volledig van mij overneemt. Waar moet ik nog op groeien? Ik wil nog beter worden in het zelf begrijpen en aanpassen van code. Ook wil ik mijn website blijven aanvullen met nieuwe projecten en bewijsstukken, zodat mijn portfolio meegroeiet met mijn ontwikkeling.

Heb ik mijn doel behaald? Ja, ik heb mijn doel behaald. Aan het begin had ik alleen mijn oude JouwWeb website, waar ik zelf niet echt tevreden over was. De website liet mijn schoolproducten wel zien, maar niet goed wie ik ben, wat ik kan en welke richting ik op wil. Met mijn nieuwe portfoliowebsite heb ik een eigen huisstijl en website ontwikkeld die veel beter bij mij passen. De website laat mijn studie, stagewerk, AI projecten en persoonlijke ontwikkeling duidelijker zien. Ook heb ik geleerd hoe ik Codex AI en ChatGPT kan gebruiken om een website te bouwen, zonder dat ik de controle over stijl, inhoud en keuzes verlies.

Bijlagen

Bijlage leerdoel 2

Huisstijl document

Doel van de huisstijl

Het doel van de huisstijl is om mijn portfolio herkenbaar, professioneel en persoonlijk te maken. De website moet geschikt zijn voor beoordeling door Avans, maar mag niet voelen als een standaard schoolportfolio. De vormgeving moet laten zien dat ik bezig ben met commerciële economie, marketing, onderzoek en AI toepassingen. De kern van de huisstijl is een gestructureerd creatief portfolio. Dat betekent dat de website een duidelijke structuur heeft, maar wel creatief en persoonlijk aanvoelt. De basis blijft professioneel, maar de visuele uitwerking is sterker dan bij een standaard portfolio. De huisstijl past bij hoe ik mij als student Commerciële Economie ontwikkel. Binnen mijn studie werk ik aan marketing, onderzoek, strategie, communicatie en commerciële uitvoering. Tijdens mijn stage bij Drop Mobility heb ik praktijkervaring opgedaan zoals AI toepassingen, contentcreatie, nieuwsbrieven en websiteontwikkeling. De kernwoorden van mijn huisstijl zijn: - Strategisch - Creatief - Data gedreven - Nieuwsgierig - Resultaatgericht Deze woorden passen bij mijn manier van werken. Ik wil eerst begrijpen wat de vraag is, daarna een richting bepalen, iets maken en vervolgens verbeteren op basis van feedback of data.

Kleurgebruik

De huisstijl gebruikt een combinatie van donkere basiskleuren, lichte contrastvlakken en een duidelijke blauwe accentkleur. De belangrijkste kleuren zijn midnight navy, ink navy, charcoal black, off white, soft cream en electric blue. Midnight navy en ink navy vormen de basis van de website. Deze kleuren geven de site een professionele en rustige uitstraling. Ze zorgen ervoor dat de website serieus genoeg blijft voor een studieportfolio en stageportfolio. Tegelijk geven donkere kleuren ruimte aan grote typografie, beeld en contrast. Off white en soft cream worden gebruikt om de website lichter en beter leesbaar te maken. Deze kleuren zorgen ervoor dat de site niet volledig donker of zwaar wordt. Vooral bij langere teksten, bewijsstukken en projecten is dit belangrijk. De lichte vlakken maken de inhoud rustiger en toegankelijker. Electric blue is de belangrijkste accentkleur. Deze kleur gebruik ik om energie, digitale ontwikkeling en focus te laten zien. Blauw past goed bij mijn portfolio, omdat het professioneel en technisch aanvoelt, maar door de felle tint ook creativiteit toevoegt. De kleur wordt gebruikt voor belangrijke woorden, hoofdstuknummers, actieve knoppen, lijnen, labels en kleine details.

Subtle yellow wordt alleen beperkt gebruikt. Deze kleur komt terug als klein accent, bijvoorbeeld in een pijl, schetslijn of detail. Ik heb bewust geen oranje, rood of roze gekozen, omdat die kleuren niet goed passen bij de uitstraling die ik wil neerzetten. Ik wil een stijl die krachtig en modern voelt, zonder te druk of te speels te worden. De kleuren ondersteunen ook de leesbaarheid. Donkere vlakken worden gecombineerd met lichte tekst en lichte vlakken met donkere tekst. Dit is belangrijk, omdat een portfolio niet alleen mooi moet zijn, maar ook goed gelezen moet kunnen worden.

Typografie

De website gebruikt grote, uitgesproken koppen in combinatie met rustige tekst. Hierdoor ontstaat een contrast tussen aandacht trekken en informatie duidelijk uitleggen. Voor grote titels gebruik ik een displaystijl. Deze stijl past bij de creatieve uitstraling van de website. Grote woorden zoals “Mats Luijten”, “impact”, “actieonderzoek” en “Jaar 3 CE” krijgen daardoor meer gewicht. Dit maakt de website visueel sterker en zorgt dat belangrijke onderdelen direct opvallen. Voor langere teksten gebruik ik een rustige en goed leesbare letter. Dit is nodig omdat de website ook veel inhoud bevat. Denk aan reflecties, onderzoeksinformatie, bewijsstukken, projectuitleg en toelichtingen voor school. De typografie moet daarom niet alleen opvallend zijn, maar ook praktisch werken. Ik gebruik ook handgeschreven accenten. Ze zorgen voor een persoonlijker gevoel en maken de website minder afstandelijk. Voorbeelden zijn korte notities zoals “actie → inzicht → verbetering” of “Mijn ontwikkeling in beeld”. Deze accenten worden niet gebruikt voor gewone tekst, maar alleen als visueel detail.

Beeldstijl

De beeldstijl is grafisch, contrastrijk en persoonlijk. Het belangrijkste beeldelement is de geïllustreerde versie van mijzelf op de homepage. Deze illustratie gebruikt geen natuurlijke huidskleur, maar grijs, zwart, off white en electric blue. Daardoor past het beeld goed bij de rest van de huisstijl. Ik heb bewust gekozen voor een illustratie in plaats van een standaard portretfoto. Dit past beter bij de creatieve en digitale uitstraling van de website. Het laat ook zien dat het portfolio geen standaard template is, maar een eigen visuele identiteit heeft. Voor schoolvakken/projecten gebruik ik een combinatie van kaarten, tabellen, screenshots, quotes etc. Deze worden niet allemaal recht en strak geplaatst, maar mogen licht schuin staan of overlappen. Dit maakt de website dynamischer en sluit aan op de creatieve portfolio stijl.

Waarom deze huisstijl bij mij past

Deze huisstijl past bij mij omdat hij structuur en creativiteit combineert. Ik wil professioneel overkomen, maar niet standaard. De website moet laten zien dat ik bezig ben met mijn studie commerciële economie, maar tegelijkertijd ook in de praktijk werk als AI innovation specialist. De donkere basis met electric blue past bij mijn interesse in digitale projecten, AI toepassingen en moderne websites. De off white vlakken zorgen dat de inhoud rustig en leesbaar blijft. De grote typografie en projectkaarten maken het geheel persoonlijker en sterker.