Kuvankäsittelyn jatkokurssi

Jatko-osassa mennään kuvankäsittelyssä pintaa syvemmälle. Neljännessä osiossa käsitellään webgrafiikan saloja.

Tämä on kuvankäsittelyn peruskurssin 4 osa, siirry tästä alkuun

Harjoitus 16: Painike

1. Luo uusi tyhjä pohja, jonka koko on 600x450 pikseliä.
2. Luo uusi taso ja nimeä se Reunaksi. Valitse työkalupakista Suorakulmainen valinta ja valitse työkaluasetuksesta Pyöristetyt kulmat kohta. Aseta Suorakulmaisen valinnan kooksi 200x70 pikseliä. Sädearvo on 15. Katso kuva alla.



3. Aseta edustaväriksi #3377ad ja taustaväriksi #4bb7f0. Maalaa valinta Ämpärityökalulla. Katso kuva alla.



4. Luo uusi taso ja nimeä se Taustaksi. Anna valikkokomento Valitse/Pienennä... ja paina OK.
5. Valitse työkalupakista Sekoitustyökalu ja värita valinta. Katso kuva alla.



6. Luo uusi taso ja nimeä se Ylälasiksi. Anna valikkokomento Suorakulmainen valinta. Tee valinta puolet painikkeesta. Katso kuva alla ja tee kuvan mukaiset säädöt.



7. Valitse työkalupakista Sekoitustyökalu ja vaihda liukuvärjäys valkoiseen joka on puoliksi läpinäkyvä. Väritä valinta. Katso kuva ala.



8. Luo uusi taso ja nimeä se Alalasiksi. Valitse työkalupakista Suorakulmainen valinta ja valitse alue kuvan mukaisesti. Maalaa valittu alue Ämpärityökalulla ja väritä valkoiseksi. Katso kuva alla.



9. Poista valinta antamalla valikkokomento Valitse/Ei mitään. Sumenna alaosa antamalla valikkokomento Suotimet/Sumenna/Gauss-sumennus. Anna kuvan mukaiset säädöt ja paina OK.



10. Tehdään varjostus. Aktivoi Reuna -taso. Anna valikkokomento Suotimet/Valo ja varjo/Varjo.... Anna kuvan mukaiset säädöt ja paina OK.



11. Aktivoi Alalasi -taso. Luodaan teksti painikkeeseen. Valitse työkalupakista Tekstityökalu ja kirjoita teksti. Muuta tekstin väriksi valkoinen.
12. Lisätään tekstiin varjostus. Anna valikkokomento Suotimet/Valo ja varjo/Varjo.... Anna kuvan mukaiset säädöt ja paina OK.



13. Nyt sen pitäisi näyttää tältä:

Animaatio

Animaatio tarkoittaa liikkuvaa kuvaa. Animaatioon tarvitaa vähintään kaksi kuvaa. Lyhyessä animaatiofilmissä voi olla tuhansia kuvia jossa kuvan vaihtumista ei huomata mikäli työ on tehty taidokkaasti ja huolellisesti.

Animaatiota käytettiin ennen paljon nettisivuilla koristeina, mainoksina, bannereina jne. Nykyään tilalle on tullut yleiseen käyttöön flash, mutta sitä ei käsitellä tässä.

Käsittelemme tässä animaation perusideaa. Harjoittelemme yksinkertaista animaationtekoa. Animaatiokuvan tiedostomuoto on .gif.

Harjoitus 18: Aaltoileva kuvio

Tämä on yksinkertainen ja helppo toteuttaa.

Kun luot animaatiota, huomioi kuvan koko. Mitä isompi animaatio, sitä raskaampaa sitä on pyörittää.

1. Luo uusi tyhjä pohja, 100x100 pikseliä.
2. Piirrä jokin kuvio Siveltimellä.



3. Anna valikkokomento Suotimet/Animaatio/Aallot. Anna kuvan mukaiset säädöt ja paina OK.



4. Animaatio ei "pyöri" Gimpissä, tallenna työ antamalla valikkokomento Tiedosto/Vie.... Nimeä työ animaatio.gif. Paina Vie.
5. Nyt pitäisi tulla alla oleva kuvan mukainen ikkuna. Anna kuvan mukaiset säädöt ja paina Vie.



6. Animaation voi katsella avaamalla kuva selaimeen.

Harjoitus 19: Banneri

Banneri tarkoittaa pientä mainoskylttiä. Tämä harjoitus on jonkin verrran haastavampi vrt. edellinen harjoitus.

1. Luo uusi tyhjä pohja 200x100 pikseliä. Väritä tausta mieleiseksi.
2. Aktivoi Taustakuva -taso ja paina hiiren 2 -painiketta ja valitse Kahdenna taso. Toista tämä vielä kerran jotta tasoja olisi yhteensä kolme (3). Nimeä ne järkevästi. Katso kuva alla.



3. Aktivoi päällimäisin taso eli 3. Kirjoita siihen Tekstityökalulla MAINOS.
4. Aktivoi alempi taso eli 2. Kirjoita siihen on.
5. Aktivoi alin taso eli 1. Kirjoita siihen Tämä.
6. Yhdistetään tasot ja tekstit. Katso onko tasot ja tekstitasot samalla tavalla kuin alla olevassa kuvassa, mikäli ei ole järjestä ne niin, että vastaavat kuvan tasolistan järjestystä.



7. Yhdistele tasot ja kuvat aktivoimalla päällimmäisin taso ja paina hiiren 2 -painiketta, valitse Yhdistä alas. Tee sama uudestaan kahden muun tekstitason kanssa.



8. Yhdistele huolellisesti, sillä jokaisessa kuvassa pitää olla yksi teksti, ei kaksi tai kolme. Katso kuva alla miten sen pitää olla.



9. Anna valikkokomento Tiedosto/Vie.... Tarkista että pääte on .gif. Paina Vie. Tee alla olevan kuvan mukaiset säädöt, huom millisekunti luku suurempi kuin edellisessä harjoituksessa. Paina Vie.



10. Katso animaatio selaimen kautta.