Visual inventory. Vormgeving 2. eindopdracht. Elisa Koeckhoven Klas: V1-02 Docent: Koop Reynders 29 januari 2016

Transcriptie

1 Visual inventory Vormgeving 2 Elisa Koeckhoven Klas: V1-02 Docent: Koop Reynders 29 januari 2016 eindopdracht 1

2 Inhoudsopgave 1. Moe / Afwezig Verhaal en concept 3 Inspiratiebord fotografische beelden 4 Inspiratiebord visuals met de focus op kleur en vorm 5 Inspiratiebord typografische sfeer 6 Onderzoek typografische sfeer 7 Een typografisch beeld 8 Typografie en ratio bij sfeerwoord 9 Kleurenpalet bij sfeerwoord 10 Breakpoint graph 11 Responsive design Regenboog / Humeurig Verhaal en concept 13 Inspiratiebord fotografische beelden 14 Inspiratiebord visuals met de focus op kleur en vorm 15 Inspiratiebord typografische sfeer 16 Onderzoek typografische sfeer 17 Een typografisch beeld 18 Typografie en ratio bij sfeerwoord 19 Kleurenpalet bij sfeerwoord 20 Breakpoint graph 21 Responsive design Ollebolleke / Vrolijk Verhaal en concept 23 Inspiratiebord fotografische beelden 24 Inspiratiebord visuals met de focus op kleur en vorm 25 Inspiratiebord typografische sfeer 26 Onderzoek typografische sfeer 27 Een typografisch beeld 28 Typografie en ratio bij sfeerwoord 29 Kleurenpalet bij sfeerwoord 30 Breakpoint graph 31 Responsive design 32 2

3 1. Moe / Verhaal en concept Stijloefeningen (38) - Moe Posted on 25 maart 2011 by Molovich De buschauffeur port me wakker. We zijn bij de eindhalte, Centraal Station. Ik stap uit en duw de kinderwagen voort waarin mijn zoon ligt te slapen. Ik wou dat ik hem was. De mensen lopen in zichzelf gekeerd over het plein. De regen doet z n best mij wakker te houden, maar mijn oogleden voelen zwaar, alsof er een stel verveelde kaboutertjes aan lopen te trekken. Ik zou hier en nu op de grond kunnen liggen en gaan slapen. Maar ik loop door. Met loodzware benen. Richting de Openbare Bibliotheek. Om Stijloefeningen van Raymond Queneau te lenen. Ik zoek er al weken naar. Waarom eigenlijk? Ik had nu ook in bed kunnen liggen. Sfeerwoord Afwezig Concept De hoofdpersoon is erg moe en slaperig waardoor hij er niet helemaal bij is. Hij denkt bijvoorbeeld dat hij droomt. Er komt niets bij hem binnen. Ik weet niet hoe lang ik al voor de bibliotheek sta als een vrouw mij aanspreekt. Ze heeft zwart krullend haar. Zou ik dromen? Ze vraagt iets aan me. Ik ben te moe om te horen wat. Ze praat in het Engels met een Frans accent. Je naisse quoi, zeg ik. De vrouw kijkt me niet begrijpend aan en vraagt of dit het postkantoor is. Ik moet heel lang en heel diep nadenken. Halverwege vergeet ik de vraag. Ik kijk naar het gebouw. De vrouw kijkt over haar schouder. Beneden rijdt een auto weg. Ik weet de vraag weer. Het zou kunnen dat dit het postkantoor is. Het zou kunnen. Het zou ook niet kunnen. Ik weet niet zeker of ik dit denk of dat ik dit zeg. En ineens weet ik weer dat dit het postkantoor niet is, maar de bibliotheek. Het postkantoor was hier wel ooit. Nu kun je het beste naar de Raadhuisstraat gaan. Als ik mijn ogen opsla is de vrouw met het ravenzwarte haar verdwenen. Ze rent achter een achteruit rijdende auto aan. Binnen sta ik voor de Q. Ik lees de titels op de ruggen van de boeken, maar ze komen niet binnen. Mijn hersens weigeren dienst. Ze zijn te moe om te werken. Mijn ogen worden zwaarder en zwaarder. En dan ineens schrik ik op alsof iemand mij een schok geeft. Stijloefeningen, dat was ik aan het zoeken. Ik loop de boeken met een Q langs. Maar niks. Ik ga achter de computer zitten en tik Stijloefeningen in. Ik dommel even in. Mijn oogleden blijven maar zwaarder en zwaarder worden. Ze vragen beleefd doch dwingend of ik even mijn hoofd te ruste wil brengen. Eventjes maar. Het hoeft niet lang. Mijn hoofd ligt op het toetsenbord. Kwijl sijpelt uit mijn rechtermondhoek. Plots schrik ik wakker. Op het scherm lees ik dat Stijloefeningen wel degelijk aanwezig is. Op de daartoe bestemde plank. Ik besluit een medewerker te vragen mee te zoeken. Want ik durf niet voor mezelf in te staan. De medewerker kan het boek ook niet vinden. (...) 3

