POČÍTAČOVÁ GRAFIKA. Lenka Bednaříková

POČÍTAČOVÁ GRAFIKA Lenka Bednaříková

POČÍTAČOVÁ GRAFIKA - OBSAH Barevné modely Základní dělení počítačové grafiky Vektorová grafika Rastrová (bitmapová) grafika Rozlišení Barevná hloubka Komprese, komprimace Rastrové grafické formáty Grafické editory Test na závěr

Počítačová grafika -> Barevné modely BAREVNÉ MODELY Mísením základních barev vznikají barvy výsledné Aditivní model RGB Model HSV Subtraktivní model

Počítačová grafika -> Barevné modely ADITIVNÍ BAREVNÝ MODEL - RGB Tři základní barvy - červená (Red), zelená (Green) a modrá (Blue) Používají zařízení, která svítí (monitory, dataprojektory) Používá se při ukládání do souborů Jsou-li všechna světla zhasnuta, vnímáme černou barvu, svítí-li všechna na maximum, vidíme bílou barvu Rozšíření RGBA - složka A (Alfa-kanál) určuje průhlednost vzhledem k pozadí (0 - neprůhledný, 255 - zcela průhledný)

Počítačová grafika -> Barevné modely SUBTRAKTIVNÍ BAREVNÝ MODEL - CMY Tři základní barvy - azurová (Cyan), purpurová (Magenta) a žlutá (Yellow) Používají barevné tiskárny Pokud se všechny smíchají, je bod černý, pokud netiskne žádný, zůstane papír bílý Rozšíření CMYK - smíchání všech tří pigmentů dá černou pouze teoreticky (prakticky vznikne tmavě hnědá), proto bývá přidávána kvalitní černá barva (black)

Počítačová grafika -> Barevné modely MODEL HSV Hue (odstín) základní spektrální barva; hodnoty jsou udávány ve stupních (0 360 ) Saturation (sytost) poměr čisté barvy a bílé (maximální sytost 100% mají spektrální barvy) Value (intenzita) jasná barva (100% ) nemá příměs černé klesání jasu přidávání černé Model odpovídá malířskému chápání barev

Počítačová grafika -> Barevné modely odstíny šedé EKVIVALENTNÍ RGB, CMY A HSV HODNOTY barva R G B C M Y HSV červená 255, 0, 0 0, 255, 255 0, 100%, 100% žlutá 255, 255, 0 0, 0, 255 60, 100%, 100% zelená 0, 255, 0 255, 0, 255 120, 100%,100% azurová (cyan) 0, 255, 255 255, 0, 0 180, 100%, 100% modrá 0, 0, 255 255, 255, 0 240, 100%, 100% purpurová (magenta) 255, 0, 255 0, 255, 0 300, 100%, 100% černá 0, 0, 0 255, 255, 255 0, 0%, 0% 63, 63, 63 191, 191, 191 0, 0%, 25% 127, 127, 127 127, 127, 127 0, 0%, 50% 191, 191, 191 63, 63, 63 0, 0%, 75% bílá 255, 255, 255 0, 0, 0 0, 0%, 100% růžová světlá 255, 192, 192 0, 64, 64 0, 25%, 100% růžová tmavá 255, 128, 128 0, 128, 128 0, 50%, 100% tmavě červené 203, 0, 0 52, 255, 255 0, 100%, 80% hnědá 128, 0, 0 127, 255, 255 0, 100%, 50%

POČÍTAČOVÁ GRAFIKA ZÁKLADNÍ DĚLENÍ Rastrová (bitmapová) Obrázek popsán pomocí jednotlivých barevných bodů Vektorová Obrázek popsán pomocí geometrických objektů (body, přímky, křivky )

Počítačová grafika -> Vektorová grafika VEKTOROVÁ GRAFIKA Ukládána ve formě matematického zápisu návod, jak obraz vytvořit Obraz reprezentován pomocí základních geometrických objektů (body, přímky, křivky, polygony) Tyto objekty můžeme různě tvarovat a deformovat, mají atributy jako pozice, rozměry, barva, tloušťka čáry, výplň Typické přípony souborů:.pdf,.ps Adobe Illustrator.cdr Corel Draw.zmf Zoner Callista.dwg AutoCAD.ttf fonty

