Lektion 2. Det grafiske puslespil

Forberedelse

Formål

  • Få lidt perspektiver på faget
  • Repetere det grafiske puslespil, der bl. a. består af typografier, farver og gestaltlove.

Fælles gennemgang

Fra sidst

  • Hvordan var det at lave en hjemmeside
  • Er I kommet i tanker om ting, I godt kunne tænke jer at lave til jeres hjemmeside

Lektien til denne gang

  • Hvad er computational thinking
  • Hvad er typografier
  • Hvad er serif og sans serif
  • Hvad ved du om farver
  • Hvad er gestaltlove, og hvad kan vi bruge dem til
  • Præsenter dafont.com

Øvelser

Inden du går i gang: Opgave 2.4 kan tage lidt tid, og opgavesættet kan evt. strækkes ud over 2 gange.

2.1 Typografier

  • Hvad er forskellen på serif og sans-serif skrift
  • Hvilken skrifttype egner sig til hvad
  • Hvad er mest brugt på nettet
  • Hvad vil du anbefale til overskrifter hhv. brødtekst
  • Prøv at se, om Word følger de anbefalinger. Se under fanen Hjem > Typografier, og find typografierne for overskrifter
Word udsnit

Gå på nettet og find 2 sider pr gruppemedlem plus siden her

  • Angiv for hver, om de bruger serif eller sans-serif og fortæl, om det stemmer overéns med teorien
  • Tjek hjemmesiderne for de største aviser i Danmark: Berlingske Tidende, Jyllands-Posten, Information og Jyske Tidende. Hvilke skriftyper (serif/sans-serif) bruger de til hhv. logo, til overskrifter og brødtekster

2.2 Hvad er bedste praksis mht typografier?

Læs artiklen her og forklar ud fra artiklen, hvad der er “bedste praksis” på nettet mht. typografier: https://www.smashingmagazine.com/2009/08/typographic-design-survey-best-practices-from-the-best-blogs/

2.3 Farver

Her er nogle billeder. Analyser dem ud fra din viden om farvelære. Brug også din viden omkring, hvad billedet skal bruges til:

Spillet Red dead redemption
Read dead redemption		Spillet PokemonG
Pokemon Go
Alt for Damerne
Alt for Damerne		Reklame for et MMA stævne
MMA stævne
Spillet Sims
Spillet Sims		Find selv et billede, f.eks. af dit ynglingsfodboldhold eller dit farvorit spil, og analyser det. Billedet nedenunder er til inspriation 🙂
KåmSåDeHviiii mod FCK

2.4 Gestaltlove

  • Hvad er gestaltlove
  • Nævn de forsellige gestaltlove
  • Gå på nettet og find 2 eksempler af hver gestaltlov pr. gruppemedlem. Tag et skræmfoto og sæt det ind. Gestaltloven om figur og baggrund behøves du ikke at finde et eksempel på, men det er flot, hvis du kan

2.5 Leg med Dafont

Inde på www.dafont.com kan du finde mange sjove skrifttyper. Skrifttyper kan gøre meget for et grafisk layout. Her er et eksempel med en skrifttype fra Dafont til en indisk restaurant, “Perl of India”.

Pearl of India

Gå ind på dafont.com og tag et skærmfoto af skriftyper, som kan understrege følgende:

  • En mexikansk osv.). Skriv ordet “Viva la Cantina” med den valgte skrifttype
  • En high-tech hjemmeside. Skrive ordet “Tekno” med skrifttypen
  • En skrifttype, der ligner noget fra det vilde westen. Skriv “Cowboy Bar” med skrifttypen
  • En skriftype, du vil bruge som overskrift på en vikingehal. Skriv “Valhalla” med skrifttypen
  • Find selv på en sidste opgave.

2.6 Lav en prototype på en hjemmeside

Opgaven går ud på, at du i PowerPoint skal designe et forslag til en hjemmeside:

  • Du skal ikke gøre så meget ud af teksten, du må endda sætte “lorem ibsum” eller “bacon ibsum” ind om nødvendigt
  • Du skal gøre noget ud af layoutet og vise, at du forstår det grafiske puslespil
  • Du skal have en skabelon med minimum 3 menupunkter, som skal være klikbare
  • Brug skrifttyper fra Dafont til logoet

Her er de emner, som du kan vælge imellem. Du skal kunne argumentere for dit design.

  • Vietnamesisk restaurant: “Restaurant Mekong”
  • Thai restaurant: “Restaurant Den Hvide Elefant”
  • En legetøjsbutik for piger fra 0 – 8 år: “Bedste veninder”
  • En overskrift til et nyt western spil, “Kill Bill”. Det foregår i det vilde west

Se gerne videoerne her som inspiration til dit arbejde. Du kan finde dem samlet på siden her: Videoer 3. Prototyper i PowerPoint

2.7 Ekstra: Redesign

Tag et design, f.eks. forsiden til et spil, en populær hjemmeside eller din ynglings YouTuper/blogger, hvad ved jeg.

  • Tag et skærmbillede af vedkommendes forside
  • Lav et redesign, og argumenter for dit design