4 1. Moe / Inspiratiebord fotografi sche beelden Ik heb verschillende zoekwoorden opgeschreven en ben op zoek gegaan naar foto s die ik goed bij het sfeerwoord vond passen. Sfeerwoord Afwezig Ik gekozen voor foto s van mensen die afwezigheid uitstraalden. Bijvoorbeeld door een afwezige blik of houding. 4

5 1. Moe / Inspiratiebord Visuals met de focus op kleur en vorm Ik heb gezocht naar vormen en kleuren die ik bij het sfeerwoord vond passen. Sfeerwoord Afwezig Qua kleur heb ik een beetje gekozen voor zwart/wit, sepia en donkerblauw. Blauw staat voor afstandelijkheid en eenzaamheid, dit vond ik ook bij afwezig passen. Voor de vormen heb ik gekozen voor deels of helemaal vervaagde foto s omdat het personage uit het verhaal steeds wisselt tussen helderheid en afwezigheid. 5

6 1. Moe / Inspiratiebord Typografi sche sfeer Ik heb gezocht naar typografi sche beelden passend bij de afbeeldingen van vorm en kleur. Afwezig Ik heb typografi sche beelden gezocht in de kleuren en vormen van het inspiratiebord van kleur en vorm. 6

7 1. Moe / Onderzoek typografi sche sfeer Afwezig Afwezig Afwezig Een directe visuele vertaling Visual met de focus op kleur en vorm Typografi sche sfeer 7

8 1. Moe / Een typografi sch beeld Ik heb verschillende typografische beelden gemaakt gebaseerd op de typografi sche beelden, daar heb ik de bovenste 3 uitgezocht als beste. Daarna heb ik variaties gemaakt op deze beelden en daarvan vond ik de onderste 3 het beste. Ik heb de kleur sepia en blauw veel gebruikt omdat dit terugkwam in mijn sfeerbeelden. Ook staat blauw voor afwezigheid. 8

