Spracovanie počítačovej grafiky Nezačaté

0. Kľúčové fakty

1. Počítačová grafika — Je to oblasť informatiky, ktorá sa zaoberá vytváraním, spracovaním a zobrazovaním obrázkov pomocou počítača. Stretávame sa s ňou všade okolo nás — vo fotografiách, na webových stránkach, v počítačových hrách, v reklamách aj pri tlači kníh. Delíme ju na dva základné druhy: rastrovú a vektorovú grafiku.

2. Rastrová (bitmapová) grafika — Obrázok je zložený z mriežky drobných farebných bodov, ktoré nazývame pixely. Každý pixel má presne danú polohu a farbu, takže celý obrázok je vlastne veľká tabuľka farieb. Rastrová grafika je vhodná na fotografie a realistické obrázky s jemnými farebnými prechodmi, lebo dokáže zachytiť veľa detailov.

3. Pixel — Slovo vzniklo z anglického „picture element", teda obrazový prvok, a je to najmenšia časť rastrového obrázka. Pixel sa už nedá ďalej deliť a má jednu farbu; z miliónov takýchto bodov vzniká celý obraz. Keď rastrový obrázok veľmi priblížime, jednotlivé pixely uvidíme ako malé štvorčeky.

4. Vektorová grafika — Obrázok nie je zložený z bodov, ale z geometrických objektov ako čiary, krivky, kruhy a mnohouholníky, ktoré sú popísané matematickými vzorcami. Vďaka tomu sa dá ľubovoľne zväčšovať alebo zmenšovať bez straty kvality a okraje zostávajú vždy ostré. Používa sa na logá, ikony, mapy, technické nákresy a písmená (fonty).

5. Rozdiel medzi rastrovou a vektorovou grafikou — Hlavný rozdiel je v správaní pri zväčšovaní: rastrový obrázok sa pri priblížení rozmaže a „rozpadne" na štvorčeky, zatiaľ čo vektorový zostane ostrý pri akejkoľvek veľkosti. Rastrová grafika lepšie zachytí fotografie a jemné prechody farieb, vektorová zase ostré tvary a text. Vedieť ich rozlíšiť je dôležité, aby sme pre danú úlohu zvolili správny typ.

6. Rozlíšenie obrázka — Udáva, z koľkých pixelov sa rastrový obrázok skladá, napríklad 1920 × 1080 pixelov (šírka × výška). Čím vyššie rozlíšenie, tým viac detailov obrázok obsahuje, ale aj tým väčší súbor zaberá v pamäti. Pri nízkom rozlíšení je obrázok menej ostrý a po zväčšení sa rýchlo rozmaže.

7. Farebný model RGB — Na obrazovkách sa farby skladajú z troch základných zložiek: červenej (Red), zelenej (Green) a modrej (Blue). Miešaním rôznych intenzít týchto troch farieb vznikne až približne 16 miliónov odtieňov. RGB sa nazýva aditívny model, lebo keď spojíme všetky tri farby na maxime, vznikne biela.

8. Farebný model CMYK — Používa sa pri tlači a skladá sa zo štyroch farieb: azúrovej (Cyan), purpurovej (Magenta), žltej (Yellow) a čiernej (Key). Na rozdiel od RGB ide o substraktívny model — farby vznikajú odoberaním svetla, ktoré papier pohltí. Preto obrázok, ktorý chceme tlačiť, často prevádzame z RGB do CMYK.

9. Formáty rastrových súborov — Najbežnejšie sú JPG (vhodný na fotografie, zmenšuje veľkosť, ale stráca časť kvality), PNG (umožňuje priehľadnosť pozadia a zachová ostrosť) a GIF (podporuje jednoduchú animáciu). Výber formátu ovplyvňuje kvalitu obrázka aj veľkosť súboru. Pre vektorovú grafiku sa používa najmä formát SVG.

10. Grafický editor — Je to program, v ktorom obrázky vytvárame a upravujeme. Pre rastrovú grafiku slúžia napríklad GIMP, Malé maľovanie (Skicár) alebo Photoshop, pre vektorovú zas Inkscape alebo CorelDRAW. V editore vieme obrázok orezať, otáčať, meniť veľkosť, jas a farby alebo pridávať text.

11. Základné úpravy obrázka — K najčastejším úpravám patrí orezanie (odstránenie nepotrebných okrajov), zmena veľkosti, otočenie či prevrátenie, úprava jasu a kontrastu a doladenie farieb. Mnohé editory ponúkajú aj vrstvy, vďaka ktorým môžeme upravovať časti obrázka samostatne. Po každej úprave je dobré obrázok uložiť vo vhodnom formáte.

12. Veľkosť súboru a kompresia — Rastrové obrázky môžu zaberať veľa miesta, preto sa používa kompresia, ktorá zmenšuje veľkosť súboru. Stratová kompresia (napríklad JPG) odstráni časť informácií a obrázok mierne stratí kvalitu, bezstratová (napríklad PNG) zachová obrázok presne. Voľba závisí od toho, či je dôležitejšia malá veľkosť, alebo dokonalá kvalita.

1. Poučka

Počítačová grafika sa delí na rastrovú (obrázok je zložený z bodov — pixelov usporiadaných do mriežky) a vektorovú (obrázok je popísaný matematicky pomocou bodov, čiar a kriviek). Rastrová grafika sa pri zväčšení rozmazáva a „kockuje", vektorová ostáva ostrá pri akejkoľvek veľkosti. Obrázky upravujeme v grafickom editore.

2. Vysvetlenie

• Pixel je najmenší bod obrázka. Rastrový obrázok je mriežka pixelov — každý má svoju farbu.
• Rozlíšenie hovorí, z koľkých pixelov sa obrázok skladá (napr. 1920 × 1080). Viac pixelov = viac detailov, ale aj väčší súbor.
• Rastrová grafika sa hodí na fotografie. Keď ju zväčšíš, pixely sa zväčšia a obraz sa rozmaže.
• Vektorová grafika nepoužíva pixely, ale „predpis" (kde je čiara, aký má tvar a farbu). Preto sa dá zväčšovať bez straty kvality.
• V grafickom editore (napr. GIMP, Photoshop, Inkscape, Malé maľovanie) môžeš obrázok orezať, otočiť, zmeniť veľkosť, jas, kontrast, farby alebo niečo vymazať.
• Obrázok ukladáme do formátu súboru: rastrové sú napr. JPG, PNG, GIF, BMP; vektorové sú napr. SVG, AI, EPS.

3. Príklady a prečo je to dôležité

1. Fotka z mobilu je rastrová (JPG) — keď ju veľmi priblížiš, uvidíš jednotlivé pixely.
2. Logo firmy sa robí vektorovo (SVG), aby vyzeralo ostro na vizitke aj na veľkom bilborde.
3. Ikony na pracovnej ploche sú často vektorové, aby boli ostré na malej aj veľkej obrazovke.
4. Úprava fotky pred uverejnením — orežeš okraje, zvýšiš jas a uložíš v menšom rozlíšení, aby sa rýchlo načítala na webe.
5. PNG s priehľadným pozadím sa hodí, keď chceš obrázok vložiť na inú fotku bez bieleho rámika okolo.

Prečo je to dôležité: Keď vieš rozlíšiť rastrovú a vektorovú grafiku, vyberieš správny formát — logo nebude rozmazané, fotka sa zbytočne nezväčší na obrovský súbor a web sa načíta rýchlo. Ušetríš miesto, čas aj nervy.