Podcast na Model HSV: odstín, sytost a jas

Model HSV: Odstín, Sytost a Jas - Kompletní Rozbor pro Studenty

Podcast

Jak fungují barvy: Od RGB k HSV0:00 / 9:40
0:001:00 zbývá
AdélaZnáš to, když upravuješ fotku, třeba v nějakém editoru, a posouváš těmi jezdci? Jedním přidáš barvám na síle, druhým změníš celkový nádech fotky...
PetrJasně, klasika. Chceš, aby ta tráva byla zelenější a nebe modřejší.
Kapitoly

Jak fungují barvy: Od RGB k HSV

Délka: 9 minut

Kapitoly

Z Instagramu do učebnice

Tři pilíře barvy

Barvy v prostoru

Změna pohledu z RGB

Dokončení výpočtu

Proč je to užitečné?

Časté omyly

Interaktivní ladění barev

Shrnutí a rozloučení

Přepis

Adéla: Znáš to, když upravuješ fotku, třeba v nějakém editoru, a posouváš těmi jezdci? Jedním přidáš barvám na síle, druhým změníš celkový nádech fotky...

Petr: Jasně, klasika. Chceš, aby ta tráva byla zelenější a nebe modřejší.

Adéla: Přesně! A možná tě překvapí, že přesně v tu chvíli používáš princip, o kterém si dneska budeme povídat. Není to žádná magie, je to čistá matematika. Posloucháte Studyfi Podcast.

Petr: Přesně tak. Tenhle super intuitivní způsob práce s barvami se jmenuje barevný model HSV. Je navržený tak, aby odpovídal tomu, jak barvy vnímá náš mozek, ne jak je míchá monitor.

Adéla: Dobře, tak co přesně ta zkratka HSV znamená?

Petr: Je to jednoduché. H je Hue, neboli Odstín. S je Saturation, tedy Sytost. A V je Value, čili Jas. Představ si to takhle: odstín je ta základní barva – červená, zelená, modrá.

Adéla: Takže to je to, co vybírám na barevném kolečku, když chci třeba namalovat něco žlutého?

Petr: Přesně! To kolečko má 360 stupňů a každá barva má svůj úhel. Červená je na nule, zelená na 120 stupních, modrá na 240. Je to vlastně taková barevná mapa.

Adéla: Fajn, to dává smysl. A co ta Sytost?

Petr: Sytost udává, jak je ta barva... no, šťavnatá. Vysoká sytost znamená zářivou, čistou barvu. Nízká sytost znamená, že je barva jakoby vybledlá, smíchaná s šedou. Když dáš sytost na nulu, z jakékoliv barvy se stane jen odstín šedi.

Adéla: Takže když je sytost na nule, je ta barva tak trochu v depresi?

Petr: Přesně tak! Všechno je jenom šedé. A poslední je Jas, což je prostě to, jak je barva světlá nebo tmavá. Jas na nule je vždycky černá, ať máš jakýkoliv odstín a sytost.

Adéla: Dobře, chápu jednotlivé části. Ale jak to funguje dohromady? Tyhle tři hodnoty mi dají jednu konkrétní barvu?

Petr: Ano. Představ si to ne jako kruh, ale jako válec nebo kužel. Odstín je úhel, po kterém se pohybuješ po obvodu. Sytost je vzdálenost od středu toho válce – čím dál od středu, tím sytější barva. A Jas je výška – dole je černá, nahoře jsou nejjasnější barvy.

Adéla: Aha, takže každá barva má v tomhle 3D prostoru svoje souřadnice. A proto je pro grafiky snazší říct „chci tuhle modrou, ale o trochu tmavší“, což znamená jen snížit Jas.

Petr: Bingo! U modelu RGB bys musela měnit tři hodnoty – červenou, zelenou i modrou, což není vůbec intuitivní. Tady jenom pohneš jedním jezdcem.

Adéla: A jak se vlastně počítač dostane od toho RGB, které používá monitor, k HSV?

Petr: Je na to matematický převod. Nebudeme zabíhat do vzorců, ale první krok je jednoduchý. Hodnoty RGB, které jsou normálně od 0 do 255, se převedou na čísla mezi 0 a 1. Prostě je vydělíš číslem 255.

Adéla: Rozumím, takže z hodnoty R 255 se stane 1, a z G 128 se stane zhruba 0,5.

Petr: Přesně. Pak algoritmus najde největší a nejmenší z těchto tří hodnot a z toho už začne počítat právě Odstín, Sytost a Jas. Klíčové je, že HSV nám dává jazyk, jak o barvách přemýšlet lidsky.

Adéla: Dobře, takže Cmax je naše nejvyšší hodnota a Cmin ta nejnižší. Máme tedy normalizované R, G, B a z nich Cmax a Cmin. Co dál?

Petr: Přesně tak. Teď přichází na řadu pár jednoduchých výpočtů. Neboj se, je to snazší, než to zní.

Adéla: Tak to jsem zvědavá. Spusť!

