17
Poznamo dve vrsti računalniških grafik, ena je vektorska druga pa je rastrska. Najprej bom na kratko opisal vsako vrsto posebej, naštel primere grafičnih orodji, ki so namenjena za oblikovanje rastrske in vektorske grafike ter jih primerjal med seboj. Nato pa bom za grafično orodje Inkscape, katero je prosto dostopno, opisal eno možnost uporabe v šolstvu. Ta naj bi potekala v sklopu dveh ur, in sicer naj bi otroci izdelali dva projekta z orodjem Inkscape. Primerjava Poznamo dve vrsti računalniških grafik to sta vektorska in rastrska grafika. Če najprej opišem vsako posebej. Rastrska grafika oziroma rečemo ji tudi bitna grafika. To je v računalniški grafiki način shranjevanja slik z množico slikovnih pik oz. pikslov v obliki 2D matrike. Vsaka slika je shranjena v računalniškem pomnilniku in je v obliki matrika v kateri pa so podatki za vsako slikovno piko, ki je v sliki. Ti podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko transformiramo, se pravi povečamo, pomanjšamo, zavrtimo, raztegnemo,… lahko postane ločljivost te slike zelo slaba, rastrska grafika pa postane nazobčana. Največkrat se rastrska grafika uporablja v programih za slikanje. Tovrstni programi uporabniku omogočajo izdelavo slik na računalniškem zaslonu na podoben način, kot da bi slikal na papir ali slikarsko platno. Ta računalniška grafika se zelo veliko uporablja pri računalniško podprtem načrtovanju (CAD) ter pa pri generiranju modelov in simulacij tako v tehniki, kot tudi meteorologiji, medicini, kirurgiji in še na drugih znanstvenih področjih. Nedavni razvoj programske opreme je omogočil, da lahko sodelavci z nasprotnih strani sveta kompleksne 3D računalniške modele obdelajo na običajnih, med seboj povezanih, osebnih računalnikih, ne pa na močnih delovnih postajah kot pred časi. Tipične končnice slik v rastrski grafiki so .jpg, .jpeg, .gif, .png, .bmp, .row.

Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

  • Upload
    vucong

  • View
    217

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

Poznamo dve vrsti računalniških grafik, ena je vektorska druga pa je rastrska. Najprej bom na kratko opisal vsako vrsto posebej, naštel primere grafičnih orodji, ki so namenjena za oblikovanje rastrske in vektorske grafike ter jih primerjal med seboj. Nato pa bom za grafično orodje Inkscape, katero je prosto dostopno, opisal eno možnost uporabe v šolstvu. Ta naj bi potekala v sklopu dveh ur, in sicer naj bi otroci izdelali dva projekta z orodjem Inkscape.

Primerjava

Poznamo dve vrsti računalniških grafik to sta vektorska in rastrska grafika. Če najprej opišem vsako posebej.

Rastrska grafika oziroma rečemo ji tudi bitna grafika. To je v računalniški grafiki način shranjevanja slik z množico slikovnih pik oz. pikslov v obliki 2D matrike. Vsaka slika je shranjena v računalniškem pomnilniku in je v obliki matrika v kateri pa so podatki za vsako slikovno piko, ki je v sliki. Ti podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko transformiramo, se pravi povečamo, pomanjšamo, zavrtimo, raztegnemo,… lahko postane ločljivost te slike zelo slaba, rastrska grafika pa postane nazobčana. Največkrat se rastrska grafika uporablja v programih za slikanje. Tovrstni programi uporabniku omogočajo izdelavo slik na računalniškem zaslonu na podoben način, kot da bi slikal na papir ali slikarsko platno. Ta računalniška grafika se zelo veliko uporablja pri računalniško podprtem načrtovanju (CAD) ter pa pri generiranju modelov in simulacij tako v tehniki, kot tudi meteorologiji, medicini, kirurgiji in še na drugih znanstvenih področjih. Nedavni razvoj programske opreme je omogočil, da lahko sodelavci z nasprotnih strani sveta kompleksne 3D računalniške modele obdelajo na običajnih, med seboj povezanih, osebnih računalnikih, ne pa na močnih delovnih postajah kot pred časi. Tipične končnice slik v rastrski grafiki so .jpg, .jpeg, .gif, .png, .bmp, .row.