Počítačová grafika -> Vektorová grafika VEKTOROVÁ GRAFIKA Výhody Změna velikosti obrázku bez ztráty kvality Obvykle menší velikost uloženého souboru Vektory lze snadno editovat Nevýhody Při zobrazování nutno převést na rastrový obrázek Neexistuje jednotný formát, problémy s přenosem souborů Omezená oblast použití Použití: pro počítačovou sazbu, tvorbu ilustrací, počítačovou animaci, reklamy, konstrukce a návrhy, grafické a kartografické informační systémy

Počítačová grafika -> Rastrová grafika RASTROVÁ (BITMAPOVÁ) GRAFIKA Obraz popsán pomocí jednotlivých barevných bodů PIXELŮ Body jsou uspořádány do mřížky Každý bod má přesnou polohu a barvu Faktory ovlivňující kvalitu obrázku: Velikost šířka x výška obrázku v pixelech (100x150px) Rozlišení počet bodů, z kterých se obrázek skládá Barevná hloubka počet barev, které lze v rastrovém obrázku použít Komprese, komprimace zmenšování objemu dat

Počítačová grafika -> Rastrová grafika ROZLIŠENÍ Nejdůležitější parametr rastrového obrázku Čím více bodů, tím kvalitnější obrázek, tím více místa zabere -> ideální přiměřený počet bodů Digitální fotoaparáty Celkový počet bodů, který je schopen fotoaparát uložit Udává se v MegaPixelech (např. 3 megapixely 2048 x 1536 bodů) Monitory Počet bodů na ose x krát počet bodů na ose y (např. 1280 x 1024) Bitmapové editory, tiskárny DPI (Dots per Inch = body na palec ) Kolik bodů daného rastru se vejde do úsečky o délce 2,54cm (např. rozlišení monitoru 72 DPI, tiskárny 300 DPI)

Počítačová grafika -> Rastrová grafika BAREVNÁ HLOUBKA Počet bitů potřebných na reprezentaci jeho barvy Počet možných barev Potřebný počet bitů (hloubka) 2 = 2 1 1 4 = 2 2 2 16 = 2 4 4 256 = 2 8 8 bitů = 1 byte 16,7 mil = 2 24 True Color 4,3 miliardy Super True Color 24 bitů = 3 byte 32 bitů = 4 byte Používá se nejčastěji v systému RGB na každou barvu 1 byte 1 byte pro alfa kanál (průhlednost)

Počítačová grafika -> Rastrová grafika KOMPRESE Zkomprimovaný soubor je daleko menší než originál Bezztrátová bez ztráty informace po rozbalení dostaneme stejný rastr jako před komprimací Ztrátová výsledná bitmapa je vždy jen podobná originální, dociluje se podstatně menších velikostí Příklad Fotografie s rozlišením 3MPix s barevnou hloubkou 24 bitů (3 bytů): 2048 x 1536 x 3 = 9 437 184 bytů, tj. řádově 9,5 MB - po kompresi 840 kb

Počítačová grafika -> Rastrová grafika -> Grafické formáty RASTROVÉ GRAFICKÉ FORMÁTY Formáty rozlišujeme jako nekomprimované a komprimované, komprimované pak na formáty s bezeztrátovou či ztrátovou kompresí. BMP GIF JPG PNG TIFF

Počítačová grafika -> Rastrová grafika -> Grafické formáty.bmp Windows Bitmap Obrázky ukládány po jednotlivých pixelech Většinou nepoužívají žádnou kompresi Obvykle soubory mnohem větší než obrázky stejného rozměru, které kompresi používají Formát nevhodný pro použití na Internetu Výhodou je extrémní jednoduchost Dokáže jej snadno číst i zapisovat drtivá většina grafických editorů Obrázek o rozměrech 800 600 pixelů a s 16,7 miliony barev potřebuje téměř 1,4 megabajtu

Počítačová grafika -> Rastrová grafika -> Grafické formáty.gif Graphics Interchange Format Používá bezeztrátovou kompresi Vhodný pro uložení tzv. perokresby (nápisy, plánky, loga) Umožňuje jednoduché animace Umožňuje průhledné pozadí Maximální počet současně použitých barev je 256 Používá se pro WWW grafiku na Internetu