Petr: Nejdřív spočítáme rozdíl, kterému říkáme Delta. To je prostě Cmax mínus Cmin. U našeho příkladu s barvou RGB(200, 50, 100) je to 0,784 mínus 0,196. Výsledek je 0,588.

Adéla: Rozumím, delta je prostě rozsah mezi nejjasnější a nejtmavší složkou.

Petr: Přesně. A teď to nejlepší. Jas, neboli Value, je prostě Cmax. V našem případě 0,784. Takže máme jas na 78,4 procentech.

Adéla: Tak to bylo až podezřele jednoduché. Co sytost?

Petr: Sytost, tedy Saturation, je Delta děleno Cmax. Takže 0,588 děleno 0,784, což je asi 0,75. Neboli 75 procent. Jednoduché, že?

Adéla: Zatím ano! Ale tuším, že teď přijde ten chyták. Výpočet odstínu, že?

Petr: Přistihla jsi mě. Výpočet Hue, odstínu, má trochu děsivější vzorečky. Záleží na tom, která složka byla Cmax. Pro nás to bylo červené R, takže použijeme specifický vzorec. Po dosazení a troše kouzlení s matematikou... dostaneme hodnotu přibližně 340 stupňů.

Adéla: Páni. Takže výsledná HSV barva je zhruba 340 stupňů, 75 procent sytosti a 78 procent jasu. To odpovídá nějaké... malinové?

Petr: Přesně tak! Tmavší purpurová nebo malinová. Vidíš, zvládli jsme to.

Adéla: Dobře, ale proč bychom tohle všechno počítali? Vždyť v programech jako Photoshop nebo GIMP jen kliknu na barvu.

Petr: A to je právě ono! Ten program dělá přesně tyto výpočty za tebe. Důvod, proč je HSV tak populární, je jeho intuitivnost. Mnohem snáz si vybereš odstín na barevném kruhu a pak jen posuvníkem doladíš sytost a jas.

Adéla: To je pravda. Snažit se namíchat správnou fialovou pomocí RGB posuvníků je někdy za trest.

Petr: Přesně. V HSV můžeš třeba zvýšit sytost celého obrázku, aby byl živější, a přitom se nezmění odstíny ani světlost. Je to nezávislé. Chceš obrázek zesvětlit? Zvýšíš jen hodnotu V. Je to skvělé pro barevné korekce.

Adéla: A dělají v tom lidi nějaké typické chyby?

Petr: Ale jistě. Nejčastější je záměna HSV a HSL. HSL znamená Hue, Saturation, Lightness. Lightness, světlost, se počítá jinak než naše Value, tedy jas.

Adéla: Aha! A já si vždycky myslela, že je to to samé, jen jinak pojmenované.

Petr: Běžná chyba. V HSL je 50% světlost nejživější barva, zatímco v HSV je to 100% jas. Další věc – u šedých barev, včetně bílé a černé, je sytost nulová. To znamená, že odstín, Hue, je matematicky nedefinovaný. Prostě tam žádný není.

Adéla: Logicky, šedá nemá barevný odstín. Takže to celé dává smysl. HSV je vlastně model přeložený z řeči počítačů do řeči lidí.

Petr: To je skvělé shrnutí! A právě proto je tak užitečný. Ale není to jediný způsob, jak s barvami pracovat. Což nás přivádí k dalšímu zajímavému modelu.

Adéla: Takže to byla teorie, ale pojďme si to ukázat v praxi. Jak si to můžeme nejlépe osahat?

Petr: Nejlepší je interaktivní simulace. Představ si tři posuvníky – jeden pro každý prvek HSV.

Adéla: Super. Takže co dělá ten první, posuvník pro Odstín neboli 'H'?

Petr: Tím vlastně kroužíš po barevném kruhu. Začínáš na červené, jdeš přes zelenou, modrou a zase zpátky k červené.

Adéla: A co se stane, když Sytost, tedy 'S', stáhnu na nulu?

Petr: Dobrá otázka! Pak se neděje vůbec nic. Bez sytosti nemáš barvu, jenom šedou.

Adéla: Aha! Takže posuvník Sytosti vlastně přidává barvě "šťávu"?

Petr: Přesně tak. Od šedé po tu nejzářivější barvu. No a poslední je Jas, 'V'.

Adéla: Ten to asi celé zesvětlí nebo ztmaví, že?

Petr: Ano. A když je na nule, máš vždycky černou. I kdyby byla sytost a odstín jakýkoli. Zkusit si to je skvělý způsob, jak si barvy "osahat".

Adéla: To zní jako skvělý tip pro naše posluchače. Takže dnešní klíčové poznatky – RGB je pro míchání světel, CMYK pro tisk a HSV pro intuitivní práci s barvou.

Petr: Přesně tak. Doufám, že vám to pomohlo se v tom lépe zorientovat.

Adéla: Já myslím, že určitě. A to je pro dnešek od nás vše. Petře, moc děkuji, že jsi přišel.

Petr: Já děkuji za pozvání. Ahoj.

Adéla: A vám, milí posluchači, děkujeme za poslech a těšíme se zase příště u Studyfi Podcastu. Mějte se fajn!