Forstå farver i et design
Farver betyder noget. I modsætning til typografi og ikoner, som har en mere subtil effekt, påvirker farver brugerne øjeblikkeligt og følelsesmæssigt.
Farver og følelser
Farver påvirker hjernen og følelser med det samme. Grøn skaber ofte ro, mens rød kan fremkalde stærkere fysiske reaktioner.
Selvom specifikke farvers indflydelse varierer afhængigt af kontekst og kulturel baggrund, er der tilstrækkelig anekdotisk evidens for, at farver kan påvirke mennesker. Dette er overbevisende nok til, at reklame- og produktvirksomheder tager farvevalg meget seriøst.
Her er nogle farveegenskaber, der er værd at kende:
- Rød: Energi, passion og fare.
- Orange: Natur og energi.
- Gul: Glæde, positivitet og intelligens.
- Grøn: Fornyelse, ofte brugt i finans-apps.
- Brun: Naturlig og organisk, god kontrast til klare farver.
- Blå: Ro, sikkerhed og professionalisme.
- Violet: Kongelighed og luksus.
Disse egenskaber er kun vejledende. Farvers betydning kan ændre sig afhængigt af kombinationer og konteksten i en app.
FARVETEORI
Isaac Newton opfandt den moderne farveteori og skabte endda det moderne farvehjul. Der er tre primære farver, der bruges, når man designer til elektroniske enheder: rød, grøn og blå. Ved at kombinere disse i et additivt system, kan vi få tre sekundære farver:
- rød + blå = violet
- grøn + blå = cyan
- rød + grøn = gul
Forskel på Violet og Magenta
Violet og magenta er to forskellige farver, men de kan ofte blive forvekslet, da de begge ligger tæt på hinanden i farvespektret og har en rødlig undertone. Her er forskellen:
Violet:
Violet er en farve, der findes naturligt i lys-spektret og er en kombination af blå og rød. Den har en tendens til at være mere blålig i tonen. Violet ses ofte i regnbuen, og det er en af de farver, der ligger tættere på det ultraviolette område af lys-spektret. I RGB-farvesystemet opnås violet ved at kombinere blå og rød lys.
Magenta:
Magenta er ikke en farve, der findes naturligt i lys-spektret. Den opstår som et resultat af, hvordan vores øjne fortolker blandingen af rødt og blåt lys. Magenta er en farve, der findes i subtraktive farvemodeller som CMYK (brugt i tryk), og det er den farve, man ser, når rød og blå lys blandes i lige store mængder uden nogen grøn komponent. Magenta er mere intens og rødlig end violet, og den har en stærkere pink undertone.
Additiv vs. subtraktiv farvemodel
Når man kombinerer alle disse farver i et additivt system (lys), får man hvid. I en subtraktiv farvemodel, som ved brug af maling, giver blanding af alle farverne sort. For sker fordi, at alle farverne i malingen vil absorbere alle farverne fra lyset der rammer dem og man ender derfor med sort. Så når man fx. ser en grøn plante er plantens faktiske farve alle andre farver end grøn, og planten absorberer derfor ikke den grønne farve i lyset som så bliver kastet tilbage til ens øjne.
Farvekontrast og tilgængelighed
Kontrast beskriver, hvor langt fra hinanden to farver ser ud til at være. Farvekontrast er vigtig for en app, der indeholder tekst, fordi høj kontrast gør en app lettere at læse. Det er også vigtigt for det visuelle hierarki, da høj kontrast tydeligere vil adskille de forskellige områder i ens layout.
Indtil nu virker kontrast som et æstetisk problem.
Kontrast bliver dog et tilgængelighedsproblem, når en app bruges af personer med nedsat syn eller personer, der er farveblinde. Farvesynsdefekt rammer 8 procent af mænd og 0,5 procent af kvinder verden over. På grund af dette er farvekontrast ikke noget, man kan ignorere.
Der er to måder at vurdere farvekontrasten i ens app. En måde er at desaturere sine farver, indtil de er effektivt i gråtoner. Hvis teksten stadig er læsbar, og de visuelle grupperinger stadig er klare, så er farvekontrasten effektiv. Alternativt kan man bruge et værktøj til analyse af farvekontrast.
Farve skemaer
Der er en del baggrundsviden, der skal til for at forstå farver og bruge dem effektivt.
Adobe tilbyder et gratis værktøj på https://color.adobe.com, som gør det muligt hurtigt at vælge et farveskema, man kan lide.
Denne app giver mulighed for at vælge blandt andet et af følgende farverelationer:
- Triade
- Komplementær
- Analog
- Split-komplementær
Den giver derefter farveværdierne for dette farveskema nederst som både RGB- og HEX-værdier, som man derefter kan indsætte i sin styleguide. Alt, man behøver at gøre, er at starte med en dominerende temafarve, der vil skabe den rette emotionelle kontekst for appen. Man kan også lege med værktøjet, indtil man finder en hovedfarve, der appellerer til en og afspejler appens formål.
Materiale brugt til ovenstående
Link til bog: https://books.apple.com/gb/book/a-developers-guide-to-ui-design-principles/id1197129930