Vektorska grafika oziroma rečemo ji tudi predmetna grafika. To je v računalniški grafiki način predstavitve slik s pomočjo predmetov oz. objektov, kot so različni geometrijski objekti, to so točke, črte, krivulje in razni mnogokotniki. Vsak predmet oz. objekt, ki sestavljajo slike v vektorski grafiki, je natančno določen z nizom matematičnih enačb. Vektorske slike lahko transformiramo (povečamo, zmanjšamo, vrtimo, raztegnemo,…) brez poslabšanja ločljivosti slike, kvaliteta slike ostane nespremenjena, to pri rastrski ni bilo mogoče, tu je tudi glavna prednost pred rastrsko grafiko. Prednost je tudi ta, da lahko pri vektorski grafiki izberemo in transformiramo tudi vsako posamezno komponento vektorske slike, saj je vsaka komponenta v računalniškem pomnilniku definirana posebej. Vektorsko grafiko po navadi uporabljajo risalni programi, ki uporabniku omogočajo izdelavo in popravljanje tehničnih diagramov, na primer načrtov hiš ali avtomobilov. Tipične končnice slik v vektorski grafiki so .svg, .ai, .pdf, .eps, .wmf.

Spodaj v tabeli so navedene posamezne prednosti in slabosti tako za rastrsko, kot tudi za vektorsko grafiko.

Page 2: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

Rastrska grafika Vektorska grafika

Prednosti

- Gladki prehodi in detajli pri sliki (možnost senčenja, osvetljevanja manipulacije določenih območij slike)

- Enostavno tiskanje- Podpora v spletu- Enostavna popravljanje barv

- Kakovost slike pri transformaciji slik se ohranja

- Možnost spreminjanja posameznih delov slike

- Gladke krivulje- Majhne datoteke-

Pomanjkljivosti

- Zahteva precejšne količine delovnega pomnilnika

- Težja obdelava obsežnih bitnih slik

- Pri transformiranju slik se kvaliteta poslabša

- Ni naravnega videza slik- Težave pri tiskanju (zaradi

velike količine ukazov)

Ker je orodij za oblikovanje rastrske in vektorske grafike zelo veliko sem spodaj naštel le peščico najbolj poznanih.

Rastrska grafika Vektorska grafika

Prosto dostopna

GIMP InkscapeGNU Paint Synfig

Krita FontForgeMyPaint Skencil

Photoscape XfigPhotoFiltre FontForgeIrfanview Ajax Animator

Plačljiva

Adobe Photoshop Microsoft VisioAdobe Fireworks Adobe Illustrator

iPhoto SketchMicrosoft Paint Fatpaint

Photos Swift 3DXnView Serif DrawPlus

Zoner Photo Studio Vector Artist

Page 3: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

V spodnji tabeli pa je nekakšna primerjava med štirimi orodji, in sicer dve orodji sta namenjeni obdelavi rastrske grafike, dve pa obdelavi vektorske grafike.

GIMP Adobe Photoshop

Inkscape Microsoft Visio

Licenca GNU (prosto programje)

Trialware, Saas GNU (prosto programje)

Trialware

Vrsta grafike Rastrska Rastrska Vektorska VektorskaSlovenski jezik DA NE DA NELeto izdelave 1996 1990 2003 1992Najnovejša

verzija2.8.14 CC 2015.5 / 17.0 0.91 12.0

Cena brezplačen 10$ na mesec brezplačen ?Podpora

operacijskih sistemov

Windows, Mac OS X, Linux, BSD, Unix

Windows, Mac OS X

Windows, Mac OS X, Unix,

Linux

Windows

Formati

RAW imports, BMP, GIF, JPEG, JPEG 2000 PNG, PSD, PSP, XCF,

PCX

RAW imports, BMP, GIF, JPEG, HD Photo, PNG, TIFF, PSD, PCX

AI, PS, EPS, PDF, SVG, DXF, WMF,

EMF

AI, PS, EPS, DXF, WMF, EMF

Primeren za uporabo v

Šolstvu

DA NE DA NE

Page 4: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

GRAFIKA

