1. Základné pojmy informatiky 2. Digitalizácia 3. Rastrová (=bitmapová) grafika Princíp ukladania informácie Rastrové formáty obrázkov 4. Vektorová grafika OBSAH Princíp ukladania informácie Rastrové formáty obrázkov
Informatické pojmy bit = základná jednotka informácie = jedno miesto v pamäti počítača = jeden kus 1 (jednotky) alebo 0 (nuly) = značka: b (malé b, lebo je to maličký kúsok) 001101001101001 15 bit Byte = väčšia jednotka informácie = 8 miest v pamäti počíatča = 8 bitov = osem kusov hodnôt (kombinácia 0 a 1) = značka: B (veľké B, lebo je to väčší kúsok) 01011010 01101001 16 bit = 2 Byte Veľkosť obrázka = koľko bitov potrebujem na zakódovanie obrázka Rozmer obrázka = šírka a výška obrázka (je to počet pixelov) Farebná hĺbka = počet dostupných farieb (max. koľko farieb?)
1 B = 8 b prevod medzi b a B je vždy 8 1kB = 1024 B 1MB = 1024 KB 1GB = 1024 MB 1TB = 1024 GB Prevod medzi Kilo, Mega, Giga, Tera je vždy 1024 a jeho mocnina : 8 : 1024 : 1024 : 1024 : 1024 b B KB MB GB TB. 8. 1024. 1024. 1024. 1024
DIGITALIZÁCIA Čo to je? Proces zakódovania ANALÓGOVEJ informácie do takého tvaru, aby tomu rozumel DIGITÁLNY počítač. ANALÓG Informácie vnímame priamo zmyslami (nepotrebujem k tomu telefón, počítač, internet, slúchadlá...) PROCES DIGITÁLNY Informácia zakódovaná do 0 a 1, ktoré sa spracujú počítačmi, telefónmi, prehrávačom hudby... BINÁRNY KÓD Postupnosť núl a jednotiek, ktoré potom spracuje počítač
Digitalizácia obrázka Ako popíšem obrázok, aby tomu rozumel aj počítač? Rozdelíme obrázok na sieťku na drobné body (jeden bod = jeden PIXEL) Zistíme šírku a výšku (počet pixelov vodorovne a zvislo) Každý pixel má farbu Každá farba má svoje číslo (zapísané do binárneho kódu) /biela = 0, čierna = 1 Obrázok sa teda zakóduje ako postupnosť čísel (0 a 1), ktoré určujú farby jednotlivých bodov po poradí /na ukážke 20x20 pixelov Digitalizácia 00000000000000000000 00000000000000000000 00000001111110000000 00000110000001100000 00001000000000010000 00010000000000001000 00010001100110001000 00100001100110000100 atď...
Príklad - úloha Určme binárny kód tohto obrázka, ak použité farby sú očíslované takto: Riešenie Keďže počítač pracuje v dvojkovej sústave, nepozná naše čísla ako 2, 3, 4,... Preto musíme tieto čísla prepísať do takej formy, aby tomu rozumel aj on, takže do dvojkovej sústavy (môžeme použiť kalkulačku na počítači): 0 = 0 1 = 1 2 = 10 A teraz sa môže začať zápis: 3 = 11 1 0 0 1 Správny zápis je teda: 0 = 00 Farebne pre lepšie 0 10 01 0 1 = 01 pochopenie 0 01 10 0 2 = 10 1 0 0 1 3 = 11 Problém je, že počet prvkov v riadkoch nie je rovnaký a to naruší pravidelnosť kódu. Preto treba doplniť všetky hodnoty v dvojkovej sústave nulami na zažiatku tak, aby všetky farby boli vyjadrené rovnakým počtom núl a jednotiek. 01 00 00 01 00 10 01 00 00 01 10 00 01 00 00 01 01 00 00 01 00 10 01 00 00 01 10 00 01 00 00 01
Počítačová grafika Rastrová grafika Vektorová grafika Skicár (Paint) Logomotion Inkscape Corel Draw
Princíp rastrovej grafiky Obrázok je rozdelený na maličké body PIXEL Každý pixel nesie informáciu o farbe Rastrový obrázok má 2 parametre: 1. Rozmery Šírka a výška obrázka 2. Farbená hĺbka Počet maximálnych farieb (ktoré sa môžu vyskytnúť v obrázku)
Formáty rastrových obrázkov Bitová mapa BMP Uchováva informáciu o každom bode a o jej farbe Je to bezstratové uchovanie obrázka Všetky body majú takú farbu, akú majú mať Veľkosť (miesto v pamäti) závisí od rozmerov obrázka a farebnej hĺbky Zaberá veľa miesta v pamäti počítača PNG Kombinácia predchádzajúcich Komprimovaný formát zaberá málo miesta Maximálny počet farieb (všetky farby v počítači) Podporuje priehľadnosť...nepodporuje animácie... Vhodný pre internet (kvalitný a malý) JPEG JPG Princíp uchovávania Pixle veľmi podobných farieb, ktoré sú veľmi blízko seba počítač vníma, ako jednu oblasť jednej farby - KOMPRIMOVANIE Nie sú kódované jednotlivé body, ale je určená miesto oblasti a jej farba Stratová kompresia stratia sa nejaké pôvodné informácie (farba nejakého pixelu) Z hľadiska nášho oka je to v poriadku, totiž tieto malé zmeny naše oko nevidí Z hľadiska počítača je výhoda v tom, že tieto obrázky zaberajú oveľa menej miesta v pamäti GIF Nestratová kompresia Ukladajú sa oblasti podobne, ako pri JPG, len nezhltne podobné farby do jednej Používa iba 256 farieb Podporuje ukladanie animácií pohyblivé obrázky Podporuje priehľadnosť
http://www.youtube.com/watch?feature=player_embedded&v=evqheowmdji Ron Lasko (Ohio)
Snažili sme sa nakresliť v Skicári
Princíp vektorovej grafiky Nakreslené obrázky sa skladajú z objektov Objekty sú rôzne jednoduché tvary Kruhy, obdĺžniky, hviezdy, čiary, krivky Objekty majú svoje vlastnosti (tieto za zapisujú do kódu súboru) Obrys farba, hrúbka, štýl Výplň farba, farebný prechod, textúra... Umiestnenie vodorvná a zvislá pozícia na obrazovke Polomer, dĺžka strany, počet uhlov... Nové tvary sa vytvárajú pomocou operácií na základných tvaroch zjednotenie, prienik, rozdiel... prenesením objektu na cestu tvar skladajúci sa z flexibilných bodov
Vektorová grafika Program Inkscape (free download): http://downloads.sourceforge.net/inkscape/inkscape- 0.48.4-1-win32.exe Čakajú nás zaujímavé projekty a kresby v tomto programe Biliardova guľa, Realistické oko, Moderné motívy, Kreslené zvieratká Logá
RASTROVÁ vs. VEKTOROVÁ 1. Obrázky sú zakódované v súbore ako farebná sieťka, kde každý pixel má svoju farbu a táto farba svoje číslo. Tieto informácie sú zapísané v dvojkovej sústave. 2. Ak sa mení rozmer obrázka, tak sa kazí kvalita, pretože časti obrázka sa zväčšujú. Tj. k jednotlivým pixelom sa doplnia ďalšie, aby sme mali dojem, že obrázok rastie. 3. Obrázky sa kreslia ako keby na jednu vrstvu, stále sa prekresľujú nekajé pixely na obrazovke a prepisujú sa informácie v súbore. 4. Jednoduché ovládanie a málo nástrojov (vhodné pre malé deti) - INTUITÍVNE grafika 1. Obrázky sú zakódované v súbore ako niekoľko objektov s danými vlastnosťami (pozícia, farba, rozmer...). Tieto informácie sú zapísané v dvojkovej sústave. 2. Pri zmene rozmerov obrázka kvalita ostáva rovnaká, pretože sa iba prepisujú informácie o danom objekte a vykresľuje sa obrázok nanovo podľa nových údajov. 3. Jednotlivé objekty sa postupne vytvárajú akokeby na vrstvách, preto ich môžeme hociekdy premiestniť na inú pozíciu a vymeniť aj poradie týchto vrstiev. 4. Náročnejšie fungovanie, viac nástrojov (používaná v profesionálnej sfére / reklamy, webdesing, logo design...) PROFESIONÁLNE 5. Programy: Paint (Skicár), Logomotion, Irfan View 6. Typy súborov:.bmp,.jpg,.png,.gif 5. Programy: Inkscape, Zoner Callisto, Corel Draw 6. Typy súborov: rôzne, podľa typu programu, ale všeobecne sa uznáva.svg