Digitální grafika

 

Digitální záznam
Analogový záznam
Digitální obrázky
Typy grafického záznamu
Pořízení digitálního obrázku
Formáty grafických souborů
Velikost digitálního obrázku
Rozlišení fotoaparátů
Průhledný obrázek
Animovaný GIF
GIF Animator
Úkoly
 příprava scény
 příprava objektu
 
úkol-animace
 úkol-animace+makro
 
úkol-příjezd

Digitální záznam

Digit = číslo.
Digitální = "zaznamenaný ve formě čísel". V přístroji pouze pomocí čísel 0 a 1.
Digitální záznamy: CD (hudba, programy…), DVD (filmy, soubory…), vše v počítači, USB paměti, paměti dig. fotoaparátu, mobilu, MP3 přehrávače a dalších médií…

Analogový záznam

(kazeta, videokazeta…) - např. signál převedený na elektrické napětí. Zapisujeme jej např. zmagnetováním na pásku.
Videokazeta má delší životnost, než DVD !
Poškozením části záznamu na videokazetě dojde jen k bliknutí, DVD bude téměř nepoužitelné !

analogový údaj digitální údaj
měřák s ručkou měřák s displejem
ručičkové hodiny digitální hodiny
papírová fotka fotka v počítači

Digitální obrázky

Jsou zaznamenány v souborech (na disku, fotoaparátu, mobilu…).

Typy grafického záznamu:

Pořízení digitálního obrázku

Skládání barev

Monitorem (RGB) - skládání, tiskárnou (CMYK) - skládání.

Formáty uložení souborů s obrázky (nejběžnější):

POZN: Komprimace = zmenšení velikosti souboru s obrázkem (úspornějším zápisem).
POZN: Ztrátová komprese = vypuštění části grafické informace (kterou oko skoro nerozezná)

Velikost digitálního obrázku

Na monitoru, TV, displeji mobilu je každý bod obrázku vykreslen jedním bodem (pixelem) obrazovky.
Velikost obrázku tak udáváme v bodech (pixelech).
Rozlišení = počet bodů digitálního obrázku. Lze udat jako:
- rozměry v bodech (šířka×výška)
-
celkový počet bodů (pixelů).
Příklady rozlišení displeje:

Čím více bodů, tím větší obrázek a lepší detaily. Zabírá však více místa na disku.
Strany digitálního obrázku bývají v poměru:

POZN: např. 1600×1200 = 1 920 000 pixelů ~ 2 miliony pixelů = 2 Mpix
(tolik snímacích bodů má "destička" ve fotoaparátu, na kterou se promítá obraz).

Rozlišení fotoaparátu:

je počet bodů, kterými snímá obraz (počet bodů fotografie):

2 Mpix ~1920×1080, 3 Mpix ~2000×1500, 8 Mpix ~3840×2160, 12 Mpix ~4200×2800apod.

Úkol: ZJISTI počet bodů zobrazených na tvém monitoru: P myšítkem na plochu->Vlastnosti->ouško Nastavení->Rozlišení obrazovky.
(např. 1600×1200 bodů …)

Průhledný obrázek

Např. v obrázku Zelená kulička chceme, aby jeho šedé pozadí bylo nahrazeno pozadím webové stránky - "průhledné" (takto: Zelená kulička ).

Postup vytvoření obrázku s průhledným pozadím v programu XnView:

  1. Obrázek otevři v programu Photo Filtre
  2. Nástrojem Magická hůlka Ikona Magická hůlkavyber celé pozadí (větší číslo Odchylka->vybere více) a výběr SMAŽ (vyplní se nastavenou barvou pozadí).
  3. Vyplň pozadí jednou barvou (takovou, která se ve zbytku obrázku nevyskytuje).
  4. Obrázek ulož s příponou PNG.  (programem Malování, Photo Filtre…)
  5. Obrázek otevři v XnView:
    Obrázek->Konverze do barevné palety->256 barev (nebo méně)
  6. Zobrazit-> Informace o barvách - myš zobrazuje číslo (index =pořadí) barvy pod ukazatelem myši.
    Zjisti číslo barvy pozadí (číslo od 0 do 255).
  7. Obrázek->Upravit mapu barev (Ctrl+M):
    - klikni na zjištěnou barvu pozadí (Index=číslo barvy)
    - Povolit průhlednost
  8. Soubor ulož jako typ GIF.

