Aplika n programov vybaven
This presentation is the property of its rightful owner.
Sponsored Links
1 / 25

Aplikační programové vybavení PowerPoint PPT Presentation


  • 64 Views
  • Uploaded on
  • Presentation posted in: General

Aplikační programové vybavení. Úvod do p o čítačové grafiky. Elektromagnetické záření. elmag . záření s určitou vlnovou délkou dopadající na sítnici našeho oka vnímáme jako barvu v rámci viditelné části spektra je člověk schopen rozlišit přibližně 10 milionů barev a jejich odstínů.

Download Presentation

Aplikační programové vybavení

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Aplika n programov vybaven

Aplikační programové vybavení

Úvod do počítačové grafiky


Elektromagnetick z en

Elektromagnetickézáření

  • elmag. záření s určitou vlnovou délkou dopadající na sítnici našeho oka vnímáme jako barvu

  • v rámci viditelné části spektra je člověk schopen rozlišit přibližně 10 milionů barev a jejich odstínů


Barevn modely

Barevné modely

  • barva - vlastnost nějakého objektu

  • barevný model (color model)

    • systém pro reprezentaci jednotlivých barev

    • je snaha popsat barvu co nejpřesněji

    • popisují se základní barvy a míšení těchto základních barev do výsledného odstínu

    • přidáním informací o okolních podmínkách (dopadající světlo) získáme barevný prostor (color space)

  • základní rozdělení

    • aditivní

    • subtraktivní


Aditivn barevn model

Aditivní barevný model

  • pracuje se světelnými zdroji barev (např. monitor nebo projektor)

  • 70 léta 19. století


Aditivn barevn model1

Aditivní barevný model

  • model RGB (Red, Green, Blue)

    • barvy jsou vytvářeny přidáváním barvy do černé (míchání vyzařovaného světla)

    • přidáním všech složek vznikne bílá (svítíme barevnými reflektory)

    • odpovídá fyziologii vnímání barev lidským okem

    • aditivní barevné prostředí proto nepotřebuje vnější světlo (barvy na monitoru jsou zobrazovány i v naprosté tmě)

    • barevné prostory CIE-XXX, HSV, HSL


Model rgb

Model RGB

  • každá barva je udána intenzitou tří základních komponent

  • 256 (1 byte) úrovní pro každou základní barvu

  • 2563 = 16 777 216 barev ve 3 bytech

  • nebo 65536 barev ve dvou bytech

  • RGBA – barevný pseudo prostor

    • rozšíření o alfa kanál (A)

    • alfa kanál – informace o průhlednosti pixelu (alpha blending)

    • obvykle je 256 úrovní průhlednosti (1 byte)


Subtraktivn barevn model

Subtraktivní barevný model

  • pracuje s odrazem bílého světla (tiskárny a všechno hmotné)


Subtraktivn barevn model1

Subtraktivní barevný model

  • model CMY (Cyan – tyrkysová, Magenta – purpurová, Yellow – žlutá)

    • subtraktivní prostředí je prostředí, které odráží světlo, a proto potřebuje vnější zdroj světla

    • CMY a RGB jsou komplementární

      • tyrkysová pohlcuje červenou a odráží zelenou a modrou (ink)

      • zelené + modré světlo = tyrkysové světlo (color)

    • odpovídá 3 základním barvám (tonerům) používaným při tisku

    • základní barvy jsou odečítány od bílé (čím více „odebereme“, tím více se blížíme černé)

    • „odebírání“ – omezujeme odraz světla, smícháním základních barev vznikne černá


Model cmy

Model CMY

  • CMYK – rozšíření o černou (blacK, Key – klíčová)

    • teoreticky postačují k vytvoření černé pouze tři barvy modelu CMY

    • ve skutečnosti ale vzniká barva tmavě šedivá

      • technické barvy (ink) obsahují pigment (mikroskopické částečky, které nelze dokonale promíchat)

    • navíc je černá levnější, proto většina tiskových zařízení používá ještě čtvrtou černou barvu

    • barevné prostory různé – závisí na technologii výroby barvy, tisku a podobně

      • univerzální např. Pantone


Pro m me v ce barevn ch model

Proč máme více barevných modelů?

  • monitor, projektor vyzařuje světlo, oko pohlcuje světlo

  • reálné objekty odráží světlo

  • http://www.dangries.com/Flash/RGB/eye.html


Gamut

Gamut

  • kompletní sada barev něčeho (zařízení, obrázku, atd.)

  • gamut je jedno z kritérií zobrazovacích schopností zařízení

    • je dáno fyzikálním omezením zařízení

    • každé zařízení má jiné schopnosti

    • každé oko má jiné schopnosti


Rastrov bitmapov data

