Hvis du kan huske så langt tilbage som til januar, var et af mine mål for 2013 at lære mere om farver og dele noget af det, jeg lærte med dig. Jeg har før talt om, hvordan jeg føler, at mine evner til at arbejde med farver er mangelfulde, og jeg sagde, at jeg på et tidspunkt i år ville få fat i et par bøger om farver i håb om at ændre det.
En fødselsdag, en noget generøs bror og kvalitetsservice fra Amazon senere, og et udvalg af bøger (herunder et par specifikt om farver) er her og venter på at blive læst. Tak David.
Jeg er færdig med at læse en af farvebøgerne, Design Elements: Color Fundamentals, og tænkte, at jeg burde begynde at dele. Jeg vil starte med, hvordan vi beskriver farver, dels fordi det er begyndelsen, dels fordi det førte til en vis klarhed i min forståelse af farver.
Hvordan vi beskriver farver
Der er 3 primære måder at beskrive en farve på, og da bogen har tilføjet det, vil jeg også tilføje en 4. måde at beskrive farver på.
- Farvetone – et andet ord for farve
- Mætning (chroma) – intensiteten eller renheden af en farvetone
- Lysstyrke (værdi) – den relative grad af sort eller hvidt blandet med en given farvetone
- Temperatur – den opfattede varme eller kølighed af en farve
Lad os grave lidt dybere i hver af dem.
Toner er farver, og hvilken nuance vi ser er afhængig af bølgelængden af det lys, der reflekteres eller produceres. Jeg tvivler på, at jeg behøver at fortælle dig, hvad en farve er, og da farve og nuance er synonyme, burde du også vide, hvad en nuance er. En ting, som jeg vil minde dig om, er, at vi alle opfatter farver forskelligt. Den nuance, du ser, er måske ikke den samme nuance, som jeg ser.
Mætning henviser til, hvor ren eller intens en given nuance er. 100 % mætning betyder, at der ikke er nogen tilføjelse af gråtoner til farven. Farven er fuldstændig ren. I den anden yderlighed fremstår en farvetone med 0 % mætning som en mellemgrå farve. Jo mere mættet (tættere på 100 %) en farve er, jo mere levende eller lysere fremstår den. Umættede farver virker på den anden side mere matte.
Hvor mættet en farvetone virker, afhænger også til en vis grad af, hvilke farver den ligger ved siden af. En 50% mættet nuance placeret ved siden af en 25% mættet nuance vil fremstå mere levende, end hvis den samme nuance blev placeret ved siden af en 75% mættet nuance.
Lysstyrke måler den relative grad af sort eller hvid, der er blevet blandet med en given nuance. Tilføjelse af hvid gør farven lysere (skaber nuancer), og tilføjelse af sort gør den mørkere (skaber nuancer). Effekten af lysstyrke eller værdi er relativ i forhold til andre værdier i kompositionen. Du kan få en farve til at virke lysere ved at placere den ved siden af en mørkere farve.
Desto større forskellen i værdi mellem elementer er, desto større er kontrasten mellem dem. På grund af dette er lyshed en god måde at vise kontrast og angive hierarki mellem elementer. Omkring 7 trin af lysstyrke er den maksimale variation, som det menneskelige øje kan skelne. Ud over det bliver det svært at skelne forskellene.
Temperatur er den opfattede varme eller kølighed af en farve. Varme farver er rød, orange og gul, mens kølige farver er grøn, blå og violet. Et sted i det grønne og violette spektrum skifter temperaturen mellem varm og kold.
Hvordan øjet genkender farvetemperaturen kan ændre sig afhængigt af lyskilden. For eksempel kan den faktiske temperatur på en computerskærm påvirke den opfattede farvetemperatur.
Varmere farver har en tendens til at rykke frem i forgrunden af en komposition, mens køligere farver trækker sig tilbage i baggrunden. Ligesom mætning og lysstyrke kan temperatur også være relativ. Placer en varm farve mod en varmere farve, og den oprindelige farve vil virke køligere, end hvis den blev placeret mod en kølig farve.
Farveharmoni
Ved arbejdet med farver er det vores mål at vælge en palet af behagelige farvekombinationer (undtagen de gange, hvor en ubehagelig kombination supplerer budskabet bedre). Vi forsøger at opnå en form for farveharmoni.
Farveharmoni kan være subjektiv. Det, der virker for dit øje, virker måske ikke for mit. Principper i farveteori har til formål at reducere subjektiviteten ved at tilbyde retningslinjer, der hjælper os med at finde parringer og grupperinger af farver med større sandsynlighed for at fungere godt.
Et af hovedprincipperne går f.eks. ud på, at øjet altid søger balance og ligevægt i farver, der fører det til at nå frem til neutrale kombinationer, som når en farvetone kombineres med sin modsætning eller sit komplement. Det er en af grundene til, at vi ofte ser efterbilleder af en anden farve (men med samme mætning og lysstyrke), når vi stirrer for længe på en farve.
Farvelæren fører ikke altid til forudsigelige resultater. Nogle gange passer teori og praksis ikke helt sammen, hvilket betyder, at vi er nødt til at udvikle vores øjne for farver og eksperimentere med forskellige kombinationer af farvetone, mætning og lysstyrke.
Den manglende sammenhæng i farveteori og farvepraksis
Som jeg sagde ovenfor, var der noget, der klikkede for mig, da jeg læste Color Fundamentals. Vi beskriver farver i form af hue, saturation og lysstyrke (HSL), men alligevel indstiller vi typisk farveværdier på nettet ved hjælp af hex-værdier og i mindre grad RGB-værdier. Ville det ikke give mere mening at arbejde med det system, der beskriver farverne bedre?
Bemærk: HSL er ikke det samme som HSB (hue, saturation, brightness) eller HSV (hue, saturation, value), der findes i de fleste farveværktøjer.
Hex og RGB er i virkeligheden to versioner af det samme. Hver af dem giver 256 mulige værdier for, hvor meget rødt, grønt eller blåt der er i en given farve. HSL fungerer på en anden måde. Der er ingen nem måde at kaste et blik på noget som rgb(63, 69, 146) eller dets hex-ækvivalent #3f4592 og nemt vide, at det er 40% mættet eller hsl(236, 40, 41).
Hvis du gerne vil se den matematik, der er involveret i at lave konverteringen, skal du kigge på et eller alle nedenstående links
- Farvealgoritmer
- RGB til HSL-farvekonvertering
- HSL til RGB-farvekonvertering
Hvorfor det? Hvorfor er der en uoverensstemmelse mellem den måde, vi forsøger at forstå farver på, og den måde, vi forsøger at bruge dem på? Hvis noget HSL er det mere intuitive system, da det faktisk beskriver de farver, vi ser, og passer til farveteori.
Jeg er klar over, at farvefærdigheder kommer af at udvikle et kritisk øje for farver og stille spørgsmål om, hvorfor noget fungerer eller ikke fungerer. Og det handler om at besvare disse spørgsmål, mens du observerer farverne omkring dig.
Det virker bare som om, at det ville være nemmere, hvis både teorien og praksis talte samme sprog. Nu, hvor jeg er kommet til denne erkendelse, har jeg besluttet at forpligte mig til at bruge HSL-værdier så meget som muligt i min kode. Den snublende sten er IE8 og lavere, som ikke accepterer hsl() eller rgb(). De har brug for hexadecimale værdier. Det er dog ok, da SASS kan lave konverteringen. Du kan bruge hsl() i SASS og få html-outputtet til at være en hexadecimal værdi.
For at følge med mit engagement er jeg begyndt at bygge et simpelt farveværktøj til at hjælpe mig med at lære og studere. Det er ikke noget, du vil bruge i sin nuværende form til at vælge en farvepalet, men det giver dig mulighed for at lege med værdierne for hue, saturation og lysstyrke for at se, hvordan de hver især påvirker en bestemt farve og farverne omkring den. Jeg vil dele værktøjet senere på ugen.
I et stykke tid har jeg haft mistanke om, at de matematiske relationer mellem farver kunne give en vejledning til at arbejde med dem, og jeg har ofte ledt efter disse relationer i hex-værdierne for farver. Mit håb om at bruge hsl() mere og lege med mit simple farveværktøj er, at de vil hjælpe mig med at forbinde teorien med de farver, jeg bruger i design, lidt bedre, end de er forbundet for mig nu.
Hold denne afbrydelse i, hvordan vi lærer om og beskriver farver, og hvordan vi bruger dem, i tankerne. Den erkendelse har givet mig en større forståelse for, hvordan jeg bedre kan studere farver, og det er derfor, jeg ønskede at starte denne samtale med det grundlæggende i, hvordan vi beskriver farver. Jeg vil snart have flere indlæg om farver, startende senere på ugen, når jeg taler om det enkle værktøj, jeg har skabt til at hjælpe mig.
Download en gratis prøve fra min bog, Design Fundamentals.