Takto průhledně upravené pozadí v obrázcích zobrazují prohlížeče internetu i kancelářské aplikace.

Animovaný GIF

je ve skutečnosti sada obrázků (ve formátu GIF) s jednotlivými fázemi pohybu. Tyto obrázky jsou jako stránky uloženy v jediném souboru (také ve formátu GIF).
Obrázky se na sebe překreslují tak rychle, aby v mozku vytvořily dojem pohybu.
Prohlížeč internetu i prohlížeč obrázků umí správně zobrazit střídání jednotlivých obrázků (stránek).

Vytvoření jednoduchého animovaného GIFu:

  1. V bitmapovém editoru vytvoř sadu stejně velkých obrázků (předchozí uprav, pak "Uložit jako" další fázi)
     
    1. fáze 2. fáze 3. fáze
    Obrázek - 1. fáze pohybu Obrázek - 2. fáze pohybu Obrázek - 3. fáze pohybu
  2. Spoj pomocí programu MS GIFanimator (či Unfreez animator) do jediného "animovaného GIFu"

Výsledná animace

Tvorba animace

  1. Vytvoř jeden obrázek - celé pozadí s celým objektem, který se má pohybovat
    např: Auto00  ,   Kytka00
     
  2. Z tohoto obrázku vytvoř sadu ostatních fází pohybu (vždy pomocí "Uložit jako" další fázi, tu pak uprav).
    Uvedený obrázek bude jednou z fází (auto04, kytka05). Např:
auto01 auto02 auto03 auto04 auto05 auto06
auto01 auto02 auto03 auto04 auto05 auto06

nebo

kytka01 kytka02 kytka03 kytka04 kytka05
kytka01 kytka02 kytka03 kytka04 kytka05
  1. V programu GIF animator seřaď fáze tak, aby se animace mohla stále opakovat:

  

  auto01 auto02 auto03 auto04 auto05 auto06  
auto01 auto02 auto03 auto04 auto05 auto06

 

  kytka01 kytka02 kytka03 kytka04 kytka05 kytka04 kytka03 kytka02    
kytka01 kytka02 kytka03 kytka04 kytka05 kytka04 kytka03 kytka02  
 

POZN: pokud obrázky neuložíme postupně příkazem "uložit jako" (tj. tvoříme každá zvlášť), může mít animace zkreslené barvy.

GIF Animator

je program, který "spojí" řadu obrázků GIF do výsledné animace. Existuje mnoho animátorů, návod popisuje MS GIFanimator.
Animaci uloží jako jediný soubor - obrázek GIF (tzv. animovaný GIF).
Před spojením obrázků ulož kopii poslední fáze ještě do souboru "animace-[příjmení].gif" (to pak bude výsledná animace).
Obrázky do GIF Animátoru přidávej od posledního (pořadí 6, 5, .. 2, 1).

GIF Animator - přidání obrázku  GIF Animator - opakování animace 

Výsledný animovaný GIF: Animace - auto

POZN: Při tvorbě fází vhodným posunováním (co vlevo odsunu, vpravo přidám) lze animované obrázky Auto 2 varianta poskládat vedle sebe:

Auto 2 variantaAuto 2 variantaAuto 2 variantaAuto 2 varianta

POZN: Jednotlivým obrázkům lze ještě nastavit průhlednou barvu - pak animace probíhá na průhledném pozadí.


