Izdelava igrice v Scratchu

Izdelava igrice v Scratchu

Avtor: Dani Sajtl

Scratch

Scratch je programski jezik, ki je bil ustvarjen z namenom učenja programiranja. Leta 2007 so ga razvili sodelavci inštituta Media Lab na Tehnološkem inštitutu Massachusettsa, ZDA.

Razvojno okolje deluje v operacijskih sistemih Mac OS, Linux in Microsoft Windows.

Namenjen je predvsem otrokom od 10. do 16. leta starosti, saj program ne zahteva znanja programiranja. V njem se lahko izdeluje računalniške igre, animacije ... in se jih nato deli na spletu. Deluje na principu legokock. Uporabnik namesto pisanja kode z miško premika grafične bloke in jih sestavlja kot nekakšne sestavljanke.

(Scratch_prog_okno.jpg)
Programsko okno Scratcha

Več o Scratchu: http://scratch.mit.edu

V nadaljevanju predpostavljamo, da smo seznanjeni z osnovnimi idejami "programiranja" v programu Scratch.

Opis igrice "Kolo sreče"

Igrica "Kolo sreče" je zelo preprosta: S pritiskom na gumb Zavrti zavrtimo kolo, na katerem so območja z različnimi točkami. Igla nam označuje število točk, kjer se je kolo ustavilo. Na voljo imamo 5 zavrtljajev kolesa, cilj igre je zbrati čim več točk. Vse je odvisno od sreče, zato se igrica tudi imenuje "Kolo sreče".

(kolo_srece.jpg)
Igrica Kolo sreče

Priprava ozadja

Najprej si pripravimo ozadje v Urejevalniku slik. Kliknemo na Stage > Ozadja > Uredi in že smo v Urejevalniku slik, kjer narišemo npr. krožni preliv med dvema barvama. S klikom na Vredu shranimo ozadje.

(urejevalnik_slik_ozadje.jpg)
Ozadje igrice

Priprava kolesa

(narisi_novo_skupino_slik.jpg)

Kolo narišemo v urejevalniku slik (klik na ikono prikazano zgoraj) ali pa ga uvozimo iz datoteke. Kolo razdelimo na več območij, ki so različno točkovana. Enako točkovana območja pobarvamo z enako barvo. Lahko naredimo tudi več območij, kot je prikazano na spodnji sliki.

(urejevalnik_slik_kolo.jpg)
Kolo

Priprava igle

V urejevalniku slik narišemo iglo, ki bo označevala območje točk, kjer se bo kolo ustavilo.

(urejevalnik_slik_igla.jpg)
Igla

Priprava gumba Zavrti

Manjkata nam še dva elementa: gumb Zavrti in napis Konec. Oba elementa narišemo v Urejevalniku slik. Vaša domišljija naj bo vodilo h končni podobi.

(urejevalnik_slik_zavrti.jpg)
Gumb Zavrti

Priprava napisa Konec

(urejevalnik_slik_konec.jpg)
Napis Konec

Pripravljeni elementi

Tako, pripravili smo si vse grafične elemente, ki jih potrebujemo za našo igrico.

(pripravljeni_elementi.jpg)
Pripravljeni elementi

Skripti za kolo

Za kolo bomo napisali dve skripti.

Prva skripta nam s klikom na zeleno zastavico (začetek izvajanja programa) postavi kolo v vedno enak položaj (npr. 90 stopinj), v ozadju pa nam celo igrico igra melodija (v našem primeru je to Lucky v formatu mp3 dolžine 30 sekund, potem pa se ponovi).

(skripta_kolo1.jpg)
Prva skripta za kolo

Druga skripta pa je odgovorna za vrtenje kolesa. Skripta se zažene, ko prejme ukaz "ko prejmem vrtenje" od gumba Zavrti. Tukaj vpeljemo spremenljivko hitrost (definiramo jo samo za ta "sprite" - drugače bomo imeli probleme pri pisanju skripte za iglo), ki je ključna za število vrtljajev kolesa. Spremenljivko nastavimo na naključno vrednost med 15 in 35, ki nam predstavlja kot rotacije slike kolesa. Ker se mora kolo sčasoma ustaviti vpeljemo zanko, ki jo ponavljamo toliko časa dokler hitrost ne pade pod npr. 0,3, v vsakem koraku zanke pa hitrost zmanjšamo in zavrtimo sliko kolesa.

(skripta_kolo2.jpg)
Druga skripta za kolo (vrtenje kolesa)

Osnovna skripta za gumb Zavrti

Za skripto na gumbu Zavrti bomo potrebovali še dve spremenljivki: točke in preostali zavrtljaji (definiramo jo za vse "sprite"). Na začetku izvajanja programa gumb Zavrti pokažemo, nastavimo spremenljivko točke na 0, število preostalih zavrtjajev kolesa pa na 5. Če smo z miško nad gumbom Zavrti in takrat pritisnemo levi gumb na miški, zmanjšamo preostale zavrtljaje za 1 ter predvajamo vrtenje (skripta na kolesu - prejšnja stran) in predvajamo točke (skripta na igli - naslednja stran). Vse to imamo v zanki, ki jo ponavljamo dokler ni število preostalih zavrtljajev enako 0. Na koncu igrice gumb Zavrti skrijemo in končamo izvajanje programa.

(skripta_zavrti1.jpg)
Osnovna skripta za gumb Zavrti

Dopolnjena skripta za gumb Zavrti

Skripto na gumbu lahko še malo izboljšamo, če dodamo vizualni učinek na gumbu pri prehodu z miško čez gumb (v našem primeru duh). Učinek nam tudi nakaže, da takrat ne moremo klikati po gumbu Zavrti, ker se kolo še ni ustavilo.

(skripta_zavrti2.jpg)
Dopolnjena skripta za gumb Zavrti

Skripta za iglo

Skripta za iglo je namenjena seštevanju točk. Zahtevo za izvajanje sproži gumb Zavrti. Seštevanje točk poteka po principu dotika z barvo. Če se igla dotika zelene barve se spremenljivka točke poveča za 1000, če se igla dotika rumene barve se spremenljivka točke poveča za 500, itd.

(skripta_igla1.jpg)
Skripta za iglo

Skripta za animacijo igle

Za dosego večje realnosti igrice bomo še animirali iglo. Igla je v začetnem položaju obrnjena v smeri 135 stopinj (saj smo jo narisali vodoravno). Igla se bo z vrtenjem kolesa premikala za 15 stopinj gor in po zelo kratkem času nazaj v izhodiščni položaj. Takšni premiki si bodo sledili dokler hitrost ne bo padla pod 1, časovni razmik med posameznimi premiki igle pa naj bo naključen (med 0,05 in 0,3 sekunde).

(skripta_igla2.jpg)
Skripta za animacijo igle

Skripta za na konec

Na koncu igrice prikažemo še napis Konec. Z zagonom programa napis seveda skrijemo, prikažemo pa ga potem, ko prejmemo točke in je število preostalih zavrtjajev enako nič.

(skripta_konec.jpg)
Skripta za na konec

Prikaz delovanja igrice Kolo sreče

Zajemanje s programom Wink je bilo nastavljeno na 4 slike/s, zato je vrtenje kolesa malce sunkovito.

Igrico si lahko prenesete k sebi s klikom na spodnji gumb. Potrebujete nameščen program Scartch.

kolo_srece.sb

0%
0%