H
istoria zaczê³a siê od Future-
Splash Animator w 1996 roku.
Program ten s³u¿y³ g³ównie do
prostych animacji wektorowych. Po-
tem by³ Flash, s³u¿¹cy do robienia
stron internetowych opartych na
grafice wektorowej. Przez kolejne
lata powsta³o wiele wersji (Flash 5,
Flash MX), ci¹gle wzbogacaj¹cych
siê o np. jêzyk skryptowy, umo¿li-
wiaj¹cy tworzenie gier. Technologia
Macromedia Flash jest niezwykle
rozwiniêta. Ostatni¹ wersj¹ jest
Flash MX 2004, której demo mo¿na
œci¹gn¹æ ze strony: http://www.ma-
cromedia.com/software/flash.
O co chodzi z t¹ grafik¹ wek-
torow¹? Ju¿ t³umaczê. Rozró¿niamy
dwa rodzaje grafiki komputerowej:
rastrow¹ (inaczej bitmapow¹) i we-
ktorow¹. Jak dzia³a grafika rastro-
wa, to ka¿dy siê domyœla. Ka¿demu
pikselowi obrazu przypisany jest
odpowiedni kolor i, podczas wy-
œwietlania, czytana jest informacja
o ka¿dym pikselu po kolei.
Skupmy siê na grafice wekto-
rowej. W tej technice zapisywane
s¹ dane o po³o¿eniu punktu A (jego
x i y), po³o¿eniu punktu B i informa-
cje (kszta³t, kolor, przejœcia itp.)
o krzywej poprowadzonej z A do B.
Gdy mamy zamkniêty obiekt (np.
kwadrat z informacj¹ o wierzcho³-
kach i kolorze jego obwiedni), mo-
¿emy go wype³niæ kolorem, gra-
dientem (tonalnym przejœciem
z jednego koloru do drugiego) lub
grafik¹ rastrow¹. Proste obiekty
wektorowe zajmuj¹ o wiele mniej
bajtów ni¿ bitmapy, ze wzglêdu na
zwiêz³oœæ informacji o grafice, ale
w przypadku zdjêæ, które maj¹ wie-
le szczegó³ów, trzeba wykorzystaæ
ju¿ grafikê rastrow¹.
Jak ju¿ wspomnia³em, Flash
opiera siê g³ównie na wektorach,
dlatego ³atwo jest panowaæ nad
ka¿dym kszta³tem stworzonym w
nim i robiæ p³ynne animacje ruchu
czy zmiany kszta³tu.
Jak powstaj¹ animacje?
Pierwszy sposób to modyfikacja za-
wartoœci ka¿dej klatki filmu osobno
(animowanie klatka po klatce), dru-
ga to wykorzystanie animacji uzu-
pe³nianej, po angielsku zwanej
tweening. Polega on na narysowa-
niu klatek kluczowych i zdefiniowa-
niu zachodz¹cych pomiêdzy nimi
przejœæ. Klatki poœrednie s¹ tworzo-
ne automatycznie przez program.
We Flashu najczêœciej tym przej-
œciem jest morfing, czyli przejœcie
jednego obiektu w drugi. Mo¿liwe
s¹ jeszcze przejœcia ruchu i kszta³tu.
Wszystkie modyfikacje s¹
wykonywane niezale¿nie, tak wiêc
obiekt mo¿e jednoczeœnie zmieniaæ
kolor (morphing), przemieszczaæ siê
i powiêkszaæ.
Dziêki stosowanemu we Fla-
shu wewnêtrznemu jêzykowi
skryptowemu, ActionScript, mo¿na
korzystaæ ze zmiennych, definiowaæ
bardziej skomplikowane kszta³ty
(dziêki macierzom nawet proste
obiekty 3D) i oczywiœcie dodawaæ
do naszej gry interaktywnoϾ.
Skrypty opieraj¹ siê na prostej za-
sadzie: je¿eli (w³aœnie za³adowano
animacjê / osi¹gniêto dan¹ klatkê
animacji / wciœniêto przycisk / naje-
chano mysz¹ na obiekt itd.), to wy-
konaj (skocz do klatki / przesuñ
obiekt / zmieñ wartoœæ zmiennej /
wy³¹cz animacjê /
skocz do adresu
URL innej strony
itd.). Mamy tu kon-
strukcjê znan¹ pro-
gramistom jako if...
lub if... else. W Ac-
tionScript mo¿emy
korzystaæ te¿ z pê-
tli, tablic i innych
elementów znanych
z innych jêzyków
programowania.
¯eby zobrazowaæ to, co na-
pisa³em, wyobraŸmy sobie, jak teo-
retycznie mo¿na by zrobiæ proœciut-
k¹ grê. Niestety na tutoriala mamy
zdecydowanie za ma³o miejsca.
Nasz gra bêdzie siê sk³adaæ
z kwadratu (g³ówny bohater, kon-
trolowany przez gracza), trójk¹ta
(cel – gracz bêdzie musia³ go zbie-
raæ) oraz kó³ek (przeciwnicy).
Grê bêdzie siê zaczyna³o od
œrodka, a pierwszy trójk¹cik bêdzie
przy prawym brzegu ekranu. Mniej
wiêcej na szerokoœci 33% i 66%
ekranu umieϾmy dwie kulki. Po-
cz¹tek ju¿ mamy.
Teraz trzeba wprowadziæ
ruch i interakcje. Gdy u¿ytkownik
wciœnie strza³kê w prawo, dodaj do
pozycji x kwadratu 5. W ten sposób
bêdzie widaæ, jak kwadrat przesu-
wa siê w prawo. Analogicznie trze-
ba zrobiæ z innymi kierunkami. Gdy
kwadrat zderzy siê z trójk¹tem, do-
dajemy 1 do liczby punktów gracza
i ustawiamy x trójk¹ta na 20. Dla
gracza bêdzie to wygl¹da³o jakby
zebra³ trójk¹t i pojawi³ siê nowy cel
po drugiej stronie ekranu.
Przeciwnikom ograniczmy
ruch do poruszania siê w pionie. Co
ka¿d¹ klatkê niech lec¹ w górê. Gdy
dotkn¹ sufitu (ich y<=0), niech
zmieni¹ kierunek i lec¹ w dó³. Ana-
logicznie, gdy waln¹ w pod³ogê.
Pozostaje jeszcze dopraco-
waæ kilka szczegó³ów (ewentualnie
dorobiæ kilka bajerów), zrobiæ menu
gry i listê wyników. To jest bardzo
ramowo opisany proces robienia
gry we Flashu. Je¿eli chcecie tuto-
riali, mêczcie o to naczelnego :)
Powsta³o wiele bardzo do-
brych gier flashowych. Oto dwie
moje ulubione:
M O T H E R L O A D
– http://www.xgenstudios.com/
play/motherload
TEKST
£ATWY
l
ll
ll
M
£ODY
TECHNIK
6/2005
9
92
2
Flash to technologia umo¿liwiaj¹ca tworzenie
interaktywnych, ca³kowicie animowanych
stron internetowych, filmów animowanych,
a nawet prostych gier.
Gry Flash
t e c b u g
G
G aa m
m ee ZZ oo nn ee