Příprava scény

  1. V Malování či Photo Filtre si ulož prázdný obrázek [tvé_příjmení]-pozadí.gif (velikost 400×300).
    Bude to pohled zboku na scénu (krajinu, stadion, pokoj…

  2. Do scény namaluj alespoň 4 objekty - náměty:
    - krajina (2 různé stromy, dům, kopec…) - pohled, jako když zboku fotografuji krajinu se silnicí
    - stadion (dole hrací plocha, mantinel či okraj, hlediště s diváky - pohled, jako když na hrací ploše fotografuji hráče, za ním je hlediště
    - pokoj (alespoň 2 kusy nábytku, televize obrazovkou sem, postel nebo stůl…)
    - pohled shora na město (domy, stromy, rybník

  3. Lze použít části KRESLENÝCH obrázků z internetu - NE fotografie!

Příprava  objektu

  1. V Malování či Photo Filtre si ulož prázdný obrázek [tvé_příjmení]-objekt.gif (velikost - menší, než pozadí - např. 100×80).
    Bude to pohled zboku na objekt (dopravní prostředek, hráče, míč, zvíře, poznatelný předmět…)

  2. Vyplň jej zeleným      pozadím.

  3. Namaluj, vlož do něj objekt, který NEOBSAHUJE tuto      barvu.

  4. Lze vložit i části KRESLENÝCH obrázků z internetu (mimo web jihlavsko.cz), NE fotografie! (např. pixabay…)

Úkol - animace

Vytvoř animovaný GIF velikosti 400 (šířka)×300(výška) s nějakým dějem (pohyb dopravního prostředku, sport, činnost, čarování…).
Návod:
- vytvoř celý obrázek se všemi objekty (do rohu alespoň tečkou nanes barvu, kterou v obrázku ještě nemáš, ale budeš chtít použít později)
- čáry tloušťkou 1
- ulož jako obr00.GIF
- objekt, který by se měl pohybovat po obrázku (auto, slunce…) ulož do zvláštního souboru objekt.GIF (opět nezapomeň na stejné tečky s týmiž barvami, jako v původním obrázku)
- obrázek s pozadím pak ulož jako obr01.GIF a proveď v něm úpravy (vlož objekt na nové místo apod.)
- obr01.GIF ulož jako obr02.GIF a opět proveď úpravy
- obr02.GIF ulož jako obr03.GIF a opět proveď úpravy
- …

Úkol - animace + makro

Vytvoř animovaný GIF formátu A5 nebo A6. Využij K TOMU NÍŽE PŘIPRAVENÝ dokument.

  1. předem si připrav scénu (pozadí) velikosti alespoň 400×300 (další požadavky jsou výše)
  2.       –   |   |    –  2 objekty (obrázky - pohled zboku na dopravní prostředek, postavu, zvířátko…) - NE fotografie, vyhledej kreslené
    (vyhledávání: "pozadí kreslené", "traktor kreslený"…), nejlépe na jednobarevném pozadí
    Nejlepší jsou vektorové obrázky (např. publicdomainvectors).
  3. oba objekty uprav jako průhledné obrázky podle postupu zde.
  4. pro práci s makrem je důežité vědět tyto informace (jen přečti, vrať se sem)
  5. stáhni si dokument animace-A6-sablona.odg (obsahuje makro) pro Libre Office Draw, ulož ho pod názvem animace-[tvé_příjmení].odg
  6. stažený dokument otevři + Povolit makra
  7. do prvního listu vlož obrázek scény (připravené pozadí), aby zakrýval celou bílou stránku v pozadí. Pak P myšítkem na obrázek->Ořízni vše, co stránku přesahuje (pak Enter)
  8. list zkopíruj vícekrát pod sebe (L sloupec - malý náhled - Ctrl+C, pak Ctrl+V)
  9. v listech 2,3… posunuj připravené objekty tak, aby listy tvořily fáze pohybu těchto objektů (klávesa F4->měň x-souřadnici pozice objektu)
  10. klávesnicí (PgDn a PgUp) listuj mezi stranami - ověř funkčnost animace
  11. složku C:\TMP vytvoř (příp. smaž vše v ní)
  12. spusť makro "Více-Stran-Do-GIF" (jak spustit) - tím do C:\TMP vyexportuješ jednotlivé obrázky animace
  13. ve složce C:\TMP jsou obrázky 00.gif, 01.gif, 02.gif… Tyto obrázky spoj do animace-[tvé_příjmení].gif (viz postup).
  14. Výsledky své práce (animace-[tvé_příjmení].GIF, animace-[tvé_příjmení].ODG) odevzdej učiteli

Úkol - příjezd

Vytvoř plánek (~prezentaci) pro příchod (větší pro příjezd) k význačnému objektu ve tvém městě.
Návod: do mapky města postupně kresli šipku postupu, pak detail místa (se šipkou), obrázkem význačného objektu.

Odkazy: skládání barev vímproč