9 1. Moe / Typografie & ratio bij sfeerwoord Display De buschauffeur port me wakker. We zijn bij de eindhalte, Centraal Station. Ik stap uit en duw de kinderwagen voort waarin mijn zoon ligt te slapen. Ik wou dat ik hem was. De mensen lopen in zichzelf gekeerd over het plein. De regen doet z n best mij wakker te houden, maar mijn oogleden voelen zwaar, alsof er een stel verveelde kaboutertjes aan lopen te trekken. Ik zou hier en nu op de grond kunnen liggen en gaan slapen. Maar ik loop door. Met loodzware benen. Richting de Openbare Bibliotheek. Om Stijloefeningen van Raymond Queneau te lenen. Ik zoek er al weken naar. Waarom eigenlijk? Ik had nu ook in bed kunnen liggen. Verantwoording Dispay font: All used up Pairing font: Avenir regular en medium Als display font heb ik gekozen voor All used up. Dit font past bij de vervaagde afwezige sfeer die ik wil maken. Als pairing font heb ik gekozen voor Avenir regular en medium, dit vond ik goed passen bij mijn display font, ook is Avenir van zichzelf een dun lettertype, dit vond ik bij afwezigheid passen. Ook heb ik gekozen voor een hogere regelafstand. En ik kan wisselen tussen regular en medium. Omdat de titel van het verhaal weinig letters heeft heb ik gekozen voor een extra groot formaat letters voor het display font. Ik weet niet hoe lang ik al voor de bibliotheek sta als een vrouw mij aanspreekt. Ze heeft zwart krullend haar. Zou ik dromen? Ze vraagt iets aan me. Ik ben te moe om te horen wat. Ze praat in het Engels met een Frans accent. Je naisse quoi, zeg ik. De vrouw kijkt me niet begrijpend aan en vraagt of dit het postkantoor is. Ik moet heel lang en heel diep nadenken. Halverwege vergeet ik de vraag. Ik kijk naar het gebouw. De vrouw kijkt over haar schouder. Beneden rijdt een auto weg. Ik weet de vraag weer. Het zou kunnen dat dit het postkantoor is. Het zou kunnen. Het zou ook niet kunnen. Ik weet niet zeker of ik dit denk of dat ik dit zeg. En ineens weet ik weer dat dit het postkantoor niet is, maar de bibliotheek. Het postkantoor was hier wel ooit. Nu kun je het beste naar de Raadhuisstraat gaan. Als ik mijn ogen opsla is de vrouw met het ravenzwarte haar verdwenen. Ze rent achter een achteruit rijdende auto aan. 9

10 1. Moe / Kleurenpalet bij sfeerwoord Ik heb kleuren uitgezocht die ik bij mijn sfeerwoord vond passen. Verantwoording Ik heb gekozen voor veel blauwtinten, blauw kan staan voor afwezigheid. Verder heb ik gekozen voor de sepiatinten uit mijn sfeerbeelden Display kleur 2. Body kleur 3. Achtergrond, of andersom 4. Accent kleur 5. Accent kleur 10

11 1. Moe / Breakpoint graph Mobiel Tablet Desktop Display font Display font Display font Tekst Tekst Tekst 20 em 40 em 40 em < 40em > 40em < 80em > 80em 11

12 1. Moe / Responsive design Mobiel 12 Tablet Desktop

13 2. Regenboog / Verhaal en concept Stijloefeningen (11) - Regenboog Posted on 15 februari 2011 by Molovich Bus 21. Ik stap uit. Het is een gure dag, geen ultraviolette zonnestralen die het tere huidje van mijn zoontje aantasten. Hij ligt te slapen in z n paarse kinderwagen. De reizigers lopen van en naar CS. Ik ga naar de Openbare Bibliotheek om Stijloefeningen van Raymond Queneau te lenen. Amsterdam is één grote bouwput hier. Ik moet over planken lopen. Een groep Japanners passeert me. Ze dragen allemaal zo n driehoekige, blauwe doos met daarin een poster van Van Gogh. Voor ik de bibliotheek in ga, wordt ik aangesproken door een vrouw met zwarte krullen. Of dit het postkantoor is. Nee, zeg ik, daarvoor moet u naar de Raadhuisstraat. Ze draait zich om en rent achter een groene Renault 21 aan. Boven zoek ik tevergeefs naar Stijloefeningen. Het boek ligt niet waar het hoort te liggen. Ik kijk op de computer. Daar staat dat het boek wel degelijk aanwezig moet zijn. Ik vraag het aan een medewerker, wiens ongezonde voorkomen doet vermoeden dat hij een lichte vorm van geelzucht onder de leden heeft. De medewerker kijkt met mij mee, maar moet tot zijn spijt constateren dat het boek inderdaad niet aanwezig is. Hij zegt dat ik een mailtje naar het magazijn moet sturen. Die hebben nog een exemplaar. Hij veegt wat zweet van zijn voorhoofd af met een oranje zakdoek. Ik mail. Tien minuten later krijg ik het mailtje terug. Het boek moet op de tweede verdieping aanwezig zijn. Rood aangelopen verlaat ik de bibliotheek. Op het Bos en Lommerplein, vlakbij mijn woning, koop ik schoenen voor mijn zoontje. Infrarode stralen scannen de streepjescode: 10 % korting. Het kan mij maar in beperkte mate opbeuren. Sfeerwoord Humeurig Concept De hoofdpersoon heeft over meerdere dingen wat te zeuren, het is een gure dag, Amsterdam is een bouwval en het boek dat hij zoekt is niet te vinden. Hij vind dan wel schoenen voor zijn zoontje met korting maar hij blijft er humeurig onder. 13