Za izvedbo projektne naloge v osnovni šoli sem si izbral orodje Inkscape. Izbral sem ga zato ker je v slovenskem jeziku, je prosto dostopen, zelo preprost za inštalacijo (naloži se ga z uradne spletne strani https://inkscape.org/en/), glavna lastnost, ki me je prepričala za izbiro tega orodje, pa je njena uporabnost in preprostost. S orodjem Inkscape bodo učenci spoznali obdelavo vektorske grafike, to je izdelovanje raznih logotipov, različnih predmetov in objektov, ki jim lahko pridejo v pomoč v nadaljnjem življenju in sicer pri raznem oblikovanju logotipov, načrtih hiš in drugih stvari. Orodje Inkscape je zelo hitro naučljivi, k temu izdatno pripomorejo tudi razni izdelani tutorjali, ki uporabnike popeljejo od osnovnih funkcij pa vse do bolj zapletenih, ti tutorjali so tudi v obliki raznih posnetkov.

ETAPE UČNE AKTIVNOSTI UČITELJEVA VLOGA

UČENČEVA VLOGA

METODE DELA

1. POBUDA Osnovne zahteve:Vsak učenec

individualno izdela dva projekta v

programu Inkscape. Prvi izdelek naj izdela

po korakih že narejenega izdelka (to dobi pri uri na listu) ta izdelek naj nadgradi z

dvema komponentama.

Drugi projekt naj bo samostojno delo na temo živali (tu mora

uporabiti različne funkcije, ki jim jih je

učitelj predstavil)

Roki:Za izvedbo aktivnosti

sta predvideni dve šolski uri. V prvi šolski

uri učitelj predstavi vektorsko grafiko in funkcije programa

Inkscape. Nato sledi individualno delo

izvedba prvega projekta, to se izvaja

Predstavi vektorsko

grafiko in njeno uporabnost, ter opiše funkcije in

lastnosti programa

Inkscape. Nato pove navodila

za izvedbo projektov in

razdeli liste na katerih je rešen primer prvega projekta. Nato

učenci rešujejo, medtem pa jih

spodbuja in nudi pomoč.

Najprej pozorno

poslušajo razlago in navodila,

nato se lotijo izdelovanja projektov v programu Inkscape.

Raziskujejo nove funkcije

programa Inkscape.

Najprej frontalna,

nato pogovor in na koncu

individualno delo.

Page 5: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

do konca ure. V drugi šolski uri učenci

skončajo prvi projekt in se lotijo izdelave

drugega, na koncu se še predstavi projekte.

Merila ocenjevanja:Ocenjuje se le drugo projektno nalogo in sicer pri ocenjevanju se upošteva koliko funkcij je učenec

uporabil, kako zahtevne so

uporabljene funkcije, ali so smiselne,

inovativnost, lepota končnega izdelka.

2. SKICIRANJE OSNUTKA

Tema:Vektorska grafika,

orodje za oblikovanje vektorske grafike

Inkscape.

Operativni učni cilji:Učenci poznajo

osnovne funkcije programa Inkscape,

znajo slediti navodilom za izdelavo projekta v programu

Inkscape, znajo samostojno uporabiti program Inkscape za

izdelavo projekta.

Zastavi učne cilje, ki naj bi jih učenci dosegli.

Sledijo navodilom učitelja, če

imajo kakšno zamisel za izvedbo jo

izrazijo.

Individualna oblika dela.

3. NAČRTOVANJE IZPELJAVE

Posamezni koraki:1. Korak (20 min):

učitelj predstavi kaj je vektorska grafika, kej se jo uporablja, njene

prednosti in slabosti. Predstavi

tudi orodja namenjena

obdelavi vektorske

Dejavno in enakopravno sodelovanje.

Page 6: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

grafike. Nato pa podrobneje

predstavi program Inkscape (na

primeru, kakšne so njene funkcije, za kaj je uporaben in kaj bodo morali v

tem programu narediti.

2. Korak (25 min): učenci izdelajo prvi projekt po korakih (navodila na listu) in ta projekt tudi oplemenititi še z

dvema komponentama

programa Inkscape.

3. Korak (35 min): izdelava drugega projekta, ta korak

je najpomembnejši,

kajti za tega je potrebnega največ

znanja in inovativnosti, pa

tudi samostojnega dela. Učenec mora

sestaviti lasten projekt v programu

Inkscape in uporabiti veliko število funkcij

programa Inkscape, te

morajo biti tudi smiselno

uporabljene. Ta projekt bo bil na

koncu tudi ocenjen.

4. Korak: predstavitev projektov, tu

Page 7: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

pokomentira učiteljica in tudi

ostali učenci projekt.

4. IZPELJEVANJE

Predstavi vsem učencem vektorsko grafiko in program

Inkscape. Ko učenci izdelujejo

projektne naloge jim

pomaga, jih ne priganja in jim

omogoči, da vsi učenci osvojijo

učne cilje.

Posluša učiteljevo razlago in navodila. Izdeluje

projektne naloge, je

samostojen in odgovoren

5. VREDNOTENJE IN ZAKLJUČEK

Učenci predstavijo učitelju in svojim

sošolcem projekte, ki so jih naredili v

programu Inkscape. Ostali učenci povedo kaj je dobrega in kaj slabega, postavijo

kakšno vprašanje ter povedo kaj bi lahko še

izboljšal. Učenci izpolnijo ocenjevalni

listič.

Usmerja in vodi razpravo, ter na

podlagi videnega in

ocenjevalnih lističev oceni

učenčev projekt.

Poda svoje mnenje in

izpolni ocenjevalni

listič.

Ocenjevalni listič namenjen učencem:

0 točk 1 točka 2 točki

Privlačnost slike Popolnoma neprivlačno Delno privlačno Zelo privlačna

Izvedba predstavitve Slaba predstavitev

Zatika se mu pri razlaganju

uporabljenih funkcijah

Lepa tekoča predstavitev, zna

utemeljiti vse uporabljene funkcije

Page 8: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

Ocenjevalni listič namenjen učitelju:

0 točk 1 točka 2 točki

Uporabljene funkcije Uporaba do 2 funkcij Uporaba do 5 funkcij Uporaba več kot 5 funkcij

Smiselna uporaba funkcij Neprimerna uporaba Primerna uporaba le

nekaterih funkcijZelo smiselna

uporaba vseh funkcij

Izvirnost uporabljenih funkcij /

Uporabil funkcije, ki so uporabljene v prvem projektu

Uporabil še nove funkcije

Izvedba predstavitve Slaba predstavitevZatika se mu pri

razlaganju uporabljenih funcijah

Lepa tekoča predstavitev, zna

utemeljiti vse uporabljene funkcije

Page 9: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

REŠITEV IZDELAVE VEKTORSKE SLIKE PO KORAKIH

1. Korak: Izberemo si barvo, katero bomo uporabili za telo pingvina (spodaj na dnu je paleta barv) in nato naredimo pokončno elipso.

2. Korak: Za lepši izgled dodamo elipsi obrobo in učinek prelivanja barv. Rob naredimo tako, da držimo tipko »shift« in izberemo barvo roba, učinek prelivanja barv pa ustvarimo s pomočjo orodja »ustvari in urejaj prelive«.

Page 10: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

3. Korak: Ustvarimo še roke pingvina, to storimo ravno tako z izbiro barve in elipse. Ko je elipsa na pravem mestu jo postavimo v ozadje, to storimo s pomočjo orodja, ki je označeno na spodnji sliki.

4. Korak: Ustvarimo novo belo elipso, katera bo predstavljala bel trebuh pingvina. Nato

elipso postavimo na pravo mesto, da to storimo moramo najprej označiti pokončno elipso (prva elipsa) držati tipko »shift« in označiti še belo elipso. Nato s pomočjo orodja poravnaj in razporedi nastavimo primeren položaj elipse.

Page 11: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

5. Korak: Beli elipsi dodamo učinek prelivanja barv in rob, kot pri 2. koraku ter nato ustvarimo malo oranžno elipso, ki nam bo služila kot noga pingvina. To elipso oblikujemo tako, da ji po znanem postopku dodamo rob in prelivanje barv. Ko je elipsa ustvarjena po meri jo podvojimo, da dobimo še drugo nogo pingvina. To storimo tako, da držimo tipko »shift« in pritisnemo d. Sedaj le še postavimo elipsi na pravo mesto in ju postavimo v ozadje.

6. Korak: Ustvarimo še oči pingvina. Najprej ustvarimo dva enako velika bela kroga, ki bosta predstavljala beločnico nato pa še dva mala črna kroga. Krog ustvarimo, kot da bi ustvarjali elipso le, da pri ustvarjanju držimo še tipko »ctrl«.

Page 12: Web viewTi podatki povedo kakšne barve in intenzitete je posamezna slikovna pika. Ko sliko ... Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi

7. Korak: Za konec ustvarimo še pingvinov kljun. To storimo tako, da najprej ustvarimo kvadrat in potem ta kvadrat preoblikujemo v obliko kljuna z orodjem »uredi pot po vozliščih«. Nato še kljun postavimo na pravilni položaj.

8. Korak: Končni izdelek le še izvozimo kot PNG dokument.

Za še boljšo obrazložitev izdelave pingvina si lahko ogledate tudi video posnetek na youtubu, ki je sicer v angleškem jeziku, a je zelo sistematičen in te lepo vodi skozi celotno izdelavo. Povezava: posnetek.