Rastrová (bitmapová) data

  • obraz má danou velikost mřížky

  • každý bod mřížky má určenou barvu

  • bod mřížky – pixel (picture element)

  • příklady: JPG, GIF, PNG, BMP, TIFF


Vektorov data

Vektorová data

  • geometrický popis obrazu

  • elementární prvky: bod, úsečka, křivka, písmeno

  • dají se vytvářet plochy, definovat barvy

  • CAD aplikace

  • příklady: CDR, AI, EPS, PDF (někdy)


Rastrov vs vektorov grafika

Rastrová vs. vektorová grafika

  • Vektorový formát

    • matematický popis

    • neomezená přesnost (libovolné měřítko)

    • pro tisk a zobrazení se musí konvertovat do bitmapy

  • Rastrový formát

    • ne všechno je možné geometricky popsat

    • velké množství dat (viz BMP)

    • změna velikosti je dost složitá operace s nejistým výsledkem

    • pozor na ztrátovou kompresi!


Ztr tov komprese jpeg

Ztrátová komprese (JPEG)


Barevn hloubka

Barevná hloubka

  • počet bitů potřebných k uložení barvy pixelu

  • větší barevná hloubka zvětšuje škálu použitelných barev a také paměťovou náročnost obrázku

  • obrazy podle počtu použitých barev:

    • monochromatické: 1 pixel = 1 bit (bílá nebo černá)

    • stupně šedi: 1 pixel = 8 bitů (intenzita jedné barvy)

    • s paletou (indexovaná barva): 1 pixel = 2, 4, 8, 16 bitů

      • tabulka barev uložená v souboru s obrazem

      • barva pixelu je zadána jako index do tabulky barev

      • malá paměťová náročnost a možnost změny barev

      • používá se do 256 barev

    • pravé barvy: 1 pixel = 24 bitů (16 mil. barev)

    • pravé barvy s částečnou průhledností: 1 pixel = 32 bitů


Rozli en rastrov ho obrazu

Rozlišení (rastrového) obrazu

  • počet obrazových bodů na jednotku délky obrazu

  • obvykle se měří v počtu obrazových bodů na palec (dots per inch, dpi)

  • 1 palec = 2,54 cm

  • příklad: obraz o rozměrech 1×1 palec s rozlišením 100 dpi obsahuje celkem 10 000 obrazových bodů, stejný obraz s rozlišením 300 dpi obsahuje celkem 90 000 obrazových bodů

  • velikost obrazu na obrazovce je určena rozměry v obrazových bodech, velikostí a nastavením monitoru

  • velikost obrazu (souboru) na disku je určena celkovým počtem obrazových bodů a jejich barevnou hloubkou


Test sv tel

Test světel…


Grafika na webu

Grafika na webu

  • obyčejně rastrová

  • vektorová grafika je podporovaná v HTML5

    • SVG (Scalable Vector Graphics)

      • Popis vektorového obrázku pomocí XML souboru:

      • <svg width="200px" height="10px"><rect x="0" y="0" width="150px" height="10px" rx="5" fill="green"/><rect x="50" y="3" width="80px" height="5px" fill="red"/></svg>

    • lze vkládat přímo do HTML dokumentu nebo do externího souboru

    • podporováno ve všech hlavních prohlížečích


Grafika na webu1

Grafika na webu

  • Pozor na přenášená data

    • velikost – obrázky je nutno optimalizovat

      • obrázky designu 0..10 kB

      • obrázky s daty < 500 kB

    • počet požadavků

      • nepoužívat obrázky na prvky, které je možné vytvořit pomocí CSS (rámečky, linky)

      • recyklovat – pro celou aplikaci stačí jedna ikona „smazat“

      • slučovat

        • span.mce_bold {background-position: 0 0}

        • span.mce_italic {background-position: -60px 0}


Z sady pou it barev

Zásady použití barev

  • barvy používat střízlivě

  • nepoužívat modrou barvu u malých objektů nebo tenkých čar (lid. oko není příliš citlivé na odstíny modré)

  • na pozadí nepoužívat červenou a zelenou barvu (časté přeostřování – únava oka)

  • nekreslit vedle sebe syté barvy vzdálené ve spektru (náročné přeostřování oka)

  • odstíny šedé neruší

  • super bílá je trošku namodralá bílá


Odstra uj c p pady

Odstrašující případy

  • http://standanovak.borec.cz/

  • http://henryklahola.nazory.cz/

  • http://standa.chytrak.cz/

  • http://4a.chytrak.cz/

  • http://flussor.chytrak.cz/

  • http://cimrman.chytrak.cz/

  • http://www.vesmirni-lide.cz/default_c.htm

  • http://simona.kvalitne.cz/index2.php

  • a další …


  • Login