Politechnika Łódzka Wydział Elektrotechniki, Elektroniki, Informatyki i Automatyki Instytut Informatyki Stosowanej Studia Podyplomowe Grafika Komputerowa i Techniki Multimedialne PRACA DYPLOMOWA „Tworzenie gier komputerowych w technologii Flash” Paulina Roswag Opiekun pracy: Dr Joanna Sekulska-Nalewajko Łódź, marzec, 2013 r. Spis treści Wstęp.................................................................................................................................................. 2 1. Charakterystyka technologii Flash ............................................................................................. 3 1.1 Wady i zalety technologii Flash ............................................................................................... 3 1.2 Rys historyczny ........................................................................................................................ 4 1.3 Język programowania ActionScript ......................................................................................... 5 1.3.1 Podstawowe informacje i historia języka ActionScript.................................................... 5 1.3.2 Cechy i elementy ActionScript 3.0.................................................................................... 6 1.3.3 Części składowe języka ActionScript ............................................................................... 7 1.4 Prezentacja narzędzia Adobe Flash Professional CS5 ........................................................... 12 1.4.1. Prezentacja zawartości programu Adobe Flash Professional CS 5 ................................ 13 2. Gry komputerowe..................................................................................................................... 20 2.1 Historia gier komputerowych ................................................................................................. 20 2.2 Rodzaje gier komputerowych ................................................................................................. 27 2.2.1. Podział gier ze względu na sposób prezentacji .............................................................. 27 2.2.2 Podział gier ze względu na sprzęt, na którym są odtwarzane ......................................... 28 2.2.3 Podział gier ze względu na ich tematykę ........................................................................ 28 2.3 Etapy procesu tworzenia gier komputerowych ...................................................................... 29 2.4 Tworzenie gier komputerowych we Flashu ........................................................................... 31 3. Projekt gry komputerowej „Memory” .......................................................................................... 33 3.1 Opis gry .................................................................................................................................. 33 3.2 Scenariusz gry ........................................................................................................................ 33 3.3 Prezentacja zastosowanych metod ......................................................................................... 34 3.4 Wizualizacje gry „Memory” .................................................................................................. 41 Podsumowanie ................................................................................................................................. 44 Spis ilustracji .................................................................................................................................... 46 Bibliografia ...................................................................................................................................... 47 1 Wstęp Początki gier komputerowych można można szacować na połowę XX wieku. Od tego czasu ta dziedzina rozwija się dynamicznie, szczególnie w ciągu ostatnich kilkunastu lat. Gry komputerowe są dziś nieodłącznym elementem rozrywki i kultury masowej. Są różnorodne – technologicznie, tematycznie, sprzętowo – tak, aby zadowolić szerokie rzesze odbiorców. W 2012 roku wartość globalnego rynku gier można oszacować na blisko 70 mld dolarów, a analitycy prognozują jego dalszy wzrost na poziomie blisko 10% w skali roku. Nic więc dziwnego, że twórcy gier stale prześcigają się w pomysłach na ciekawe fabuły i technologicznie zaawansowanych rozwiązaniach. Przedłożona praca ma za zadanie zaprezentowanie problematyki tworzenia gier komputerowych ze szczególnym uwzględnieniem zastosowania technologii Flash. Rozprawa zbudowana jest z trzech zasadniczych części. W rozdziale pierwszym scharakteryzowana została technologia Flash. Możemy poznać jej rys historyczny, cechy i obszary zastosowań. W dalszej części zaprezentowany został język programowania ActionScript 3.0 oraz narzędzie Adobe Flash Professional CS5. Rozdział drugi opisuje zagadnienia związane z grami komputerowymi. Przedstawiona została tu historia gier komputerowych, ich typologia oraz charakterystyka. Scharakteryzowany został proces tworzenia gry komputerowej oraz zastosowanie technologii Flash na tym polu. Rozdział trzeci ma charakter empiryczny – stanowi teoretyczną interpretację praktycznego etapu pracy dyplomowej. Prezentuje on grę komputerową „Memory”, stworzoną przy wykorzystaniu technologii Flash. Znajdziemy tu prezentację założeń gry, jej scenariusza, mechaniki działania oraz wizualizacje. Szczegółowo opisany został zastosowany kod języka programowania ActionScript. 2 1. Charakterystyka technologii Flash Flash jest technologią służącą do tworzenia zaawansowanych animacji z wykorzystaniem klatek kluczowych, a następnie implementacji ich do języka programowania ActionScript, który nadaje im cech interaktywności1 1.1 Wady i zalety technologii Flash Technologia Flash ma wielu zwolenników, ale także liczną grupę przeciwników. Najważniejsze zalety Flash’a to: a. oparcie o grafikę wektorową, dzięki czemu można skalować obiekty bez utraty jakości obrazu, a pliki swf są mniejsze i szybciej się ładują, b. wykorzystywanie plików dźwiękowych i video, c. możliwość importowania map bitowych, d. możliwość tworzenia atrakcyjnych interaktywnych animacji, e. łatwa integracja z innymi technologiami internetowymi, f. powszechność wykorzystywania, g. prostota, łatwość nauczenia się opanowania technologii i narzędzi. Przeciwnicy technologii wskazują jednak na: a. zużywanie większych zasobów procesora przez strony internetowe we Flashu (w porównaniu z wersjami statycznymi), b. łamanie fundamentów Internetu, zgodnie z którymi funkcjonalności i użyteczność powinny dominować nad efektami wizualnymi, c. brak wspierania przez firmę Apple, d. brak wykorzystania w większości urządzeń mobilnych.999+ 1 Encyklopedia Zarządzania, http://mfiles.pl/pl/index.php/Technologia_FLASH 3 1.2 Rys historyczny Technologia flash została zaprojektowana i wdrożona przez niewielką FutureWave Software. Początkowo wydała program firmę SmartSketch – edytor grafiki wektorowej. Po niedługim czasie zadecydowano o dodaniu do programu funkcjonalności tworzenia animacji. Do powstania technologii przyczynił się także gwałtowny rozwój internetu, a w szczególności przeglądarki Netscape wraz z jej wtyczkami do wyświetlania multimedialnych treści. W maju 1995 roku FutureWawe Software wypuściła na rynek FutureSplash Animator – program do projektowanie animowanych stron internetowych. Technologia od razu została zauważona i szybko zastosowana przez wiele dużych i uznanych firm, m.in. Microsoft MNS, telewizję FOX, Wytwórnię W. Disneya. Ważnym punktem okazała się współpraca z firmą Macromedia, która stworzyła odtwarzacz do wyświetlania animacji. W jej wyniku firmy połączyły się, a w 1996 na rynek trafił Macromedia Flash 1.0. W ciągu następnych lat program był stale udoskonalany. Dynamiczny rozwój komputerów, wzrost ich wydajności oraz mocy obliczeniowej pozwalał na ciągłe dodawanie nowych funkcjonalności oraz zwiększanie złożoności programu. Ważnym punktem było dodanie w 2000 roku do wersji Macromedia Flash 5 języka programowania ActionScript służącego do obsługi zdarzeń, co pozwoliło na tworzenie interaktywnych animacji. W 2005 roku firma Macromedia została wykupiona przez koncern Adobe, co skutkowało wydaniem programu Adobe Flash CS3 Professional.2 Kolejne wersje programu Flash pojawiające się na rynku: Macromedia Flash 1.0 (1995) Macromedia Flash 2.0 (1997) Macromedia Flash 3.0 (1998) Macromedia Flash 4.0 (1999) Macromedia Flash 5.o (2000) Macromedia Flash MX (2002) Macromedia Flash MX 2004 (2003) Macromedia Flash MX Professional 2004 (2003) Macromedia Flash 8(2005) Macromedia Flash Professional 8 (2005) Adobe Flash CS3 Professional (2007) Adobe Flash CS4 Professional (2008) 2 http://offdesign.pl/historia.html 4 Adobe Flash CS5 Professional (2010) Adobe Flash CS5.5 Professional (2011) Adobe Flash CS6 Professional (2012) 1.3 Język programowania ActionScript 1.3.1 Podstawowe informacje i historia języka ActionScript ActionScript to obiektowy język programowania oparty na ECMAScript. Jest stosowany do realizacji funkcji interaktywnych, przetwarzania danych oraz różnorodnej innej funkcjonalności dla treści i aplikacji w środowiskach Flash, Flex i AIR. Kod programu w języku ActionScript wykonywany jest w maszynie wirtualnej ActionScript Virtual Machine (AVM). Kod ActionScript występuje zwykle w formacie kodu bajtowego osadzonego w plikach w formacie swf wykonywanych przez program Flash Player i środowisko AIR.3 ActionScript pojawił się w roku 2000, kiedy został zastosowany w programie Macromedia Flash 5. Został nazwany ActionScript 1.0. W kolejnej wersji programu język AS 1.0 został rozbudowany o dodatkowe funkcje i uzyskał lepszą programistyczną kontrolę nad klipami. W 2004 roku, wraz z pojawieniem się na rynku Macromedia Flash 7, wprowadzona została nowa wersja języka – ActionScript 2.0. Język zyskał dodatkowe funkcjonalności, takie jak typowanie sztywne, ścisłe typowanie danych, dziedziczenie, interfejsy i jawne deklaracje klas. Najnowszą wersją języka programowania aplikacji Flash jest ActionScript 3.0, wyróżniający się szybkością i wydajnością. W odróżnieniu do poprzedniej wersji w AS 3.0 wprowadzono nowe restrykcje dotyczące deklaracji zmiennych i funkcji, niemal wszystkie zdarzenia przełożono na tzw. obiekty nasłuchujące, pełniące role funkcji. Możemy wyróżnić zasadnicze funkcje najnowszej wersji języka – ActionScript 3.0, które stanowią jego udoskonalenia w porównaniu do wersji poprzednich:4 a. nowa, znacznie wydajniejsza maszyna wirtualna ActionScript Virtual Machine (AVM2), w której stosowany jest nowy zestaw instrukcji kodu bajtowego, b. unowocześniona baza kodu kompilatora, zapewniająca lepszą optymalizację, 3 4 „Poznajemy język ACTIONSCRIPT® 3.0”; Adobe tamże 5 a. nowy - rozbudowany i udoskonalony interfejs programowania aplikacji, który pozwala na sterowanie obiektami na niskim poziomie i oferuje obiektowy model programowania, b. interfejs API XML oparty na ECMAScript for XML, c. model zdarzeń oparty na specyfikacji Document Object Model (DOM) Level 3 Events Specification. 1.3.2 Cechy i elementy ActionScript 3.0 Wśród podstawowych cech i elementów języka ActionScript 3.0 wyróżnić możemy: 5 a. Wyjątki w czasie wykonywania - odzwierciedlające modelowe błędy i ułatwiając proces debugowania oraz pozwalające tworzenie aplikacji, które niezawodnie obsługują wszelkie błędy; b. Obsługa typów w czasie wykonywania – wykorzystywana do poprawy bezpieczeństwa typów systemowych, do tworzenia reprezentacji zmiennych w rodzimej formie maszynowej, w celu szybszego wykonywania kodu i ograniczenia zużycia pamięci; c. Klasy zapieczętowane - wiążą się z brakiem możliwości zmiany klasy w czasie wykonywania, co przekłada się na dokładniejsze sprawdzenie czasu kompilacji i niezawodność programów. d. Zamknięcia metod – służące do automatycznego zapamiętywania, do której instancji obiektu pierwotnie należały, co jest niezwykle istotne w przypadku obsługi zdarzeń; e. ECMAScript for XML (E4X) - specyfikacja ujęta w standardzie ECMA-357 zaimplementowana do języka ActionScript 3.0, zawierająca zestaw prostych i użytecznych elementów języka służących do sterowania kodem XML; f. Wyrażenia regularne - ułatwiające szybkie przeszukiwanie ciągów znaków i zarządzanie nimi; g. Przestrzenie nazw – pełniące role niestandardowych specyfikatorów dostępu, ich nazwy mogą być dowolnie nadawane przez programistę; 5 Poznajemy język ACTIONSCRIPT® 3.0; Adobe 6 h. Nowe typy pierwotne - Number (reprezentujące liczby zmiennoprzecinkowe o podwójnej precyzji), int (reprezentujące 32-bitowe liczby całkowite ze znakiem, dzięki czemu można szybciej realizować obliczenia na poziomie procesora) oraz uint (reprezentujące 32-bitowe liczby całkowite bez znaku, wykorzystywane w przypadku wartości kolorów RGB czy liczników bajtów). 1.3.3 Części składowe języka ActionScript Istotą języka ActionScript i jego zasadniczymi elementami składowymi są obiekty. Stąd też jego główne określenie jako obiektowy język programowania. Obiektami są wszystkie zadeklarowane zmienne, zapisane funkcje oraz utworzone instancje klas. Stąd też język ActionScript można opisywać jako zbiór obiektów, które realizują określone zadania, reagują na zdarzenia oraz komunikują się wzajemnie. Analizując składnię języka ActionScript możemy wyróżnić następujące elementy: 1.3.3.1 Obiekty i klasy W języku ActionScript wszystkie występujące obiekty są definiowane przez klasy, zawierające zmienne lub stałe przechowujące wartości danych lub metody będące funkcjami. ActionScript posiada wbudowane klasy, które stanowią jego integralną część – np. Boolean, String, Array. Występują także klasy, które mogą być definiowane przez programistę za pomocą słowa kluczowego „class”. Wartości klas można określać za pomocą słów: „const” (dla wartości stałych), „var” (dla wartości zmiennych) oraz „get” i „set” (dla wartości pobierających i ustawiających). Metody określane są operatorem „function”, natomiast do tworzenia instancji klas wykorzystuje się słowo kluczowe „new”.6 1.3.3.2 Pakiety i przestrzenie nazw Pakiety wiążą definicje klas, tak by ulepszyć współużytkowanie kodu i jednocześnie minimalizować konflikty nazw. Pozwalają także na porządkowanie plików klas. Dzięki przestrzeniom nazw możemy sterować widocznością poszczególnych metod i Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7ffe.html 6 7 właściwości. Pakiety są implementowane z wykorzystaniem przestrzeni nazw, nie są jednak tożsame z nimi.7 1.3.3.3 Zmienne Zmienne służą do przechowywania używanych wartości. Deklaruje się je za pomocą instrukcji „var” zestawionej z nazwą danej zmiennej. Cechą charakterystyczna zmiennych jest ich zasięg, rozumiany jako obszar kodu, w którym można leksykalnie odwoływać się do danej zmiennej. W związku z tym możemy wyróżnić 2 rodzaje zmiennych – globalne (zdefiniowane we wszystkich obszarach kodu) oraz lokalne (zdefiniowane dla pojedynczego fragmentu kodu).8 1.3.3.4 Typy danych Typ danych to pojęcie określające zbiór wartości. Możemy wyróżnić pierwotne typy danych (Boolean, int, Null, Number, String, uint oraz void) oraz złożone (Object, Array, Data, Error, Function, RegExp, XML oraz XMLList). Poniżej zostały krótko scharakteryzowane wybrane typy danych: Typ danych Boolean – może przyjmować tylko jedna z dwóch wartości: true albo false. Typ danych int – jest reprezentowany przez 32-bitowe liczby całkowite z zakresu od -2 147 483 648 (-231) do 2 147 483 647 (231-1). Jego wartość domyślna to 0. Typ danych Null – zawiera jedna wartość domyślną – null. Typ danych Number – stosowany do całkowitych liczb, które nie mieszczą się w zakresie typów int i unit oraz do liczb zmiennopozycyjnych. Zapisywane są w formacie 64-bitowym o podwójnej precyzji. Typ danych String – wyrażony ciągiem 16-bitowych znaków przechowywanych w formacie Unicode UTF-16. Typ danych uint – reprezentowany przez 32-bitowe nieujemne liczby całkowite z zakresu 0 – 4 293 967 295 (232 – 1). Jest stosowany do zapisu wartości kolorów pikseli. Typ danych void – może zawierać jedynie wartość undefined. Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7ffd.html 8 Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7ff8.html 7 8 Typ danych Object – jest definiowany przez klasę Object, pełniącą rolę bazowej klasy dla wszystkich pozostałych definicji klas w ActionScript. Typ danych Array – reprezentowany przez łańcuch elementów tablicowych. Typ danych Date – wyrażony przez ciąg znaków definiujący wartości obiektu Date.9 1.3.3.5 Składnia Składnia jest rozumiana jako zbiór reguł, które należy przestrzegać, tworząc kod programu. Dla języka ActionScript istotne istotne są zasady określające poniższe obszary: Rozróżnianie małych i wielkich liter – wielkość liter jest kryterium rozróżniającym identyfikator, te które różnią się jedynie wielkością liter uważane są za różne; Składnia z kropką – pozwala na dostęp do metod i właściwości obiektów oraz klas; Składnia z ukośnikiem – nie jest obsługiwana w języku ActionScript 3.0; Literały – wartości literalne zapisane bezpośrednio w kodzie programu. Mogą być grupowane, tworząc literały złożone (np. literały tablicowe); Średniki – znaki umieszczane na końcu każdej instrukcji; Nawiasy – pozwalają na zmianę kolejności wykonywania operacji w danym wyrażeniu, używane łącznie z operatorem przecinka określają wartość szeregu wyrażeń i oddaja wynik ostatniego wyrażenia oraz pozwalają przekazać parametry do funkcji lub metody. Komentarze – występują w dwóch wersjach: jednowierszowe (rozpoczynające się od „//”) oraz wielowierszowe (rozpoczynające się od „*/”) Słowa kluczowe i zastrzeżone – nie mogą być stosowane jako identyfikatory w kodzie, ponieważ są zastrzeżone prze środowisko ActionScript. Zastrzeżonymi słowami są: as, break, case, catch, class, const, continue, default, delete, do, else, extends, false, finally, for, function, if, implements, import, in, instance of, interface, internal, is, native, new, null, pacage, private, protected, public, return, super, switch, this, throw, to, true, try, typeof, use, var, void, while, na. Występują także słowa kluczowe składni, które mogą być stosowane jako identyfikatory, ale Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7ff5.html 9 9 maja przypisane specjalne znaczenie w określonych kontekstach, np. each, get, set, namespace, include, dymnic, final, native, override, static. Rozróżniamy także trzecią grupę – słowa zastrzeżone na przyszłość – określające identyfikatory nie zastrzeżone faktycznie dla ActionScript 3 ale mogą uzyskać status słów kluczowych w kolejnych wersjach. Tu możemy wymienić: abstract, boolean, byte, cast, char, debugger, double, enum, export, float, goto, intrinsizec, long, prototype, shot, synchronized, throws, to transient, type, virtual, volatile. Stałe – wartości o stałej wartości, której nie można zmienić, określane za pomocą instrukcji const.10 1.3.3.6 Operatory Operatory są to funkcje, które operują operandami (wyrażonymi przez literały, zmienne lub wyrażenia) i zwracają ich wartość. Możemy wyróżnić następujące typy operatorów: Operatory podstawowe – używane do tworzenia literałów takich jak Array czy Object, wywoływania określonych funkcji, tworzenia instancji klas, odwoływania się do właściwości oraz grupowania wyrażeń (np. ‘( )’, ‘[ ]’, ‘f(x)’, ‘new’). Operatory przyrostkowe – ich cechą charakterystyczna jest posiadanie tylko jednego operanda oraz inkrementacja lub dekrementacja jego wartości (‘++’, ‘—‘) Operatory jednoargumentowe – maja tylko jeden operand (np. ‘!’, ‘~’, ‘delete’, ‘void’). Operatory multiplikatywne – mają dwa operandy; mogą wykonywać mnożenie, dzielenie lub obliczać resztę z dzielenia (‘*’, ‘/’, ‘%’) Operatory addytywne – mają dwa operandy, mogą wykonywać działanie dodawania lub odejmowania (‘+’, ‘-‘), Operatory przesunięcia bitowego – mają dwa operandy, bity pierwszego operandu są przesuwane o liczbę pozycji, którą definiuje drugi operand (‘<<’, ‘>>’, ‘>>>’ Operatory relacyjne – mają dwa operandy, porównują ich wartość i zwracają wartość Boolean (np. ‘>’, ‘as’, ‘in’, ‘<=’) Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7fe4.html 10 10 Operatory równości – mają dwa operandy, porównują ich wartość i zwracają wartość Boolean (np. ‘==”, ‘!=’, ‘===’) Bitowe operatory logiczne – mają dwa operandy, wykonują logiczne operacje na poziomie bitów (np. ‘&’, ‘^’) Operatory logiczne – mają dwa operandy, zwracają tylko wartość Boolean (np. ‘&&’) Operator warunkowy – posiada trzy operandy, jest skróconą formą instrukcji warunkowej ‘if…else’ (‘?:’), Operatory przypisania – mają dwa operandy, jednemu z nich przypisują wartość drugiego (np. ‘*=’, ‘+=’, ‘%=’).11 1.3.3.7 Instrukcje warunkowe W ActionScripcie możemy wyróżnić trzy odmiany instrukcji warunkowych, które wykorzystywane są do sterowania programem: if…else – instrukcja polegająca na sprawdzeniu założonego warunku i wykonanie określonego fragmentu kodu, jeśli warunek został spełniony lub alternatywnego fragmentu kodu, jeśli założony warunek nie został zrealizowany, if…else if – instrukcja, która pozwala na sprawdzenie spełnienia więcej niż jednego warunku i uzależnia od tego wykonanie dalszego fragmentu kodu, switch – instrukcja warunkowa stosowana w przypadku, gdy istnieje kilka możliwych wariantów wykonywania, a wybór jest uzależniony od tego samego parametru; nie sprawdza wartości logicznej warunku, oblicza natomiast wartość wyrażenia i na podstawie wyniku, decyduje, który fragment kodu wykonać.12 1.3.3.8 Pętle Pętle są to instrukcje, które pozwalają na wielokrotne wykonywanie określonego bloku kodu z różniącymi się wartościami lub zmiennymi. W języku ActionScript możemy wyróżnić pięć rodzajów pętli: Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7fda.html 12 Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7fcc.html 11 11 pętla for – daje możliwość iteracyjnej zmiany wartości zmiennej w określonym przedziale wartości, określa trzy wyrażenia: zmienną z określoną wartością początkową, instrukcję warunkową, wyznaczającą zakończenie pętli oraz wyrażenia, które zmienia wartość zmiennej we wszystkich iteracjach, pętla for…in – pozwala iteracyjnie przeglądać właściwości obiektów i elementy tablic, pętla for each…in – umożliwia iteracyjny przegląd wszystkich elementów kolekcji będących znacznikami w obiekcie XML lub XMLList, wartościami zdefiniowanymi we właściwościach obiektów lub elementami tablicy, pętla while – jej działanie można opisać jak wykonywanie instrukcji if, tak długo, jak długo spełniany jest założony warunek, jej wadą jest zwiększone ryzyko niezamierzonego zbudowania pętli nieskończonej, która będzie wykonywana bez ustanku, pętla do…while – jest odmianą pętli while, w której określony fragment kodu zostanie wykonany co najmniej raz, ponieważ spełnienie warunku jest sprawdzane, po jego wykonaniu.13 1.3.3.9 Funkcje Funkcje są to fragmenty, bloki kodu, które realizują określone zadania. W języku ActionScript możemy wyróżnić dwa rodzaje funkcji – metody (funkcje zdefiniowane w ramach definicji klasy lub powiązane z instancjami obiektów) oraz zamknięcia funkcji (funkcje zdefiniowane w pozostałych przypadkach). 1.4 Prezentacja narzędzia Adobe Flash Professional CS5 Platforma Adobe Flash Professional CS5 to wszechstronne narzędzie służące do tworzenia animacji w oparciu o grafikę wektorową. Powstałe interaktywne elementy mogą być wykorzystywane między innymi w grach komputerowych, banerach i innych reklamach internetowych, multimedialnych stronach www, multimedialnych prezentacjach, odtwarzaczach. Pozwala na wykorzystywanie różnorodnych formatów i rodzajów materiałów – grafiki rastrowej, grafiki wektorowej, muzyki, filmów, itd. Możemy wyróżnić następujące etapy tworzenia aplikacji Flash w Adobe Flash:14 Poznajemy język ACTIONSCRIPT® 3.0; Adobe; http://help.adobe.com/pl_PL/as3/learn/WSf00ab63af761f1702761490412937d6fc9b7fc8.html 13 12 a. Zaplanowanie aplikacji – ustalenie jakie podstawowe zadania będzie wykonywała aplikacja, b. Dodanie elementów multimedialnych – tworzenie w Adobe Flash lub importowanie zewnętrznych multimediów (np. grafiki, pliki video, dźwięk, tekst, video), c. Rozmieszczenie elementów – rozłożenie elementów na stole montażowym oraz na osi czas, co pozwala na określenie czasu i miejsca występowania elementów medialnych w aplikacji, d. Zastosowanie efektów specjalnych – dodanie filtrów graficznych, przejść, animacji i innych efektów, e. Zapisanie kodu ActionScript – dodanie kodu ActionScript w celu sterowania elementami multimedialnymi i działaniami aplikacji, za pomocą różnych działań użytkownika. f. Testowanie i publikowanie aplikacji – wygenerowanie pliku FLA, sprawdzanie poprawności jego działania , wykrycie oraz naprawa ewentualnych błędów. 1.4.1. Prezentacja zawartości programu Adobe Flash Professional CS 5 Podstawowe okno programu Adobe Flash Professional CS 5 podzielone jest na kilka sekcji. Poniższa grafika Rysunek 1 prezentuje układ standardowy, ale każdy użytkownik może dopasować rozmieszczenie większości elementów zgodnie ze swoimi preferencjami. W górnym obszarze znajdziemy Menu, po lewej stronie przybornik, a po prawej panele, takie jak Właściwości czy Biblioteka. W centralnej części na dominującej przestrzeni znajduje się obszar roboczy ze stołem montażowym. Poniżej mamy panele prezentujące listwę czasową oraz w ukrytych fiszkach Informacje wyjściowe, Błędy kompilacji, Edytor ruchu oraz Operacje, do zapisywania kodu języka programowania ActionScript. 14 Korzystanie z programu Adobe Flash Professional CS5 i CS5.5; Adobe 13 Rysunek 1. Wizualizacja okna programu Adobe Flash Professional CS5. Źródło: Opracowanie własne. 1.4.1.1 Menu Rysunek 2. Menu programu Adobe Flash Professional CS5. Źródło: Opracowanie własne. Główne menu programu Adobe Flash Professional CS 5 zbudowane jest z 10 elementów (Rys. 2): a. Plik – pozwala na otwieranie i zapisywanie plików, umożliwia importowanie i eksportowanie obiektów, pozwala ma publikowanie plików oraz określanie ich opcji i ustawień, b. Edytuj – pozwala na edytowanie obiektów i poszczególnych klatek listwy czasowej, c. Widok – daje możliwość ustawienia elementów pola pracy, takich jak zmiany rozmiarów, ustawianie linijek, zmiany trybów podglądu czy wstawianie linii pomocniczych, d. Wstaw – pozwala na wstawianie symbolów, klatek oraz animacji, 14 e. Modyfikuj – pozwala na nadawanie modyfikacji w obszarze warstw, obiektów, scen oraz całego pliku, f. Tekst – służy do akapitowego i znakowego formatowania tekstów, g. Polecenia – pozwala na zarządzanie poleceniami, h. Sterowanie – daje możliwość testowania animacji, pozwala na jej uruchamianie i zatrzymywanie, i. Debuguj – służy do redukcji błędów w dokumencie, j. Okno – pozwala na włączania i wyłączanie wybranych paneli, k. Pomoc – pomoc oraz wskazówki dla użytkowników. 1.4.1.2 Pasek narzędzi Pasek narzędzi zawiera przybory wykorzystywane do rysowania, pisania, modyfikacji obiektami. Znajdziemy tu dużo narzędzi graficznych m.in. do rysowania krzywych Beziera, rozmaite pędzle czy narzędzie do obrotów i transformacji 3D (Rys. 3). Możemy ustawić kolory linii i wypełnienia rysowanych obiektów. Pasek zawiera także narzędzie „kość’, które służy do kinematyki odwrotnej, czyli metody animowania obiektów przy użyciu kości połączonych ze szkieletami. Poruszając jedną kością poruszamy jednocześnie wszystkimi połączonymi z nią kośćmi. Daje efekt przypominający naturalne ruchy. Rysunek 3 Pasek narzędzi programu Adobe Flash Professional CS5. Źródło: Opracowanie własne. 1.4.1.3 Stół montażowy Stół montażowy, inaczej pole pracy, to prostokątny obszar, w którym tworzone i modyfikowane są obiekty (Rys. 4). Jest używany w środowisku projektowym. Ustawiając parametry stołu montażowego można decydować o takich opcjach, jak ilość klatek wyświetlanych na sekundę, rozmiar czy kolor tła. 15 Rysunek 4. Stół montażowy. Źródło: Opracowanie własne. 1.4.1.4 Panele Panele to okna dokowane zlokalizowane po prawej stronie ekranu oraz pod obszarem roboczym. Są otwarte na stałe. Bardzo użyteczna jest możliwość indywidualnego ustawiania paneli, tak, aby były jak najbardziej użyteczne dla użytkowników. W Adobe Flash Professional CS5 możemy wyróżnić wiele paneli, odpowiadających różnym funkcjom. Wśród najważniejszych możemy wskazać: a. Właściwości – to panel zmienny w zależności od zaznaczonego obiektu. Pozwala na zmianę parametrów stołu montażowego, pola tekstowego, obiektów oraz symboli (grafik, przycisków i klipów). b. Biblioteka – to panel prezentujący zbiór wszystkich występujących w projekcie obiektów, takich jak grafiki, przyciski, klipy, dźwięki (Rys. 5). Biblioteka umożliwia wielokrotne używanie w projekcie znajdujących się w niej obiektów. Pozwala na grupowanie elementów w foldery czy sortowanie ich według typów plików. Wszystkie obiekty w bibliotece reprezentowane są przez ikony dopasowane do rodzaju pliku. 16 Rysunek 5. Panel Biblioteka. Źródło: Opracowanie własne. c. Oś czasu – to panel składający się z dwóch części – okna warstw, gdzie znajduje się lista warstw, na których umieszczane zostają poszczególne elementy całego projektu i listwy czasowej, dzięki której można wypełniać klatki i sterować nimi, wstawiać animacje i regulować ich położenie i czas trwania (Rys. 6). Rysunek 6. Oś czasu programu Adobe Flash Professional CS5. Źródło: Opracowanie własne. d. Operacje – panel, za pomocą którego można definiować akcje za pomocą kodu języka programowania ActionScript (Rys. 7). W panel wbudowana jest listwa z automatyczną numeracją linijek kodu. 17 Rysunek 7. Panel Operacje – Klatka. Źródło: Opracowanie własne. W Adobe Flash Professional CS5 możemy włączyć także inne panele – np. historia, ciągi, usługi web service, edytor ruchu czy błędy kompilacji. 1.4.1.5 Symbole Symbole to bardzo istotne obiekty wykorzystywane w środowisku Adobe Flash. Mają wiele cennych zalet – mogą być używana w projekcie wielokrotnie, zmniejszają rozmiar finalnego pliku, zwiększają elastyczność pracy. Możemy wyróżnić trzy rodzaje symboli:15 a. Klipy filmowe – wykorzystywane do tworzenia animacji niezależnych od listwy czasowej głównej sceny. Klipy filmowe mogą zawierać dźwięki, kod ActionScript oraz inne symbole. Klip filmowy jest odtwarzany, jeśli zostanie umieszczony w co najmniej jednej klatce listwy czasowej głównej sceny. b. Grafiki – stosuje się je w przypadku statycznych plików graficznych, które wielokrotnie pojawiają się w różnych miejscach projektu. Przyciski – interaktywne obiekty, c. które podlegają interakcjom z użytkownikiem za pośrednictwem myszy komputerowej. Każdy przycisk posiada własną listwę czasową, która składa się z czterech klatek, a każda z nich określa odrębny stan (Rys. 8): Up – wskaźnik myszy znajduje się poza obszarem symbolu, Over – wskaźnik myszy znajduje się nad symbolem, Down – przycisk został kliknięty, Hit – obszar obsługi kliknięcia. F. Gerantabee „Flash CS3 PL Multimedialny trener”; Wydawnictwo Helion; Warszawa; 2009; str. 138-139 15 18 Rysunek 8. Przycisk - stół montażowy i listwa czasowa. Źródło: Opracowanie własne. 19 2. Gry komputerowe Gry komputerowe to „programy komputerowe, których użytkowanie polega na rozwiązywaniu zadania logicznego (gry komputerowe strategiczne) lub zręcznościowego (gry komputerowe zręcznościowe), służące do celów rozrywkowych, także edukacyjnych (gry komputerowe edukacyjne).”16 2.1 Historia gier komputerowych Początki rozwoju gier komputerowych przypadają na lata 40. XX wieku. Pierwsza gra komputerowa o nazwie „Cathode- Ray Tube Amusement Device” została stworzona przez Thomasa T. Goldsmitha Jr. i Estle Raya Manna. Był to analogowy symulator wystrzału i nakierowania pocisku rakietowego w określony cel. Sterowanie odbywało się za pomocą specjalnych gałek zmieniających kąt wystrzału oraz prędkość pocisku. W grudniu 1948 roku Amerykańskie Biuro Patentowe przyznało grze patent o numerze identyfikacyjnym 2455992, tym samym formalnie rozpoczynając historię gier komputerowych. Kolejnym krokiem w rozwoju gier komputerowym był rok 1952, kiedy Alexander Douglas, młody doktorant Uniwersytetu w Cambridge, stworzył pierwszą graficzną grę komputerową opartą na popularnej zabawie logicznej „kółko czy krzyżyk”.17 W 1958 roku William Higinbotham, specjalista od broni nuklearnej, napisał „Tennis for Two”. Gra wyświetlana była na oscyloskopie, który stał się tu odpowiednikiem monitora komputerowego (Rys. 9). „Tennis for Two” prezentował uproszczony widok kortu tenisowego widzianego z boku. Gra sterowało się za pośrednictwem dwóch kontrolerów regulujących trajektorię lotu piłki tenisowej oraz wywołujących uderzenie. (dawno temu w grach) 16 Internetowa Encyklopedia PWN, http://encyklopedia.pwn.pl/haslo.php?id=3908365 Serwis Dziennikarstwa Obywatelskiego, http://www.artykul.com.pl/historia-gierkomputerowych/ 17 20 Rysunek 9 Gra "Tenis for two" Źródło: http://blogi.newsweek.pl/Tekst/historia/525721,Zapomniec-los-alamos.html W historii gier komputerowych zaznaczyć należy rok 1961, kiedy to grupa studentów z Massachusetts Institute of Technology na czele z Stevem Russellem stworzyła „Spacewar” – pierwszą grę komputerową, która została udostępniona dla szerokiego grona użytkowników. Gra była w pełni interaktywna. Jej „bohaterami” były dwa walczące ze sobą statki kosmiczne – w kształcie igły i klinu – znajdujące się w przestrzeni kosmicznej (Rys. 10). Gracze mogli obracać statkami, poruszać nimi, strzelać torpedami w przeciwnika (aby go wyeliminować z gry) oraz wyrzucać statek w losowy punkt kosmosu. Gra zyskała dużą popularność, ponieważ jej twórcy udostępniali ją na zasadzie public domain, a firma Digital Equipment Corporation, producent komputera PDP-1, na którym stworzono „Spacewar!” dołączała grę do każdego nowego zakupionego egzemplarza ich komputera.18 Rysunek 10 Gra "Speaceware!" Źródło: http://www.komputerswiat.pl/nowosci/gry/2012/06/pierwsza-gra-komputerowaobchodzi-50-urodziny.aspx B. Klusek, “Dawno temu w grach. Czas Pionierów. Szkice z historii gier komputerowych”; Inicjatywa wydawnicza Orka, Łódź, 2008, str. 13-14 18 21 W latach 60-tych rozwój gier spowolnił się. Główną przyczyną był tu ograniczony dostęp do komputerów, skupiający się przede wszystkim w ośrodkach akademickich. Przełom przyszedł w 1972 roku, kiedy to nastała „era automatów”. Wtedy Nolan Bushnell, Ted Dabney i Larry Bryan inwestując każdy po 100 $ założyli firmę Atari i wypuścili na rynek automat z grą komputerową „Pong” (Rys. 11). Gra polegała na przesuwaniu po ekranie kreski (odpowiadającej paletce), w taki sposób, aby odbijać kwadrat (reprezentujący piłkę). Po raz pierwszy wprowadzała tryby gry dla pojedynczego (rywalizującego z komputerem) oraz dwóch graczy. „Pong”, który sprzedał się w nakładzie 19 000 egzemplarzy, okazał się pierwszym sukcesem komercyjnym w dziedzinie gier komputerowych i spowodował narodziny przemysłu gier growego.19 Rysunek 11 Automat firmy Atari do gry "Pong" Źródło: http://www.techonomic.com/diamond-jubilee-technology-present/ Dwa lata później Atari (ukryta pod nazwą Kee Games) wydał automat z grą Tank – symulatorem walki czołgów na polu minowym, z bardziej rozwiniętymi efektami graficznymi, w porównaniu do kreski i kwadratu w „Pong”. Rok później na rynku pojawia się kolejny automat Atari z grą „Shark Jaws” – symulującą walki nurków z rekinami, w której po raz pierwszy wykorzystano animację postaci. Przełamanie amerykańskiej hegemonii w produkcji gier komputerowych przyszło w 1975 roku, kiedy japońska firma Taito wydała automat z animowaną, dynamiczną grą „Gun Fight”, która po raz pierwszy korzystała z mikroprocesora. Jednak prawdziwym Zbigniew Bański, Business Wars - Atari vs. Commodore cz.I, „CD-Action”, nr 175/marzec 2010, s. 92. 19 22 sukcesem okazała się kolejna gra wydana przez Taito –„Space Invaders” symulująca kosmiczną bitwę pomiędzy rzędami kosmitów i statkiem kosmicznym. Gra zyskała ogromną popularność. Za jej sprawą automaty wyszły z niszy salonów gier i zaczęły pojawiać się masowo w bardziej komercyjnych miejscach, takich jak restauracje, centra handlowe czy stacje benzynowe. W 1980 roku japońska frma Namco wydała grę, która stała się jednym z największych klasyków gatunku – „Pac–man”. Po raz pierwszy w grze pojawił się osobowy bohater (to żółta głowa z otworem gębowym), który porusza się po labiryncie, zjadając kropki i uciekając przed duszkami (stworzonymi dzięki wykorzystanej po raz pierwszy w grach sztucznej inteligencji) (Rys. 12). Rysunek 12 Wizualizacja gry "Pac-man" Źródło: http://macexpress.info/iphone/files/20120826-aktualizacja-pac-mac-3-3-0.html Gra okazała się wielkim sukcesem komercyjnym. Doczekała się także wielu przeróbek i kontynuacji – m. in. „Ms. Pac-Man” z 1982 roku, w której po raz pierwszy występuje żeński bohater. Pac-Man, poza historią gier komputerowych, wpisał się także bezapelacyjnie w popkulturę – znalazł się na okładce prestiżowego pisma „TIME”, został wybierany „Człowiekiem roku”, stał się bohaterem książek, bajek dla dzieci, jego wizerunek pojawiał się na niezliczonej ilości produktów. Dzięki swojej ogromnej popularności wprowadził gry komputerowe do kultury masowej.20 B. Klusek, “Dawno temu w grach. Czas Pionierów. Szkice z historii gier komputerowych”; Inicjatywa wydawnicza Orka, Łódź, 2008, str. 21-22 20 20 23 Przełom lat 70. i 80. przyniósł zupełnie nowy kierunek w rozwoju gier komputerowych. Wtedy zaczęły pojawiać się konsole do gier podłączane do telewizorów. Umożliwiło to grom wyjście z salonów i pojawienie się w domach. Pierwsze konsole pozwalały grać w tylko jedną zainstalowaną na nich grę. Z czasem wprowadzono konsole z wymiennymi modułami, dzięki czemu nie ograniczały one ilości gier. Na rynku pojawiło się bardzo wiele konsol, jednak najpopularniejszymi okazały się Nintendo i SEGA. Cały czas pojawiały się nowe gry, swojego przeniesienia na konsole doczekały się też popularne gry na automaty, takie jak „Pong”, „Pac-Man” czy „Space Invaders”. W połowie lat 80., wraz ze znacznym spadkiem cen i upowszechnieniem się komputerów osobistych, twórcy gier zaczęli dostrzegać ich duży potencjał, przejawiający się kolorową grafiką i zwiększoną mocą obliczeniową. Pierwszym doskonałym komputerem dla graczy okazał się ZX Spectrum, który wyświetlał kolorowy obraz w rozdzielczości 256x192 px i wyposażony był w 48 kB pamięci RAM. Niska cena oraz szeroka i dostępna baza oprogramowania przyczyniły się do wielkiej popularności tej jednostki. Potencjał ZX Spectrum zauważyło wielu producentów gier. Powstały wtedy takie hity gatunku, jak Knight Lore, Manic Miner, Skool Daze czy Jet Set Willy. Chwilę później na rynku pojawił się kolejny komputer osobisty, który przebił swoja popularnością ZX Spectrum. Commodore 64 wyposażony był w 64 kB pamięci RAM, chip graficzny VIC-II wyświetlający grafikę w rozdzielczości 320x200 px oraz układ dźwiękowy SID. Jego ogromną zaletą dla graczy była dostępność prawie wszystkich możliwych gier – konwersji z konsol i automatów oraz dedykowanych produkcji. Komputer Commodore 64 zyskał status najlepiej sprzedającego się w historii, zyskując ponad 30 milionów nabywców. W 1984 roku Jack Tramiel, twórca Commodore, odchodzi z firmy i wykupuje pogrążoną w kryzysie firmę Atari. Opierając się na swoich doświadczeniach oraz sławie marki Atari wprowadza do sprzedaży komputery osobiste z serii XE (zbliżone parametrami do Commodore64), a rok później rewolucyjną, szesnastobitową jednostkę ST.21Od tego momentu komputery zaczęły stawać się podstawowym nośnikiem gier komputerowych. Wszystkie gry pojawiające się na automaty czy konsole, miały swoje odpowiedniki konwertowane na któryś z komputerów, a bardziej zaawansowane produkcje ukazywały się jedynie w wersjach przeznaczonych na komputer. B. Klusek, “Dawno temu w grach. Czas Pionierów. Szkice z historii gier komputerowych”; Inicjatywa wydawnicza Orka, Łódź, 2008, str. 41 21 21 24 Gwałtowny rozwój technologiczny i obliczeniowe komputerów, przyczyniły się stale do zwiększające się możliwości rewolucyjnej zmiany w grach komputerowych – dzięki zastosowaniu technologii 3D wprowadzono trójwymiarowe środowisko gry. W 1992 roku na rynku pojawia się wydana na platformę MS-DOS „Wolfenstein 3D” studia id Software, pierwsza gra prezentująca trójwymiarowe otoczenie (w kierunku horyzontalnym). Gra, której bohater walczy z nazistami w zamkniętym zamku, posiadała widok „z pierwszej osoby” (Rys. 13). Gracz mógł obracać się o 90 stopni oraz poruszać do przodu i do tyłu. „Wolfenstein 3D” stał się prekursorem gatunku gier FPS (First Person Shooter).22 Rysunek 13 Wizualizacja gry "Wolfenstein 3D" Źródło: http://kondux.wordpress.com/2012/05/28/wolfenstein-3d/ Od tego momentu technologia 3D w grach zaczęła się rozwijać coraz silniej, zwiększając ich walory wizualne. Istotne z punktu widzenia rozwoju graficznego gier komputerowych było wprowadzenie nośników z technologią optycznego zapisu danych, takich jak płyty CD, a później DVD. Dzięki dużej powierzchni nośnika można było znacząco rozbudować gry o grafikę, dźwięk czy treść merytoryczną. Na lata 90-te przypada największy rozwój gier strategicznych czasu rzeczywistego (RTS) zapoczątkowany przez „Dune II”. Pojawiły się gry w kategorii survival horror („Alone in the dark”) czy gry przygodowe („Myst” czy „Tumb Rider”). Dużą popularnością cieszyły się gry symulacyjne, na czele z wyprodukowaną przez firmę Maxis kultową już serią gier „The Sims”. Kluczowym czynnikiem rozwoju było upowszechnienie internetu, który dał możliwość wspólnej gry przez sieć wielu osób na raz – w charakterze rywali lub partnerów, walczących ze wspólnym wrogiem. Pierwszą i niezwzykle popularną 22 http://www.mac-archive.com/wolfenstein/history.html 25 grą sieciową stał się „Quake”, wydany w 1996 roku przez firmę id Software. Kolejnymi znaczącymi pozycjami były „Warcraft” oraz „Starcraft”. Internet, oraz stałe rozwijanie przeglądarek internetowych pozwoliło na wprowadzenie gier internetowych wykonanych w tchnologii flash.23 Połowa lat 90. to także pojawienie się na rynku pierwszych przenośnych konsol do grania (Sega Nomad, Game Boy), które wykorzystywały najczęściej wcześniejsze proste gry na automaty. Wraz z nadejściem XXI wieku w rozwoju gier nastała tzw. „era 128-bitowców”. Nastąpił dalszy rozwój gier przeznaczonych na komputery oraz znaczne wzmocnienie pozycji konsol do gier. Producenci doszli do wniosku, że konsole nie muszą służyć jedynie do grania i zaczęli rozszerzać ich funkcjonalności, np. takie jak odtwarzacze DVD i MP3. To właśnie stało się podstawą do budowania ich sukcesu. Najważniejsze urządzenia tego okresu to: Sega Dreamcast, Nintendo GameCube, Sony PlayStation 2 i Microsoft Xbox. Najprężniej rozwijającymi się gatunkami gier w tym okresie były: gry akcji („Medal of Honor”, „Call of Duty”, „Hal-Life 2”), gry wyścigowe („GTA”), gry sportowe („FIFA Soccer”), gry fantazy („Wiedzmin”, „Final Fantasy”). Wielką popularność zyskały gry MMORPG – w których duża liczba graczy podłączonych do sieci Internet może grać wspólnie w wirtualnym świecie („War of Warcraft”, „Guild Wars”). Pierwsze lata 20-tego wieku to także silny dyskurs publiczny o nieodpowiednich treściach umieszczanych w grach – takich jak przemoc czy pornografia. Nie zatrzymało to jednak w żaden sposób lawinowego rozwoju rynku gier komputerowych. W 2005 roku, wraz z wejściem na rynek konsoli Xbox 360, nastała nowa, trwająca do dziś era – High definition. Została ona ugruntowana rok później, kiedy pojawiły się kolejne konsole wydane przez Sony i Nintendo – w wersjach stacjonarnych (PlayStation 3, Wii) oraz mobilnych (PlayStation Portabe, Nintendo DS.). Od tego momentu sterowanie grami nie musiało odbywać się za pomocą joysticka, myszy czy klawiatury. Specjalne kontrolery, czujniki ruchu i trójwymiarowe kamery umożliwiają operowanie grami za pomocą gestów i ruchów własnego ciała. Pojawiły się także gry 3D z efektem stereoskopowym, tak by jeszcze silniej zacierać granice pomiędzy realnym światem, a wirtualną rzeczywistością gry. Najważniejszymi pozycjami wydanymi w tym okresie są: Crysis, Shank, Uncharted, Assassin’s Creed. Wielką popularność zyskują także 23 Serwis Dziennikarstwa Obywatelskiego, http://www.artykul.com.pl/historia-gierkomputerowych/ 26 przeglądarkowe („OGame”, „Plemiona”, „Travian”) oraz społecznościowe („Second Life”, „LittleBigPlanet”). Przykładem jest konsola Xbox 360 Kinect. Posiada ona trójwymiarową kamerę oraz czujnik ruchu. Dzięki temu każda wykonywana przez nas czynność wywołuje odpowiednią reakcję w grze. Rozwój przemysłu gier komputerowych nie zatrzymuje się nawet na chwilę. Mamy już gry 3D i konsole reagujące na ruch. Kto wie, co będzie za kilka kolejnych lat. Niestety, ciągłe prace nad udoskonalaniem gier zależą również od opłacalności ich produkcji. W czasach, kiedy internet jest tak łatwo dostępny, a walka z piractwem nie przynosi pożądanych efektów, może się okazać, że w pewnym momencie firmy wydawnicze nie będą już miały powodu, żeby realizować nowe pomysły. 2.2 Rodzaje gier komputerowych Prezentując typologię gier komputerowych można brać pod uwagę różne kryteria podziału. 2.2.1. Podział gier ze względu na sposób prezentacji Analizując sposób przedstawiania akcji gry możemy wyróżnić:24 a. gry widziane z perspektywy pierwszej osoby – pokazywane oczami bohatera, występują głównie w grach gatunku FPS (first person shooter), celowniczkach oraz grach labiryntowych (np. „The Elder Scrolls”, „Eye of the Beholder”); b. gry widziane z perspektywy trzeciej osoby – obserwowane zza pleców bohatera, często mają też funkcjonalność zmiany widoku na perspektywę pierwszej osoby (np. „Assasin’s Creed”, „Grand Theft Auto”, „Tomb Rider”, „Max Payne”); c. gry widziane z góry – prezentują widok z „lotu ptaka” nad bohaterem gry (np. „Company of Heroes”, „Alien Swarm”); d. gry widziane z boku – akcja widziana jest w z ujęcia bocznego, postaci pojawiają się głównie w osi poziomej, najczęściej wykorzystywane w dwuwymiarowych grach platformowych i bijatykach (np. „King Arthur’s World”, „Super Mario Bros”, „Mortal Kombat”); e. gry z widokiem izometrycznym – przedstawione w rzucie izometrycznym („Diablo”, „Zaxxon”, „Fairlight”). 24 http://pl.wikipedia.org/wiki/Lista_gatunk%C3%B3w_gier_komputerowych 27 2.2.2 Podział gier ze względu na sprzęt, na którym są odtwarzane Rozróżniając sprzęt, na którym obsługiwana jest gra komputerowa możemy wskazać, stosując upowszechnioną terminologię w języku angielskim: a. PC games – gry na komputery osobiste; b. Console games – gry na konsole stacjonarne, podłączane do telewizorów lub przenośne; c. Arcade games – gry na automaty wolnostojące. 2.2.3 Podział gier ze względu na ich tematykę Istotnym wyróżnikiem podziału gier jest ich tematyka. Należy mieć jednak na uwadze, że poszczególne gatunki się tu ze sobą łączą, a ich cechy się przenikają. Biorąc pod uwagę kryterium tematyczne możemy wyróżnić:25 a. gry zręcznościowe: gry arkadowe, platformówki, strzelanki, celowniczki, bijatyki, pinballe i bilardy, wyścigi, filmy interaktywne, FPS, skradanki, przygodowe gry akcji, pola walki, gry muzyczne, b. gry przygodowe: tekstówki, Zajączkowski B., Urbańska-Galanciak D., Co o współczesnych grach wiedzieć powinniśmy, Stowarzyszenie Producentów i Dystrybutorów Oprogramowania Rozrywkowego, Warszawa 2009 25 28 point'n'click (klasyczne gry przygodowe), c. fabularne: rogaliki (roguelike)’ MUD, hack'n'slashe (action-RPG), RPG, space-simy (symulatory kosmiczne), MMORPG, d. strategiczne: turówki (gry turowe, TBS), RTS (strategie czasu rzeczywistego, w tym RTWG), MMORTS, strategie przeglądarkowe (browser-based), gry taktyczne (w tym squad-level), strategie ekonomiczne (tycoony i simy), menadżery sportowe, e. symulacyjne: symulatory lotnicze, samochodówki, symulacje społeczne (symulacje życia ludzi), symulacje życia zwierząt, ubieranki i makeovery, f. sportowe g. logiczne h. edukacyjne. 2.3 Etapy procesu tworzenia gier komputerowych Mając na uwadze bardzo szerokie spektrum gatunków gier komputerowych, możemy wskazać wiele różnorodnych dróg projektowania, także dostosowanych do jednostkowych 29 przypadków. Niezależnie jednak od rodzaju, tematyki czy złożoności gry możemy wyróżnić główne etapy tworzenia i ich elementy:26 a. etap koncepcyjny (realizowany na samym początku, jego wyniki nie ulegają modyfikacji) ustalanie koncepcji – założenie ogólnej idei gry, jej tematyki oraz wybranego gatunku; definicja celowej grupy odbiorców – ustalenie rynku docelowego i profilu odbiorcy naszej gry; ustalania roli gracza – użytkownik gry osadzony jest w roli (np. żołnierza, kierowcy, zawodnika sportowego), na tym etapie musi ona zostać szczegółowo sprecyzowana; spełnienie marzeń – ustalenie celów, osiągnięć jakie gracz będzie mógł zdobyć podczas gry, jakim wyzwaniom będzie musiał sprostać i jaka czeka go za to nagroda; b. etap opracowywania (tu tworzone są szczegóły projektowe, przyjęte założenia testowana są za pomocą makietowania i testowania – przejście od teorii do praktyki) definiowanie podstawowego trybu rozrywki – ustalenie perspektywy (za pomocą której gracz widzi świat gry), modelu interakcyjnego (przy pomocy którego wpływa na świat) oraz wyzwań (które będą stawiane, przed użytkownikiem) i dostępnych metod ich pokonywania; projektowanie bohatera gry (o ile gra ma głównego bohatera) – ustalenie wyglądu, cech fizycznych oraz usposobienia bohatera gry, jego motywacji, emocji, mowy ciała oraz słownictwa; definiowania świata gry – zaprojektowanie cech świata, w którym dzieje się gra z uwzględnieniem wymiaru fizycznego, przestrzennego, czasowego, środowiskowego, emocjonalnego i etycznego; 26 E. Adams, „Projektowanie gier. Podstawy”, Wydawnictwo Helion, 2010, s. 82-90 30 projektowanie mechaniki podstawowej – ustalenie w jaki sposób powstają wyzwania dla gracza oraz jakie działania składają się na ich zdobywanie; tworzenie dodatkowych trybów – dodawanie dodatkowych trybów do gry (np. taktyczny do strategicznego); powinny one służyć dostarczaniu rozrywki i występować jedynie wówczas, gdy są niezbędne w grze lub mogą znacznie ją uatrakcyjnić; projektowanie poziomów – stworzenie bezpośrednich wrażenie dla gracza przy wykorzystaniu postaci, świata gry, wyzwań dla gracza, jego działań, fabuły oraz mechaniki podstawowej; tworzenie fabuły – występuje jedynie w dużych rozwiniętych projektach; fabuła może być liniowa, rozwijać się bez zależności od decyzji podejmowanych przez gracza lub być uzależniona od działań gracza; powtarzający się proces budowania i testowania – tworzenie prototypów gry, testowanie wszystkich jej elementów, w celu wyeliminowania wszelkich usterek i słabych punktów; c. etap dostrajania (wprowadzane są niewielkie modyfikacje i poprawki gry) – kończy możliwość wprowadzania do gry nowych funkcjonalności, polega na ulepszaniu gry, eliminowaniu usterek i wad, drobnych modyfikacjach w poziomach i mechanice podstawowej gry. 2.4 Tworzenie gier komputerowych we Flashu Flash jest doskonałym narzędziem do tworzenia prostych gier, w szczególności tych funkcjonujących w przeglądarkach internetowych. Zorientowany obiektowo, skryptowy język programowania ActionScript pozwala wpływać na wszystkie atrybuty aplikacji. Można dzięki temu kontrolować animację, nadawać właściwości, wywoływać 31 określone zdarzenia i zakładać warunki. W Flash’u możliwe jest importowanie i stosowanie różnorodnych formatów plików graficznych i dźwiękowych. W procesie tworzenie gier dużym ułatwieniem jest możliwość korzystania z różnorodnych form działania, obok języka ActionScript mamy tu też narzędzia programu Adobe Flash, palety i okna dialogowe. Najistotniejszymi funkcjonalnościami języka ActionScript będą tu: kontrola odtwarzania klipów, kontrola właściwości klipów, używanie klipów do zmiany wyświetlanej treści, przyjmowanie danych z klawiatury, reagowanie na działanie myszy i odtwarzanie dźwięków.27 W odróżnieniu od innych środowisk do tworzenie gier Flash jest zdecydowanie bardziej dostępny - nie wymaga posiadania szerokiej i specjalistycznej wiedzy programistycznej oraz gruntownych podstaw nauk ścisłych. Język ActionScript jest stosunkowo łatwy do nauczenia (w porównaniu do innych rozbudowanych języków programowania) i nie wymaga studiów w tym kierunku. I. Iskierka, S. Iskierka „Możliwości programowania gier w programie Flash”; publikacja „Edukacja dla bezpieczeństwa. Bezpieczeństwo intelektualne Polaków”, red. Naukowa Magdalena Gawrońska – Garstka, „ESUS” Agencja Reklamowo – Wydawnicza, Poznań 2009, s. 308-311 27 32 3. Projekt gry komputerowej „Memory” 3.1 Opis gry Gra „Memory” jest stworzona w oparciu o zasady popularnej klasycznej gry pamięciowej dla dzieci, która polega na odnajdywaniu par takich samych kart. W każdej pojedynczej rundzie gracz odsłania dwie karty. Jeśli są to karty takie same, zostają one zdjęte z planszy, jeśli są różne, karty będą odwrócone z powrotem . Zadaniem gracza jest zdjęcie wszystkich kart z planszy – wtedy też kończy się poziom gry. Gra dedykowana jest w dla dzieci w wieku: 4-12 lat, ale może dostarczyć rozrywki także starszym osobom 3.2 Scenariusz gry Gra ma 2 poziomy, różniące się ilością pól na planszy: poziom 1 (8 pól), poziom 2 (16 pól). Po uruchomieniu gry pojawia się plansza startowa. Gracz ma możliwość wyboru 2 aktywności: kliknięcie na przycisk „graj”, aby rozpocząć właściwą grę, kliknięcie na przycisk „jak grać”, aby przeczytać instrukcję gry. Po przeczytaniu instrukcji gracz, dzięki kliknięciu przycisku „wróć” może powrócić do planszy startowej. Gdy gracz wybierze opcję rozpoczęcia gry, ukazuje mu się plansza wyboru poziomów – możliwy jest jedynie wybór poziomu 1. Następnie pojawia się plansza z 8 zasłoniętymi kartami. Gracz odsłania 2 karty, jeśli na kartach znajdują się takie same symbole karty znikają, pozostawiając puste miejsca. Sygnalizuje to także dźwięk. Pozostałe karty pozostają w swoich dotychczasowych lokalizacjach. Gdy odsłonięte karty mają różne symbole, odwracają się z powrotem. Gra jest zakończona, gdy z planszy znikną wszystkie karty. Będąc w poziomie 1. gracz ma do dyspozycji przycisk ‘wróć’, który odsyła go do planszy poziomów. Teraz gracz może wybrać poziom 1. Lub poziom 2. Po wyborze 2. 33 poziomu ukazuje się obszar gry z 16 kartami. Umieszczony jest tu także przycisk wróć, który odsyła do planszy startowej. Schemat gry został zaprezentowany na poniższym diagramie: Źródłó: Opracowanie własne 3.3 Prezentacja zastosowanych metod Gra „Memory” składa się z pliku kontenera oraz pliku z samą grą, która jest została do niego dynamicznie wczytywana. W pliku kontenerze została zbudowana struktura gry. Poniżej zaprezentowana została listwa czasowa projektu (Rys. 14). 34 Rysunek 14 Listwa czasowa projektu Źródłó: Opracowanie własne Mamy tu dwie warstw – ‘rama’ i ‘tablica’ prezentujące elementy graficzne planszy gry. Warstwa instrukcja została wypełniona w klatkach 1, 3 i 9. W klatkach 1 i 9 znajdziemy przyciski odsyłające do klatki 9, w której znajduje się klip z instrukcją gry oraz przycisk powrotu do planszy startowej gry. W każdej klatce znajduje się też kod ActionScript programujący żądane działanie (Rys. 15 i 16). Rysunek 15 Kod ActionScript - przycisk odsyłający do planszy z instrukcją Źródłó: Opracowanie własne 35 Rysunek 16 Kod ActionScript - Instrukcja Źródłó: Opracowanie własne Kolejna warstwa, o nazwie ‘graj’ prezentuje odzwierciedlenie planszy startowej gry. Mamy tu wypełnione klatki 1 i 9. Plansza z 1. klatki – za pomocą przycisku ‘graj’ daje możliwość przejścia do planszy z wyborem poziomu, gdzie mamy aktywny tylko poziom 1 (Rys. 17). Plansza z drugiej klatki odsyła do planszy wyboru poziomu w dwoma aktywnymi poziomami (Rys. 18). Rysunek 17 Kod ActionScript - Przejście do planszy poziomów 1 Źródłó: Opracowanie własne Rysunek 18 Kod ActionScript - Przejście do planszy poziomów 2 Źródłó: Opracowanie własne 36 Warstwy ‘poziom 1’ i ‘poziom 2’ są zaprojektowane w analogiczny sposób. Mają po dwie wypełnione klatki. W pierwszej z nich mamy planszę poziomów z przyciskami, które odsyłają do gry (Rys. 19). Rysunek 19 Kod ActionScript - wybór poziomów gry Źródłó: Opracowanie własne W następnej klatce danej warstwy mamy kod wczytujący faktyczną grę – 1. Lub 2. Poziom (Rys. 20). Rysunek 20 Kod ActionScript - dynamiczne wczytanie gry Źródłó: Opracowanie własne 37 Sama gra stworzona została w odrębnym plikach. Poziom 1. znajduje się w pliku o nazwie „box9”, a poziom 2. w pliku „box”. Na potrzeby analizy przedstawiony zostanie fragment bardziej rozbudowany, prezentujący poziom 2. W bibliotece projektu znajduje się 8 grafik reprezentujących obrazki na kartach, które odsłania gracz oraz grafika odzwierciedlająca rewers karty. Mamy tu także plik dźwiękowy o nazwie „sound1.mp3”, który będzie rozbrzmiewał informując gracza o odsłonięciu dwóch takich samych kart. Kolejnym symbolem jest klip filmowy o nazwie „color”, składający się z 9 klatek, po jednej dla każdej grafiki reprezentującej karty gry. W bibliotece znajdziemy także klip timer, który pozwala kontrolować czas gry. Projektowi została nadana klasa o nazwie box1, którą zdefiniował kod ActionScript (Rys. 21). Rysunek 21 Kod ActionScript - gra 38 Źródłó: Opracowanie własne Poniżej zostały zdefiniowane poszczególne linijki kodu: Linie 3-7 – importowanie niezbędnych plików z biblioteki, Linia 10 – deklaracja głównej klasy o nazwie box1, Linia 11 – deklaracja zmiennej, która zachowa wartość pierwszej odkrytej karty, jest tożsama z nazwą klipu, który przechowuje grafiki odzwierciedlające karty, Linia 12 - deklaracja zmiennej, która zachowa wartość drugiej odkrytej karty, również jest tożsama z nazwą klipu, który przechowuje grafiki odzwierciedlające karty, Linia 13 – deklaracja zmiennej, która będzie przydatna do wstrzymywania gry. Umożliwi to odkrycie przez gracza drugiej karty z pary, Linia 14 – inicjowanie tablicy o nazwie colordeck, która zawiera wszystkie możliwe wartości reprezentujące karty, Linia 15 – deklaracja głównej funkcji box1, 39 Linia 16-17 – zawiera pętle, która pozwala na rozmieszczenie kart na scenie – w 4 kolumnach i 4 rzędach, Linia 18 – decyduje o losowym rozmieszczeniu grafik z tablicy na kartach (1-8 klatka), Linia 19 – stworzenie kart odpowiadającym obrazom, Linia 20 – przypisanie do kart atrybutu o nazwie col reprezentującego obrazy, Linia 21 – odwracanie karty, odbieranie jej grafiki przypisanej w linii 18, Linia 22 – wyświetlenie 9 klatki w klipie color, co jest równoważne z ułożeniem karty z widocznym rewersem, Linia 23-24 – definiowanie rozmieszczenia kart na scenie, Linia 25 – dodanie „nasłuchiwania” do kart, kiedy gracz kliknie na wybraną kartę uruchomiona zostanie funkcja o nazwie tile_clicked, Linia 26 – określa efekt działania funkcji tile_clicked, karta zostanie odwrócona i ukarze się przypisana jej grafika, Linia 30 - rozpoczęcie funkcji tile_clicked, która zostanie uruchomiona za każdym razem, gdy gracz kliknie w dowolną kartę, tym samym odwracając ją i ukazując przypisaną do niej grafikę, Linia 31 – przypisanie do zmiennej o nazwie clicked wartości - grafiki właśnie klikniętej karty, Linia 32 – przypisanie do zmiennej o nazwie mySound dźwięku z biblioteki Linia 34-36 – rozpoczęcie instrukcji warunkowej, definiuje kliknięcie na pierwszą kartę w danej rundzie i odkrycie przypisanej do niej grafiki, Linia 38-40 – definiuje kliknięcie na drugą kartę w danej rundzie i odkrycie przypisanej do niej grafiki, Linia 41 – ustalenie warunku – jeśli pierwsza i druga kliknięta karta mają przypisaną tę samą grafikę, Linia 42 – zdefiniowanie zmiennej zatrzymania timera, 40 Linia 43 – dodanie „nasłuchu”, który w momencie zatrzymania timera usunie obie odwrócone karty, Linia 44 – zatrzymanie timera – usunięcie kart, Linia 45 – odtwarzanie dźwięku, Linia 47 – ustalenie warunku – jeśli gracz odkrył dwie różne karty Linia 48 – zdefiniowanie zmiennej zatrzymania timera, Linia 49 – dodanie „nasłuchu”, który w momencie zatrzymania timera zresetuje obie odwrócone karty – czyli obie pozostaną na scenie, ale zostaną odwrócone rewersami, Linia 50 – zatrzymanie timera – odwrócenie kart, Linia 54 – rozpoczęcie funkcji, która będzie będzie resetować karty i pozostawiać je na scenie, Linia 55-56 – przypisanie do obu kart rewersów, Linia 57-58 – wyzerowanie dla pierwszej i drugiej karty ich wartości, Linia 59 – usunięcie nasłuchu zatrzymania czasu, Linia 61 – Rozpoczęcie funkcji, która będzie usuwać pasujące do siebie karty, Linia 62-63 – usunięcie obu pasujących kart, Linia 64-65 - wyzerowanie dla pierwszej i drugiej karty ich wartości, Linia 66 – usunięcie nasłuchu zatrzymania czasu, Dzięki tak zapisanemu kodowi programu gra funkcjonuje poprawnie i spełnia swoje założenia. 3.4 Wizualizacje gry „Memory” Gra Memory dedykowana jest dla dzieci w wieku 3-14 lat. Graficzna oprawa gry jest więc dostosowana do jej odbiorców (Rys. 22-24). Tło planszy gry nawiązuje do wyglądu 41 szkolnej tablicy. Tytuł gry, wszystkie polecenia i instrukcje wyglądają jakby zostały napisane kredą, aby uwiarygodnić założoną koncepcję. Rysunek 22 Plansza startowa gry Źródło: Opracowanie własne Rysunek 23 Plansza z instrukcją gry Źródłó: Opracowanie własne Rysunek 24 Plansza poziomów gry 42 Źródłó: Opracowanie własne Obrazki zaprezentowane na kartach wyglądają jak odręczne rysunki ze szkolnego zeszytu (Rys. 25 i 26). Prezentują atrakcyjne dla dzieci motywy – zwierzęta, samolot, rakietę. Rewers kart wygląda jak gładka kartka z zeszytu. Rysunek 25 Plansza z 2. poziomem gry Źródłó: Opracowanie własne 43 Rysunek 26 Wizualizacje kart gry oraz ich rewersu Źródłó: Opracowanie własne Podsumowanie Zasadniczym celem zadaniem założonym przy realizacji rozprawy dyplomowej było stworzenie gry komputerowej opartej na zasadach klasycznej gry Memory. Do realizacji tego przedsięwzięcia wytypowana został technologia Flash. Wybór zdeterminowany został przez jej podstawowe cechy. Flash jest stosunkowo prostym środowiskiem, możliwym do stosowania także prze osoby bez solidnych podstaw nauk ścisłych oraz inżynierskiego wykształcenia z zakresu programowania. Jednocześnie ma szeroki wachlarz możliwości z zakresie zastosowania interaktywnych animacji i obsługi zdarzeń. Dzięki platformie Abobe Flash Professional CS5 dostarcza kompleksowe narzędzie do tworzenia grafiki wektorowej, pozwala także na import grafiki rastrowej, dźwięków czy wideo. 44 Cel pracy został zrealizowany. Powstała gra „Memory” została stworzona przy wykorzystaniu technologii Flash, ze szczególnym uwzględnieniem języka programowania ActionScript 3.0. Ponadto wszystkie zagadnienia związane z problematyką pracy zostały szeroko opisane w teoretycznej części rozprawy. 45 Spis ilustracji Rysunek 1 Wizualizacja okna programu Adobe Flash Professional CS5 ........................................ 14 Rysunek 2 Menu programu Adobe Flash Professional CS5 ............................................................ 14 Rysunek 3 Pasek narzędzi programu Adobe Flash Professional CS5.............................................. 15 Rysunek 4 Stół montażowy .............................................................................................................. 16 Rysunek 5 Panel Biblioteka ............................................................................................................. 17 Rysunek 6 Oś czasu programu Adobe Flash Professional CS5 ....................................................... 17 Rysunek 7 Panel Operacje - Klatka.................................................................................................. 18 Rysunek 8 Przycisk - stół monatżowy i listwa czasowa .................................................................. 19 Rysunek 9 Gra "Tenis for two" ........................................................................................................ 21 Rysunek 10 Gra "Speaceware!" ....................................................................................................... 21 Rysunek 11 Automat firmy Atari do gry "Pong" ............................................................................. 22 Rysunek 12 Wizualizacja gry "Pacman" .......................................................................................... 23 Rysunek 13 Wizualizacja gry "Wolfenstein 3D" ............................................................................. 25 Rysunek 14 Listwa czasowa projektu .............................................................................................. 35 Rysunek 15 Kod ActionScript - przycisk odsyłający do planszy z instrukcją ................................. 35 Rysunek 16 Kod ActionScript - Instrukcja ...................................................................................... 36 Rysunek 17 Kod ActionScript - Przejście do planszy poziomów 1 ................................................. 36 Rysunek 18 Kod ActionScript - Przejście do planszy poziomów 2 ................................................ 36 Rysunek 19 Kod ActionScript - wybór poziomów gry .................................................................... 37 46 Rysunek 20 Kod ActionScript - dynamiczne wczytanie gry ........................................................... 37 Rysunek 21 Kod ActionScript - gra ................................................................................................. 38 Rysunek 22 Plansza startowa gry ..................................................................................................... 42 Rysunek 23 Plansza z instrukcją gry ................................................................................................ 42 Rysunek 24 Plansza poziomów gry ................................................................................................. 42 Rysunek 25 Plansza z 2. poziomem gry ........................................................................................... 43 Rysunek 26 Wizualizacje kart gry oraz ich rewersu ........................................................................ 44 Bibliografia 1. F. Gerantabee „Flash CS3 PL Multimedialny trener”; Wydawnictwo Helion; Warszawa; 2009 2. B. Klusek, “Dawno temu w grach. Czas Pionierów. Szkice z historii gier komputerowych”; Inicjatywa wydawnicza Orka, Łódź, 2008; 3. E. Adams, „Projektowanie gier. Podstawy”, Wydawnictwo Helion, 2010; 4. I. Iskierka, S. Iskierka „Możliwości programowania gier w programie Flash”; publikacja „Edukacja dla bezpieczeństwa. Bezpieczeństwo intelektualne Polaków”, red. Naukowa Magdalena Gawrońska – Garstka, „ESUS” Agencja Reklamowo – Wydawnicza, Poznań 2009 5. Zajączkowski B., Urbańska-Galanciak D., Co o współczesnych grach wiedzieć powinniśmy, Stowarzyszenie Producentów i Dystrybutorów Oprogramowania Rozrywkowego, Warszawa 2009 6. „Poznajemy język ACTIONSCRIPT® 3.0”; Adobe; 7. „Korzystanie z programu Adobe Flash Professional CS5 i CS5.5”; Adobe; 8. Zbigniew Bański, Business Wars - Atari vs. Commodore cz.I, „CD-Action”, nr 175/marzec 2010 9. Internetowa Encyklopedia PWN, http://encyklopedia.pwn.pl/haslo.php?id=3908365 47 10. Serwis Dziennikarstwa Obywatelskiego, http://www.artykul.com.pl/historia-gierkomputerowych/ 11. http://pl.wikipedia.org/wiki/Lista_gatunk%C3%B3w_gier_komputerowych 12. http://www.mac-archive.com/wolfenstein/history.html 13. Encyklopedia Zarządzania, http://mfiles.pl/pl/index.php/Technologia_FLASH 48