Design tips

Kontraster

Brug styrkekontrast til at skabe hierakier.

Farvekontrast

Kontraster i design

Kontrast er et af de kraft mest kraftfulde redskaber at arbejde med, når vi skal lave godt design.

For det første kan vi gennem bevidst brug af kontrast skabe et klart hieraki i vores design. Hvilke elementer er meget vigtige og hvilke er mindre vigtige. Kontraster skaber hierarki, og hierarki skaber overblik.

Tydeligt hierakisk design behageligt for brugerne. øjnene kan finde ro, og farer ikke rundt på siden.

For det andet bringer kontraster dynamik og liv til vores design. Vores nysgerrighed og fantasi bliver pirret af kraftige kontraster. Og brugt rigtigt, kan kraftig og overdreven kontrast, få et design til at fremtræder som interessant og spændende.

Har vi et lidt fladt og kedeligt design kan vi forsøge at peppe det op med nogle kraftige kontraster. På den måde kan vi måske undgå at skulle starte forfra og kassere vores design.

Et par eksempler

Et klart hierakiidesign. Magasin

Magasin 7-10-2007

Her er hierarkiet meget tydeligt. Magasin har brugt størrelseskontrast, så det kan forstås. Både på billede og på typografi.

Men mange andre kontraster er også i spil her. Formkontrast ses både mellem fotoet og de firkantede infobokse. Og mellem den bløde logo-type og de kantede sans-serif fonte.

Derudover er der en kraftig styrkekontrast mellem den helt sorte side og de hvide informationsbokse i højre side.

Læg også mærke til den subtile kontrast mellem hudtonerne i modelens ansgit og det ellers sort/hvide udtryk på sitet.

Den megen luft og de subtile kontraster er med til af give designet et ekslusivt og elegant udtryk. Samtidig sørger de kaftige kontraster for at siden ikke bliver kedelig.

Designet er et typisk Magasin design. Deres side ser i dag en anelse anderledes ud, men i store træk er designlinien og de grafiske virkemidler i designet den samme. Og samme virkemidler ses som regel også i Magasins kataloger.

Dynamik. DAD's  hjemmeside

DAD's hjemmeside 5-10-2008

På DAD's hjemmeside bliver et hav af kontraster brugt.

Komplementær kontrast, styrkekontrast, mæthedskontrast og sort/hvid-farve kontrast bruges flittigt. Og varme-kulde kontrast ses også, f.eks. i det runde billede.

Formkontrasterne er også fremtrædende. Stort set alle elementer er forskellige i både form, størrelse og placering.

I forhold til Magasins side giver det meget mere dynamik. Der er mange elementer at udforske. Men hierarkiet er tilgengæld ikke så tydeligt. Mange af elementerne råber i munden på hinanden.

Men stilen er ungdommelig, og yngre netbrugere bliver næppe skræmt væk af det manglende hieraki, da hensigten her et tydelig. Her skal leges og udforskes. Ikke samles hurtig information.

Se flere eksempler på brug af kontrast i design på undersiderne Farvekontrast og Formkontraster.

Oversigt over kontraster

Jeg vil på undersiderne give en kort gennemgang af nogle af de vigtigste kontraster i design.

Og så vil jeg vise flere eksempler på, hvordan man på en række danske websites har brugt kontraster i webdesignet.

Jeg har samlet kontrasterne i to grupper, der kan findes på hver sin underside.

Farvekontraster

Gruppen med Farvekontraster indeholder følgende 5 kontrastformer

  • Komplementær kontrast
  • Varme-kulde kontrast
  • Styrkekontrast
  • Mæthedskontrast
  • Sort/hvid-farve kontrast

Formkontraster

Gruppen med Formkontraster indeholder følgende 3 kontrastformer

  • Størrelseskontrast
  • Formkontrast
  • Placeringskontrast

Webers lov

Jeg har valgt også at placere artiklen om Webers lov i denne sektion om kontrast. Webers lov beskæftiger sig nemlig også med kontrast.

Definition af kontrast

Kontrast betyder modsætning og ordet stammer fra latin ('contra' imod + 'stare' stå).

Begrebet er meget bredt og vi kan snakke om kontraster i f.eks. både indhold, design, målgrupper, budskaber osv.

Og det er ikke kun i design og det visuelle udtryk, vi kan bruge kontrast. Vi kan også skabe dynamik i eksempelvis vores tekster ved at anvende sproglig og betydningsmæssig kontrast.

F.eks. er et ofte brugt tema i både billedkunst, litteratur og filosofi kampen mellem det gode og onde. Denne evige konflikt/kontrast giver både dynamik og spænding.