14 2. Regenboog / Inspiratiebord fotografische beelden Ik heb verschillende zoekwoorden opgeschreven en ben op zoek gegaan naar foto s die ik goed bij het sfeerwoord vond passen. 14 Sfeerwoord Humeurig Ik heb het slechte humeur gerelateerd aan een slecht weer zoals regen, bijvoorbeeld een regenwolk boven het hoofd, dit geeft visueel vaak weer dat iemand een slecht humeur heeft. De afbeelding die ik uiteindelijk gekozen heb is de afbeelding van het figuur met een regenwolk boven zijn hoofd.

15 2. Regenboog / Inspiratiebord Visuals met de focus op kleur en vorm Ik heb gezocht naar vormen en kleuren die ik bij het sfeerwoord vond passen. Humeurig Ik heb een beetje donkere en grijze kleuren aangehouden en een beetje de vorm van regen en slecht weer, passend bij mijn gekozen visuele beeld. Ik heb uiteindelijk gekozen voor het beeld rechtsonder met de wolken en de regen. 15

16 2. Regenboog / Inspiratiebord Typografische sfeer Ik heb gezocht naar typografische beelden passend bij de afbeeldingen van vorm en kleur. Humeurig Ik heb vooral gezocht naar typografische beelden passend bij de vorm en kleuren die ik had gekozen. Ook komen de donkere zwarte en grijze kleuren weer terug. Ik heb uiteindelijk gekozen voor het laatste beeld rechtonder. Ik wil waarschijnlijk deze vorm gebruiken voor mijn eindontwerp. 16

17 2. Regenboog / Onderzoek typografische sfeer Humeurig Humeurig Humeurig Een directe visuele vertaling Visual met de focus op kleur en vorm Typografische sfeer 17

18 2. Regenboog / Een typografi sch beeld Ik heb vooral zwart/wit en grijstinten gebruikt in mijn variaties. Ik vond het laatste ontwerp van de bovenste 3 het beste en daar ben ik uiteindelijk verder mee gegaan voor de onderste variaties. Ik heb ervoor gekozen om de tekst in het eindontwerp te centreren en verticaal te plaatsen voor het regeneffect. Het display font heb ik nog wel veranderd naar een font dat ik beter bij de sfeer vond passen. 18

