Digitaal Portfolio
Je gaat onderzoeken wat jouw eigen stijl is en vanuit daar maak je een ontwerp & prototype voor je portfolio website.
LESSEN
Periode 1
Les 1
My Style Moodboard
Zoek online naar alles wat je mooi vindt. Alles waar je oog op valt. De kunst is om niet na te denken maar je gevoel (en ogen) te volgen.
Logos, typography, fotografie, illustratie, patronen, kleuren, layouts van magazines en websites etc.
Maak hier – in Indesign – één groot A3 moodboard van met jouw stijl.
Les 2
Focus Moodboard
Je kiest binnen 3 seconden – dus op gevoel – één beeld uit je moodboard die de basis gaat vormen voor je focus moodboard.
Zet dat beeld redelijk groot middenin een nieuwe pagina in hetzelfde Indesign document.
Daarna kies je uit je originele moodboard nog eens 4 a 5 beelden uit die daarbij passen en een mooi geheel vormen. Je legt ze over je basisbeeld heen. Het moet overlappen. Past het? Werkt het samen? Prima! Als niet..weg ermee!
Gebruik allemaal verschillende soorten beelden – fonts, illustraties, website layouts, patronen etc.
Les 3
Jouw logo maken
Kies uit je focus moodboard een font en probeer met die stijl je logo te maken.
Je mag hiervoor ook een patroon of een stijl uit je focus moodboard gebruiken als inspiratie.
Begin met je naam als woordlogo. Wil je meer, dan kan je ook experimenteren met een monogram, icoon of beeld.
Les 4
Maak een style tile
Je maakt een style guide of style tile voor je portfolio website.
Daarin moet staan: kleuren, fonts, beeld, grafische elementen, buttons etc.
Dit gaat je enorm helpen als je eenmaal aan de layout en look & feel van je website begint!
Les 5
Site map | Wireframe
Maak als eerste een site map / flow chart / wireframe voor je portfolio website.
Dit doet je op papier – dat werkt lekker snel.
Zorg dat je weet hoe je website in elkaar zit voordat je gaat ontwerpen!
Dit zorgt ervoor dat bezoekers snel en makkelijk door je site en ook naar je werk kunnen navigeren.
Contact met je opnemen moet ook simpel zijn. Denk na waar op welke plekken je dat zou kunnen zetten.
Pas als je site map en wireframe ontwerp klopt en logisch is, ga je naar Figma om het als prototype te ontwerpen.
Les 6
Prototype | Web Pages
Begin pagina’s aan je website toe te voegen. Baseer je protoype op je wireframe ontwerpen!
(work | about | contact)
Het mag in het Engels of Nederlands. Liever geen ‘home’ want daar zijn ze al geweest.
Zorg wel dat ze via je logo naar je homepage kunnen.
Les 7
Prototype | project page
Ontwerp een project pagina voor je website.
- Eerst de algemene, met een overzicht van alle projecten (zie beeld en gif’s rechts)
- Dan een individuele project pagina waarin je focust op alleen dat project (zie hieronder)
Gebruik daarbij duidelijke headers per onderdeel: opdracht | concept | ontwerpen
Hou je teksten kort en bondig. Neem ons mee in je concept- en ontwerpproces. Voeg desnoods wat schetsen uit je schetsboek erbij.
Laat duidelijk zien hoe je concept in je ontwerpen tot uiting komen!
Les 8
Prototype | eindproduct
Je hebt een clickable prototype van je portfolio website waarin alle basiselementen zitten.
Les 9 t/m 11
MINOR | Digitaal portfolio
Werk aan je digitale portfolio. Zorg vooral dat je stijl consistent terugkomt in alle pagina’s van de website.
Je project pagina moet er goed uitzien, een goede flow hebben, een verhaal vertellen en vooral duidelijk zijn hoe je bij je concept bent gekomen en hoe we die terugzien in je ontwerpen.
