Embed Size (px)
Citation preview
4 principer för design
4 principerFörbindelse• Inget placeras slumpartat på en sida
Upprepning • Ger tydligare enhet och bättre organisation
Närhet• Organiserar innehåll och ger struktur
Kontrast• Ökad visuell uppmärksamhet
Närhet
Närhet
Närhet
Närhet
Närhet
Närhet”Gruppera det som hör samman”
Syfte: • Organisera, genom gruppering
Undvik:• För många enskilda element på en sida• Lika mycket luft mellan element,
om de inte är en del av gruppen
Förbindelse
Förbindelse
Förbindelse
Förbindelse
Förbindelse
Förbindelse
”Varje element bör ha någon visuell för-bindelse med ett annat element på sidan”
Syfte: • Skapa enhet genom att organisera• Bestämmer ofta karaktären
Undvik:• Mer än en textjustering per sida• Centrering (använd enbart mycket medvetet)
Förbindelse
Upprepning
Upprepning• Fet stil• Normal stil• Fyrkantiga punkter• Indrag• Luft• Justering
Upprepning
Upprepning
UpprepningUpprepning behöver inte betyda att man upprepar exakt samma sak. Här ser vi upprepning av: • Typsnitt – med olika färger• Illustrationerna är olika – men samma ”stuk” (50-tal)• Recepten har samma format – ingredienser normal stil, beskrivning kursiv – men har i sig olika utformning.
Upprepning
Upprepning”Upprepning av objekt i en design stärker helheten genom att hålla samman skilda delar.”
Syfte: • Skapa helhet• Lägga till visuell stimulans
Möjlighet:• Skapa helhet genom att se vad som kan upprepas• Lägga till objekt, enbart för att upprepa?!!
Kontrast
Kontrast
Kontrast
Kontrast
Kontrast
Nog är det konstrast alltid! Fast inte så vackert…
• Några exempel från CSSzengarden.com– Färgstarkt– Horisontell– Orientalisk
Kontrast
Kontrast”Om 2 objekt inte är exakt likadana – gör dem olika. Rejält olika!”
Syfte: • Skapa intresse. Dra ögonen till sig.• Skapa struktur på sidan.
Tänk på:• Var inte feg. Ta i ordentligt.• Gäller teckensnitt, linjer, former, färger, luft…
4 principerFörbindelse• Inget placeras slumpartat på en sida
Upprepning • Ger tydligare enhet och bättre organisation
Närhet• Organiserar innehåll och ger struktur
Kontrast• Ökad visuell uppmärksamhet