19 2. Regenboog / Typografie & ratio bij sfeerwoord Display font Bus 21. Ik stap uit. Het is een gure dag, geen ultraviolette zonnestralen die het tere huidje van mijn zoontje aantasten. Hij ligt te slapen in z n paarse kinderwagen. De reizigers lopen van en naar CS. Ik ga naar de Openbare Bibliotheek om Stijloefeningen van Raymond Queneau te lenen. Amsterdam is één grote bouwput hier. Ik moet over planken lopen. Een groep Japanners passeert me. Ze dragen allemaal zo n driehoekige, blauwe doos met daarin een poster van Van Gogh. Voor ik de bibliotheek in ga, wordt ik aangesproken door een vrouw met zwarte krullen. Of dit het postkantoor is. Nee, zeg ik, daarvoor moet u naar de Raadhuisstraat. Ze draait zich om en rent achter een groene Renault 21 aan. Boven zoek ik tevergeefs naar Stijloefeningen. Het boek ligt niet waar het hoort te liggen. Ik kijk op de computer. Daar staat dat het boek wel degelijk aanwezig moet zijn. Ik vraag het aan een medewerker, wiens ongezonde voorkomen doet vermoeden dat hij een lichte vorm van geelzucht onder de leden heeft. De medewerker kijkt met mij mee, maar moet tot zijn spijt constateren dat het boek inderdaad niet aanwezig is. Hij zegt dat ik een mailtje naar het magazijn moet sturen. Die hebben nog een exemplaar. Hij veegt wat zweet van zijn voorhoofd af met een oranje zakdoek. Ik mail. Tien minuten later krijg ik het mailtje terug. Het boek moet op de tweede verdieping aanwezig zijn. Rood aangelopen verlaat ik de bibliotheek. Verantwoording Dispay font: Rain & Neer Pairing font: Georgia Regular Als display font heb ik gekozen voor Rain & Neer, dit lettertype past goed bij mijn sfeer omdat het er niet erg vrolijk uit ziet en een beetje druilerig uit ziet. Ook past het bij mijn typografische sfeerbeelden. Als pairing font heb ik gekozen voor Georgia, dit font vond ik goed staan in combinatie met mijn gekozen display font. De hoofdtekst wil ik gewoon normaal hebben qua letterformaat, 15 pt en het display font een heel stuk groter. Ook wil ik beide fonts centreren. Hoofdtekst: 15 pt Displayfont: 60pt Regelafstand: 21 Op het Bos en Lommerplein, vlakbij mijn woning, koop ik schoenen voor mijn zoontje. Infrarode stralen scannen de streepjescode: 10 % korting. Het kan mij maar in beperkte mate opbeuren. 19

20 2. Regenboog / Kleurenpalet bij sfeerwoord Ik heb kleuren uitgezocht die veel terugkwamen in mijn onderzoek van sfeerbeelden. Verantwoording Uit mijn onderzoek kwamen voornamelijk grijstinten beelden naar voren en dit heb ik ook aangehouden voor het kleurenpalet. De kleur grijs wordt geassocieerd met een slecht humeur Display kleur 2. Body kleur 3. Achtergrond, of andersom 4. Accent kleur 5. Accent kleur 20

21 2. Regenboog / Breakpoint graph Mobiel Tablet Desktop Display font Display font Display font Tekst Tekst Tekst 20 em 40 em 40 em < 40em > 40em < 80em > 80em 21

22 2. Regenboog / Responsive design Mobiel 22 Tablet Desktop

23 3. Ollebolleke / Verhaal en concept Stijloefeningen (49) - Ollebolleke Posted on 11 april 2011 by Molovich Op het stationsplein de Regen daalt zachtjes ik Zoek naar een boekwerk van Raymond Queneau Stijloefeningen is Bibliotheeksgewijs Kwijt dus krijgt zoonlief maar Schoentjes cadeau Sfeerwoord Vrolijk Concept Het verhaal is geschreven als een rijmpje en het klinkt heel vrolijk. Het zou bijvoorbeeld in een kinderboek of poëziealbum kunnen staan. 23

24 3. Ollebolleke / Inspiratiebord fotografische beelden Ik heb verschillende zoekwoorden opgeschreven en ben op zoek gegaan naar foto s die ik goed bij het sfeerwoord vond passen. 24 Sfeerwoord Vrolijk Ik heb gekozen voor afbeeldingen die voor mij gelijk vrolijkheid uitstraalden. De meeste afbeeldingen die ik vond bevatten veel ronde vormen, vrolijke gezichten (smileys), bloemen en ballonnen. En allemaal niet 1 specifieke kleur maar vooral heel veel kleuren door elkaar heen, een beetje regenboog. De afbeelding die ik uiteindelijk heb gekozen is de afbeelding met de blije kinderen en ballonnen.

