Tools 4 Thinking
Geschreven door: Marjolein Joosse Klas: 1 C Docenten: Corné van Delft Les: Tools 4 Thinking Datum: 19 januari 2016
Inhoud Needs and Requirements.............................................................................................................................. 3 Persona’s ....................................................................................................................................................... 4 Sitemap ......................................................................................................................................................... 6 Wireframes ................................................................................................................................................... 7
Needs and Requirements Mijn portfolio heeft bepaalde doelen, deze zijn: mensen informeren over mij; mijn werk laten zien aan de buitenwereld; mijn huiswerk online zetten zodat het beoordeeld kan worden en mensen in contact laten komen met mij via deze weg. Om deze doelen te bereiken is het belangrijk dat ik in kaart breng wat nodig is voor mijn portfolio om succesvol te zijn. Doelgroep Het meeste wat ik op deze website zal plaatsen is mijn huiswerk. Daarom zal één van mijn grootste doelgroepen docenten zijn. Daarnaast wil ik gewoon mijn werk kunnen laten zien aan alle mensen. Mijn grootste doelgroep hierin zijn eventuele opdrachtgevers in de grafische/web/design wereld. Daarnaast kan ik op deze manier ook aan kennissen laten zien wat ik allemaal doe en dat is ook best handig. Eisen voor het portfolio -
Homepagina met foto en studierichting Lijst van favoriete games Een interview met een medestudent Een logboek Eigen werk Toelatingsopdracht HKU CV Beschrijving over wat Game Design inhoud
Persona’s "Waar heb ik mijn pen gelaten?" Naam: Annalies Krootjes Leeftijd: 17 jaar Geboortedatum: Afgeronde studie: HAVO Huidige studie: Interaction Design Huidige woonsituatie: Op een kamer met kamergenoten Gekozen voor deze studie omdat: Ze hoopt meer te leren over waarom mensen op een bepaalde manier handelen, hoe ze dit later toe wilt passen op haar leven weet ze nog niet. Hobby's: Tekenen, schilderen, (droomerige) games spelen. In het weekend zit ze soms buiten op haar dakterras keyboard te spelen. Een normale dag in het leven van Annalies: In de ochtend staat Annalies om 7 uur op. Make up doet ze vaak niet op waardoor haar ochtend in de badkamer niet zo lang is. Wel doet ze meestal lang over het kiezen van haar kleding. Dit komt omdat ze helemaal geïnspireerd is door de kleding van de jaren 40/50. Al wilt ze er ook modern bijlopen. Dit beïnvloed de keuze die ze hierin maakt. Daarna nadat ze uitgebreid ontbeten heeft vertrekt ze om (meestal) 8 uur naar school met de fiets. De lessen die ze het leukste vind op school zijn Tools for thinking en tekenen en animatie. Daarna gaat ze weer naar huis. Hier probeert ze huiswerk te maken, maar meestal pakt ze al gauw haar tablet erbij om te gaan tekenen.
“Je zit hier niet voor mij, je ouders of al je Youtube volgers je zit hier voor jezelf!” Naam: Daniël Westland Leeftijd: 34 jaar Huidige baan: Docent op HKU en freelance 3d artist Afgeronde studie: Game Art Huidige woonsituatie: Samen met zijn vrouw en 2 kinderen (2 en 4 jaar) in een gezinswoning Gekozen voor dit leven omdat: Daniël vind niks mooier dan mensen kennis bij te brengen over Game/interactie gerichte zaken. Dit komt omdat hij in het verleden zelf graag aan een groot game project wilde meewerken. Maar dit vanwege financiële redenen nooit van de grond gekomen is. Zo hoopt hij
op HKU te leren hoe jongeren deze dingen aanpakken. Zodat hij hiervan zelf kan leren. Of het game project nog wilt realiseren is ondertussen alweer een andere vraag. Hobby’s: Tekenen en 3D modeleren. Daarnaast houd hij ervan om met z’n kids leuke dingen te doen zoals een dag naar de dierentuin. Een normale dag van Daniël: Daniël staat op en begint z’n dag met een grote bak koffie. Daarna kijkt hij op z’n laptop naar het nieuws en wat voor weer het gaat worden. Ook kijkt hij heel even op zijn social media accounts… Gewoon om te kijken of er niks nieuws is. Daarna brengt hij zijn kindje van 4 naar school. En gaat hij zelf verder naar zijn werk. Hier geeft hij meestal in de ochtend een hoorcollege en in de middag wel eens een practicum. Al geeft hij liever hoorcolleges. In de tussentijd kijkt hij zijn HKU mail. Die bijna elke dag weer aangevuld is en kijkt hij werk van leerlingen na. Als de dag op school voorbij is gaat hij weer naar huis om te relaxen met z’n vrouwtje en kindjes. Al lukt dit niet elke dag. Soms als het druk is moet hij s’avonds nog doorwerken aan zijn werk wat hij niet afgekregen heeft op school.
Sitemap Homepagina index.php Over mij overmij.php Portfolio portfolio.php HKU hku.php CV cv.php Contact contact.php
Menustructuur Het idee is dat je vanaf elke pagina op de andere pagina kan komen in het menu. De pagina’s die onder een menu item vallen kunnen alleen of terug naar die pagina of openen in een nieuwe pagina.
Wireframes Algemeen: Bij een aantal onderdelen en functies zal er een algemene werking zijn voor de onderdelen. Deze staan hieronder beschreven. Typografie: Het lettertype is een open webfont van Google genaamd “Ubuntu”. Dit lettertype wordt overal gebruikt, met uitzondering van de projecten die apart staan van mijn huisstijl. Alignment: Tekst wordt in principe altijd links uitgelijnd. Op uitzondering van de kopjes op de HKU en Portfolio pagina en de pay-off op de homepagina. URL’s (linkjes) Alle linkjes worden duidelijk gemaakt doordat het in een andere kleur is en er een lijntje onder zit. Kleur: De hoofdkleuren die gebruikt worden zijn: Zwart (hex: #000000, blauw (hex: #5ECAC2), grijs (hex: #ABA094). De hoofdkleur van het font zal een grijze kleur zijn namelijk #6A6C6E. Home 1. Menu Het menu is op elke pagina zichtbaar. Wanneer je naar onderen scrolt zal hij mee scrollen en zich verspreiden over de hele breedte. Als je over een menu item hovert dan wordt het font dikker. 2. Intro Image Een plaatje met de pay-off tekst in het midden. 3. Logboek Hier komen de laatste 3 updates van het logboek. Klik je er op 1 kan je altijd het archief in. Je ziet bij elk item maar een regel ongeveer van het artikel. Dus je moet altijd verder klikken om meer te lezen. 4. Footer De footer met copyright erin.
Aanpassingen Home: Doordat het logboek hier staat en naast elkaar is het weinig scrollwerk en scheelt het ook ruimte in het menu. De pay-off laat in één oogopslag zien wat de website inhoud. Moeilijkheden Home: Hem responsive zo goed krijgen dat de tekst mooi mee schaalt en het plaatje ook. HKU en Portfolio Deze pagina’s gebruiken dezelfde vormgeving en werking het verschil is dat op de HKU pagina huiswerk staat en op Portfolio mijn werk.
Portfolio
5. Titel Op elke pagina staat een titel van de pagina zodat je weet waar je bent (dit is niet zo op de home pagina omdat hij zwaar verschilt qua stijl) 6. vak overzicht Hier staan alle vakken waarvoor ik opdrachten heb moeten inleveren. Klik erop en je ziet alleen de opdrachten van dat ene vak. Als je over een vakje hovert veranderd hij van kleur. 7 portfolio item De items staan met z’n drieën naast elkaar als plaatjes. Boven het item staat de titel. Onder het item staat een link naar meer informatie en een link naar het document.
Aapassingen HKU en Portfolio: Ik denk dat ik er nog liever 4 naast elkaar heb. Maar dat moet ik even op schaal zien. Moeilijkheden HKU en Portfolio: De plaatjes zo schalen dat ze goed in het rondje komen te staan.
Over Mij 8. 3 foto’s van mij Hier staan 3 foto’s van mij in een ander perspectief. Over mij
9. tekst over mij Hier staat tekst dat over mij gaat. Voor de geïnteresseerden.
Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recen telijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
Aanpassingen: Ik heb aan deze pagina eigenlijk niet zoveel aangepast omdat het eigenlijk goed uit de usability test kwam. Ik heb alleen de tekst ingekort omdat dit iets lang was. Moeilijkheden: Geen. CV
CV
10. Mijn CV Mijn CV in plaatjes met daarboven een link naar de pdf versie.
Lorem Ipsum is slechts een proeftekst uit het drukkerij.
Aanpassingen: In mijn eerste versie stond er alleen een link naar de pdf. Waardoor de pagina heel leeg was. Moeilijkheden: Geen.
Contact 11. Contactformulier
Contact Naam Email Bericht
Verzend
Het contactformulier heeft 3 velden die ingevuld moeten worden verplicht. Dit zijn Naam, email en bericht. Elk vakje zal gehighlight worden wanneer het actief is. Wanneer je op verzenden drukt zal er nog een boodschap komen dat het bericht verzonden is. Is er iets niet ingevuld zal er een melding getoond worden hiervan.
Aanpassingen: Geen Moeilijkheid: Het moeilijkste is om de php zo werkend te krijgen dat de mail ook daadwerkelijk verzonden gaat worden.
