Page History

ti 27.3. klo 12.00-12.30

Aloitus: peruskäsitteitä ja prosessi.

Ota itsellesi valmiiksi kynä ja paperia.

Mieti aikaisempia kokemuksiasi visuaalisesta suunnittelusta ja mieti, millainen työprosessisi on ollut (esim. oletko ensin hakenut vaikutteita, ideoinut vapaasti, haastatellut kavereita / opettajaa, tehnyt versioita käsin / photoshopilla, onko työ lukkiutunut kokonaan jne). Ei haittaa jos kokemusta ei ole paljoa - yksikin kokeilu riittää pohjaksi.

Listaa vaiheet itsellesi ranskalaisilla viivoilla.

Tämän jälkeen pohdi, kauanko olet käyttänyt aikaa työvaiheisiin ja vertaile, mikä vaihe on vienyt eniten aikaa. Mieti myös, mikä vaihe on tuntunut sinusta raskaimmalta? Entä mikä on ollut sinusta helpoin ja mukavin työvaihe?

Piirrä pohdinnoistasi visuaalinen prosessikuvaus siten, että kukin työvaihe kuvataan laatikkona. Laatikon koko kuvaa prosessiin mennyttä aikaa: jos esim. luonnosteluun on mennyt eniten aikaa, piirrä luonnostelua kuvaava laatikko vastaavassa määrin muita isommaksi. 

Tämän jälkeen lue Stephen Hayn artikkeli A Manifesto for Meaningful Design: 48.04.DesignFunnel.pdf

Vertaa omaa ja Stephen Hayn kuvaamaa prosessia. Mitä eroja ja yhtäläisyyksiä havaitsit?

Oma prosessikuvaus sekä em. havainnot esitetään seuraavan tapaamisen aluksi.

ti 3.4. klo 12.20-13.30

Visuaalisen suunnittelun työskentelystä. Sommittelun perusteita: harmoniatasapaino, rytmi, jännite, muodot yhtenäisyys, painopiste, gridit

Luentomateriaalia ja esimerkkejä

1. Materiaaliin tutustuminen

Tutustu ensin seuraaviin artikkeleihin:

Top 7 page composition tips: http://desktoppub.about.com/od/layout/tp/composition.htm
How to create a workable page layout: http://desktoppub.about.com/od/layout/ht/workable.htm

2. Luonnostelu
Ota kynä ja paperi ja luonnostele kolme gridiä kolmelle eri paperille (a4):

2-palstainen
3-palstainen
4-palstainen

Mieti, millainen

tunnelma grideissä on: millaisiin sisältöihin käyttäisit niitä? Millaisia elementtejä liittäisit kuhunkin pohjaan? (kuvitusta, valokuvaa tms.)

3. Leiskaaminen
Valitse sen jälkeen yksi gridi, joka kiinnostaa sinua eniten

Mene tietokoneen ääreen ja tee valmis gridipohja photoshopissa, illustratorissa tai photoshopissa (voit käyttää esim. Rulers-työkalua)

Suunnittele yhden gridin pohjalta kolme leiskaa:

1 symmetrinen
1 epäsymmetrinen
1. kiteinen tai säteittäinen

Materiaaleihin

Ekat versiot, DL 10.4.:
Maiju
Tomi
Noora
Tuuli

ti 17.4. klo 12.20-13.30

Värien käytöstä. Leiskojen kommentointi.

Typografian perusteita. Leiskojen kommentointi.

Materiaali

Merja Kärkkäinen: Typografian muotoilu ja luettavuus

Lisäksi kannattaa tutustua näihin:

Markus Itkonen: Typografian käsikirja

Antti Wiio: käyttöliittymäviestintä ja typografia

Typografia verkossa eli miten fontit saadaan tyylillä verkkoon

14 Best Online Typography Tools for Web Designers

Työkaluja
Testaa kolmea fonttia rinnakkain:
[http://www.typetester.org/
]

Sommittele neljä tekstilogoa. Käytä tehokeinona kontrastia: koko, muoto, vahvuus, väri (vrt. Kärkkäisen materiaali)

Vaateliike VintageClothing
- laadukkaita käytettyjä vaatteita

KoneHuolto
- tietokoneen huoltoa ja korjausta 24h

Sinikka Niskasen tilinpitotoimisto
Metropolia Ammattikorkekoulu

ti 24.4. klo 12.20-13.30

Typografian perusteita Värit. Leiskojen kommentointi ja korjausehdotukset

Materiaali

Colour in Web Design
Applying Color Theory on Digital Displays
Natural Selections: Colors found in nature and interface design

Työkaluja

Tee kuvasta väripaletti:
ColorHunter

Jatka aikaisemmin tekemiäsi kolmea leiskaa:

- valitse leiskoihin sopiva typografia (tee myös otsikko valitsemastasi tekstistä)
- mieti tyhjän tilan käyttöä: sivun ei tarvitse olla niin täynnä
- mieti värimaailma: otsikot, tekstit, tarvitaanko värielementtejä?
- voit käyttää myös muita kuin annettuja kuvia

+ Erikoistehtävä:
- yhdessä leiskassa kokeile tehdä valitsemastasi valokuvasta väripaletti (ColorHunter) ja sovella sitä pohjaan.

ti 8.5. klo 12.20-13.30

Loppukritiikki ja näyttelyn rakentaminen

Nooran palautukset
Tuulin palautukset
Maijun palautus