25 3. Ollebolleke / Inspiratiebord Visuals met de focus op kleur en vorm Ik heb gezocht naar vormen en kleuren die ik bij mijn gekozen visuele sfeerbeeld vond passen. Vrolijk Qua kleuren heb ik een beetje gekozen voor ronde vormen en daar vond ik de vorm van de ballon heel goed bij passen omdat de ballon ook voor vrolijkheid staat. Qua kleur komen de regenboogkleuren weer heel erg terug. 25

26 3. Ollebolleke / Inspiratiebord Typografische sfeer Ik heb gezocht naar typografische beelden passend bij de afbeeldingen van vorm en kleur. Vrolijk Ik heb vooral gezocht naar typografische beelden van bloemen en ballonachtige vormen, omdat dit een vrolijke sfeer heeft. 26

27 3. Ollebolleke / Onderzoek typografische sfeer Vrolijk Vrolijk Vrolijk Een directe visuele vertaling Visual met de focus op kleur en vorm Typografische sfeer 27

28 3. Ollebolleke / Een typografi sch beeld Ik heb gekozen voor ballonnen omdat dit veel in mijn sfeerbeelden voor kwam en gelijk een vrolijke sfeer geeft. Ook was het in elk sfeerbeeld mooi weer, daarom heb ik gekozen voor een blauwe lucht en groen gras bij sommige beelden. 28

29 3. Ollebolleke / Typografie & ratio bij sfeerwoord Display font Op het stationsplein de Regen daalt zachtjes ik Zoek naar een boekwerk van Raymond Queneau Stijloefeningen is Bibliotheeksgewijs Kwijt dus krijgt zoonlief maar Schoentjes cadeau Verantwoording Dispay font: Gretoon Pairing font: Always In My Heart Als display font heb ik gekozen voor Gretoon, dit is een beetje een bollig en ballonnig font dat goed past bij mijn typografische beelden en inspiratiebeelden. Als pairing font heb ik gekozen voor Always In My Heart, deze vormen vond ik goed passen bij het display font. Verder past dit font goed bij een versje omdat het er geschreven uit ziet. Omdat de tekst zo kort is ben ik niet echt van plan om te variëren in dikte. Het display font wil ik ongeveer 2x zo groot als het pairing font, zodat het verhaal goed opvalt. 29

30 3. Ollebolleke / Kleurenpalet bij sfeerwoord Ik heb een van mijn typografische beelden in adobe.color geupload. Hier zijn deze kleuren uitgekomen. Ik heb een aantal kleine aanpassingen gedaan en de volgorde veranderd. Verantwoording Ik heb gekozen voor veel verschillende kleuren. De plaatjes op mijn inspiratiebord zijn ook allemaal erg kleurrijk. De vele kleuren bij elkaar maakt het vrolijk. Ik wil de kleur geel extra terug laten komen omdat deze kleur voor vrolijkheid staat. Als achtergrond heb ik gekozen voor een blauwe lucht omdat dit ook voor een vrolijkheid kan zorgen en omdat dit ook in een aantal sfeerbeelden terugkwam, hetzelfde geldt voor het groene gras Display kleur 2. Body kleur 3. Accent kleur 4. Accent kleur 5. Accent kleur 30

31 3. Ollebolleke / Breakpoint graph Mobiel Tablet Desktop Display font Display font Display font Op het stationsplein de Regen daalt zachtjes ik Zoek naar een boekwerk van Raymond Queneau Stijloefeningen is Bibliotheeksgewijs Kwijt dus krijgt zoonlief maar Schoentjes cadeau 20 em Op het stationsplein de Regen daalt zachtjes ik Zoek naar een boekwerk van Raymond Queneau Stijloefeningen is Bibliotheeksgewijs Kwijt dus krijgt zoonlief maar Schoentjes cadeau 20 em Op het stationsplein de Regen daalt zachtjes ik Zoek naar een boekwerk van Raymond Queneau Stijloefeningen is Bibliotheeksgewijs Kwijt dus krijgt zoonlief maar Schoentjes cadeau 40 em < 30em > 30em < 80em > 80em 31

32 3. Ollebolleke / Responsive design Mobiel 32 Tablet Desktop