Oblig.08 – Interactive Infographics website

The main purpose with this assignment is to produce a website containing interactive info graphics, taking us through some of the style eras from the last 50 years. To achieve coherence, you are to choose a specific object, element or character that is «going on a journey», and changing throughout these style eras. You decide what you want to present. The Copyright Act prohibits the use of material which you have not created and produced yourself. The website must also contain a short introduction on each of the style eras, which are:
– Abstract expressionism
– Swiss
– Pop Art
– Psychedelia

Denne oppgaven handler om skjermbasert design, grafisk design for skjerm, infografikk og informasjons design, brukervennlighet og ulike stilepoker. Jeg skal lage en webside som skal presentere de 4 nevnte stilepokene, og velge en ting som skal forandre seg gjennom disse stilene. Websiden skal inneholde en oppsummering/introduksjon av hver stil/epoke. Oppgavens tidsrom er på 4 uker.

Målgruppen for oppgaven er en profesjonell gruppe av kunder. Dette oppfatter jeg som seriøst, ordentlig og et modent publikum. Det vil bli viktig å skrive profesjonelt og fange målgruppens interesse.

Det vil være viktig at jeg lager designet før jeg starter programmeringen. Videre ønsker oppgaveteksten at jeg skal følge denne planen:
– Uke 1: Planning (overview of assignment, sitemap etc)
– Uke 2: Design (idea, conceptual sketches, wireframing, prototyping etc)
– Uke 3: Development (site structure, coding, interactivity etc)
– Uke 4: Launch (final touch, transfer to server, testing, evaluation, deliver to client, report etc.)

Jeg startet med å lage et tankekart over oppgaven, og fikk skrevet ned mange tanker rundt temaet. Videre laget jeg et tankekart over de ulike stilepokene som jeg skal jobbe med i oppgaven, dette for å lære mer om disse.
Tankekart1Tankekart2
Tilslutt brukte jeg ABC metoden, hvor jeg skrev ned så mange relevante ord som mulig til hver bokstav. Disse idéutviklingsmetodene har vært til stor hjelp i den første prosessen i oppgaven.
ABC metode

– Annette B. D.

Learning Activity – Visualise your Ideas

I would like you to create a moodboard and storyboard using a word and its meaning as the concept. For example, you could use the word «prop». You could then use the «r» to prop up the «p» that keeps falling over. That’s just to give you an idea, be creative and use a word and concept for your own.

Denne oppgaven var veldig morsom, interessant og engasjerende. Jeg valgte ikke bare ett ord, men flere til denne oppgaven, for ekstra trening i å lage moodboard og storyboard. Først startet jeg med å tenke på ord jeg kunne bruke slik som: kræsj, fly, ord, falling, anticrist, bølge, forsvinne, wind, sprekke, synge, brenne, le, hoppe, danse, sove og pang. Til denne oppgaven brukte jeg ordene kræsj, falling, anticrist og hoppe.

Under finner du 4 moodboards hvor jeg har laget et moodboard til hvert ord.moodbord_fallingmoodboard_krasjmoodboard_jumpmoodboard_anti

 

Etter dette jobbet jeg med å lage storyboard til hvert ord. Til denne oppgaven brukte jeg bare 4 frames til hver bokstav, hvor man kan se en forandring i hver rute.img004

 

Four word and their meanings. Storyboard by Annette B. D.

– Annette B. D.

Learning activity – Typography

1. Define the term «typography» in your own words.
2. Write a few sentences explaining what typography is not
3. Find a case study on typeface development on the internet. Explain which medium the font developed is best suited for and why. Keep legibility, size and style in mind.

1. Typografi vil si læren om bokstaver og grafiske elementer, og hvordan bruke disse. Typografi lar deg gjenskape bokstaver for å kombinere dem, og for å lage forskjellige ord. På denne måten får man uttrykke et budskap eller et visuelt utrykk. Typografi er en grafisk utforming med et definert typesnitt.

Typografi kan deles inn i to deler:
Den ene delen handler om konsept, idé, utforming, format, typesnitt, farger, papir og komposisjon. Den andre delen handler om utspillet mellom bokstaver, ord, rader; altså detaljene i selve setningen.

De fleste skrifttypene er bygd opp av en grunnstrek og en hårstrek. Skriftsystemet består av bokstaver, tall og tegn, som tilsammen utgjør ca. 120 symboler. Det finnes to typer bokstaver:
VERSALER = store bokstaver
minuskler = små bokstaver

Typografi oppstod først som et håndverk i boktrykkerkunsten på 1500-tallet, og faget omfatter at man har kunnskap om leselighet, form og innhold, skrifttyper og -størrelser, linjelengde og -avstand, papir, formgivning, farge og ulike trykkteknikker. Idag utføres det meste av typografi ved hjelp av digitale tekstbehandlingsprogrammer.

2. Typografi involverer ikke å lage bokstaver hver for seg for hånd eller med et verktøy. Typografi er ikke et kunstverk, typografi er ikke håndskrift, typografi er ikke graffiti, typografi er ikke skift, typografi er ikke tegnskrift, typografi er ikke å skjære ut bokstaver i stein eller tre for hånd, typografi er ikke å lage bokstaver ut av fyrstikker.

Det som er nevnt over kan fungere som inspirasjon, og kan lede til typografi, men er IKKE typografi. I typografi er det svært viktig å forstå grunn prinsippene, og fokusere på dette. Deretter eksperimentere med ulike teknikker og metoder.

3. Til denne oppgaven har jeg valgt fonten Verdana. Dette er en humanist sans-serif som ble designet av Matthew Carter i 1996. Denne fonten passer svært godt til brødtekst i skjermbruk, siden det ifølge undersøkelser er mer lettleselig med en font som har større bokstav og -ordmellomrom, slik som Verdana. Den brede skiften gjør det lettere å lese, og fungerer mye bedre til skjerm enn på papir. Her er en kilde hvor det står litt om fonten, her.

Jeg fant ikke noen egen case study om Verdana, og føler meg ikke istand til å utføre dette selv. Dermed ble kanskje ikke oppgaven 100% riktig besvart, men jeg har lest pensum og gjort min research.

Kilder

http://www.typografi.org/dokum/doku.html

http://www.typografi.org/index.html

http://www.kunnskapssenteret.com/articles/2317/1/Hva-er-typografi/Hva-er-typografi.html

http://www.kunnskapssenteret.com/articles/2316/1/Typografiens-funksjon/Typografiens-funksjon.html

http://snl.no/typografi

http://designm.ag/inspiration/inspirational-typography/

http://petterandresen.no/typografi/11.html#K

http://inspiredology.com/what-typography-is-not/

http://www.utdanningsforbundet.no/upload/Utdanningsakademiet/Bedre%20Skole/Nr%204-06/Asplund_Om_typografi.pdf

http://www.microsoft.com/typography/fonts/family.aspx?FID=1

http://www.myfonts.com/person/Matthew_Carter/

– Annette B. D.