Rastrska in vektorska grafika

Prva tema je rastrska in vektorska grafika, ki je kot nalašč, da si nekoliko uredim blog. Tako bom v sklopu rastrske grafike izdelal naslovno sliko v programu Gimp, metem ko bom v sklopu vektorske grafike v programu Inkscape izdelal Gospoda Chrozillerja, ki bo naša maskota skozi celoten blog.

Veselo na delo!

Obdelava rastrske slike v programu gimp

Za lepši pogled na moj blog, sem se odločil, da izdelam naslovnico v programu Gimp, ki ga lahko brezplačno naložite tukaj. Sam sem sliko izdelal v različici 2.8 v angleškem jeziku.

Ko odpremo gimp, si moramo najprej ustvariti prazen list, ki ga ustvarimo tako, da kliknemo na zavihek File, da se nam odpre spustni seznam, nato pa kliknemo "New...". Odpre se nam spodnja slika.

Slika 1: Velikost lista

Mi bomo izbrali velikost 940x350 točk (pikslov), ker naj bi po občutku to bila primerna velikost za naslovnico mojega bloga.

Sedaj začnemo ustvarjati sliko. Najprej nastavimo neko ozadje, da se znebimo bele pustosti lista. To storimo tako, da kliknemo na zavihek, ki je na sliki 2 označen s številko 1, nato pa izberemo poljubno  ozadje. Mi smo izbrali ozadje, ki je na spodnji sliki označeno s številko 2. Na list ga prenesemo s preprostim potegom miške proti listu.

Slika 2: Dodajanje ozadja

Sedaj vstavimo nekaj slik, ki jih želimo imeti na naslovnici. Sam bom vstavil nekaj logotipov brskalnikov. Sliko vstavimo tako, da kliknemo na zavihek File in nato "Open...". Izberemo orodje imenovano škarje (Slika 3) in z njim izrežemo željeni del slike, kot vidimo na sliki 4.

Slika 3: Orodje škarje

Slika 4: Izrezovanje slike

Sliko izrežemo in jo prilepimo na naš list papirja. Ker želimo, da bi bil naš izrezek ločen od ozadja, je dobro, da ga postavimo na novo plast oz. "layer". To storimo tako, da desno zgoraj v okolju gimp kliknemo na razdelek "Layers" nato pa poiščemo naš prilepljen izrezek, desno kliknemo nanj in kliknemo na monost "New Layer...", kot prikazuje slika 5.

Slika 5: Dodajanje izrezka na novo plast

Če želimo naš izrezek pomanjšati to storimo z orodjem "Scale", ki ga vidimo na sliki 6 obkrožen z rdečo in kliknemo na izrezek. Odpre se nam mreža s katero izrezek pomanjšamo kot prikazuje slika 6.

Slika 6: Pomanjševanje izrezka

Podobno naredimo še z ostalimi logotipi, ki jih razporedimo po listu, tako da na koncu dobimo nekaj podobnega, kot nam prikazuje slika 7.

Slika 7: Postavitev logotipov

Sedaj bomo dodali še napis. To storimo tako, da izberemo orodje za pisanje (Slika 8).

Slika 8: Orodje za pisanje

Sam sem dodal napis "Spletni brskalniki", ki sem ga poljubno oblikoval, da je izgledal tako, tko je prikazano na sliki 9.

Slika 9: Dodajanje napisa

Ko napis dodamo, vidimo, da nekateri logotipi prekrivajo napis. To nam ni všeč, zato bomo to spremenili. To storimo tako, da kliknemo na napis z desnim klikom in nato Layer->Stack->Layer to top, kot prikazuje slika 10. In layer z napisom se postavi povsem v ospredje.

Slika 10: Postavljajnje napisa v ospredje

Sedaj je izdelek končan! Vse kar še potrebujemo je to, da sliko izvozimo. To storimo tako, da kliknemo File in potem "Export...". Odpre se nam okno prikazano na sliki 11. Sliko poimenujemo (označeno z 1), jo shranimo v želenem formatu (označeno z 2) in nazadnje izvozimo (označeno s 3).

Slika 11: Izvoz