Počítačová grafika -> Rastrová grafika -> Grafické formáty.jpg Joint Photographic Experts Group Vyslovováno originálně džeipeg, ale užívá se též počeštěné výslovnosti jépeg nebo jpeg Metoda ztrátové komprese používané pro ukládání počítačových obrázků ve fotorealistické kvalitě Není však vhodný pro perokresbu, zobrazení textu nebo ikonky, protože kompresní metoda JPEG vytváří v takovém obrazu viditelné a rušivé artefakty Používá se pro WWW grafiku na Internetu Fotografie komprimovaná se vzrůstajícím komprimačním poměrem zleva doprava.

Počítačová grafika -> Rastrová grafika -> Grafické formáty.png Portable Network Graphics Oficiální výslovnost zkratky je ping Formát určený pro bezeztrátovou kompresi rastrové grafiky Vyvinut jako zdokonalení a náhrada formátu GIF Nabízí podporu 24 bitové barevné hloubky Obsahuje osmibitovou průhlednost (tzv. alfa kanál), to znamená, že obrázek může být v různých částech různě průhledný Nevýhodou je praktická nedostupnost jednoduché animace Používá se pro WWW grafiku na Internetu

Počítačová grafika -> Rastrová grafika -> Grafické formáty.tiff Tag Image File Format Neoficiální standard pro ukládání snímků určených pro tisk Složitější formát oproti jiným formátům pro ukládání rastrové grafiky Umožňuje vícestránkové soubory Užitečnou metodu pro archivaci obrázků

Počítačová grafika -> Rastrová grafika RASTROVÁ GRAFIKA Výhody Vhodné pro předlohy z reálného světa Pixelové hodnoty mohou být měněny hromadně Snadný přenos na rastrová zařízení (obrazovka, tiskárna) Nevýhody Velké velikosti souborů při velkém rozlišení a barevné hloubce Problém se změnou velikosti (zvětšení obrázku je možné jen v omezené míře) Použití: pro zaznamenání reálného světa fotografie, digitalizace tištěného textu (scanner)

Počítačová grafika -> Grafické editory GRAFICKÉ EDITORY Rastrové AdobePhotoshop CorelPhotoPaint GIMP PhotoFiltre 2D systémy CorelDraw AdobeIlustrator Zoner Callisto Vektorové CAD systémy AutoCAD Spirit Microstation ArchiCAD 3D systémy 3D Studio

Počítačová grafika -> Grafické editory RASTROVÉ EDITORY Programy určené k práci s bitmapovými (rastrovými) obrázky Kreslení i úpravy = změna barvy bodů Kreslení Základní geometrické tvary Typy čar (pero, štětec, ) Rozsáhlé možnosti výplní (přechody barev, vzorky, ) Guma Úprava fotografií Úpravy rastru (barev, velikosti) Výřezy (kopírování, otočení, posun, zrcadlení) Retušovací nástroje (zaostření,rozmazání, ) Rastrové efekty

Počítačová grafika -> Grafické editory VEKTOROVÉ EDITORY Kreslení = tvorba objektů Úprava = změna vlastností objektů Umožňuje: Kreslení základních geometrických objektů, křivek, kreslení od ruky Úpravu nakreslených objektů (např. kopie, změna velikosti, otáčení, změny pořadí, vzájemné zarovnávání) Zarovnání vůči sobě, změny pořadí, seskupování Široké možnosti práce s textem Efekty: perspektiva, obálka, tvarové přechody Export do různých formátů (vektorových i rastrových

TEST NA ZÁVĚR 1. ČÁST Z jakých základních barev je složen barevný model CMYK? červená žlutá azurová magenta černá zelená V jakém barevném modelu pracuje monitor počítače? HSV RGB CMYK KFC Jakou barvu získáme smícháním 100 % červené, 0 % zelené a 100 % modré složky v barevném modelu RGB? červená žlutá azurová magenta černá zelená

TEST NA ZÁVĚR 2. ČÁST Vyberte formáty rastrového typu:.bmp.zmf.tiff.gif.cdr.jpg Zatrhněte, který formát obrázku může dosáhnout nejlepší komprese:.jpg.tiff.gif.bmp.png Zatrhněte formát obrázku, který může být animovaný:.jpg.tiff.gif.bmp.png

DĚKUJI ZA POZORNOST