Sedaj smo dokončno uspeli!!! Tukaj je končni izdelek!, ki že krasi tudi naslovnico mojega bloga.

Slika 12: Končni izdelek

Tukaj pa imate tudi povezavo do originalne fotografije v originalni velikosti.

Primer uporabe slike pri pouku

Sliko bi lahko pri pouku uporabili kot naslovnico za predstavitev teme o spetnih brskalnikih, denimo tako, kot sem jo jaz uporabil v tem blogu.

Drug način uporabe, ki pa bi bil še bolj koristen, pa je ta, da bi prikazali sliko učencem, ki bi prepoznavali logotipe posameznih internetnih brskalnikov. Da bi stvar mogoče še malce olajšali, pa bi lahko pod sliko napisali imena brskalnikov, ki bi jih učenci potem povezovali s posameznimi logotipi na sliki.

Izdelava vektorske slike v programu Inkscape

V slkopu vektorske grafike pa bomo izdelali maskoto tega bloga. Zato bi lahko ta podanaslov poimenovali tudi rojstvo Gospoda Chrozillerja. Gospod Chroziller je škrat, ki je sestavljen iz logotipov internetnih brskalnikov, po katerih je dobil tudi ime.

Gospoda Chrozillerja bom ustvaril v programu Inkscape, ki ga brezplačno lahko naložite tukaj. Sam sem delal v različici 0.48 v angleškem jeziku.

Pa začnimo!

Ko odpremo Inkscape imamo list že narejen. Tako lahko takoj pričnemo z risanjem. Za začetek bomo uvozili nekaj logotipov brskalnikov. To storimo tako, da odpremo zavihek File, kliknemo na "Import..." in izberemo fotografijo. 

Ker pa naj bi bilo to vektorsko risanje in da ne bomo goljufali, moramo logotip najprej vektorizirati. To storimo postopku na sliki 1. Path->Trace bitmap..., nato pa izberemo Colors (korak 3) in pritisnemo OK (korak 4), tako je slika vektorizirana.

Slika1: Vektorizacija slike

Sam sem vključil naslednje tri logotipe, ki so prikazani na sliki 2.

Slika 2: Izbrani logotipi

Nato sem vzel orodje za risanje krogov in elips (slika 3) in narisal krog, pri tem pa pritiskal tipko Ctrl, da je bil krog pravilen. Pobarval sem ga s prlibližno kožno barvo in ga uporabil kot glavo. 

Slika 3: Orodje za risanje krogov in elips

Logo Google Chroma sem uporabil kot oči, zato sem ga moral tudi podvojiti, logo Mozille Firefox sem uporabil kot nos, Logo Google chroma pa sem uporabil kot telo, zato sem ga tudi nekoliko raztegnil. Dobil sem podobo ki jo prikazuje slika 4.

Slika 5: Osnovna oblika

Z orodjem za prosto risanje (slika 6), sem narisal obrvi, kot vidimo na sliki 7.

Slika 6: Orodje za prosto risanje

Slika 7: Risanje obrvi

Na podoben način sem narisal tudi lase in oboje zapolnil s polnilom črne bave. Dobili smo izgled kakšrnega prikazuje slika 8.

Slika 8: Dokončani lasje in obrvi

Z orodjem za risanje krivulj (slika 9), sem na koncu narisal še usta, roke in noge, ter jih prav tako zapolnil s polnilom. 

Slika 9: Orodje za risanje krivulj

Tako!, pa smo končali našega Gospoda Chrozillerja. Sedaj ga moramo samo še izvoziti iz programa Inkscape, kar je sila preprosto. Kliknemo File->Export bitmap... in nato samo še potrdimo s klikom na gumb "Export". 

Gospod Chroziller je prvič javno predstavljen celemu svetu!

Slika 10: Gospod Chroziller se predstavi

Uporaba slike pri pouku

Kako pa bi Gospoda Chrozillerja uporabili pri pouku?
Gospod Chroziller je bil izdelan kot maskota in prav tako bi ga lahko uporabili tudi v šoli. Predvsem pri podajanju snovi o spletnih brskalnikih, lahko pa tudi kasneje. Gospod Chroziller bi bil predvsem dober motivator za mlajše učence, ki bi naredil zanimivo uro.