Uniwersytet Łódzki dla dzieci

Transkrypt

1 Uniwersytet Łódzki dla dzieci Jak jeździć autkiem po zielonej łące, czyli tworzymy grę komputerową

2 Plan zajęć 1. Czym jest gra? 2. Rodzaje gier 3. Gry kiedyś i dzisiaj 4. Trochę o grafice komputerowej (jakie są rodzaje) 5. Animacja 6. Dzień dobry. Nazywam się Flash 7. Szybki kurs programowania 8. Tworzymy grę

3 Czym jest gra? Czynność Forma rozgrywki Zbiór zasad Konkurencja (rywalizacja) Dążenie do zwycięstwa Bywają gry edukacyjne Pamiętajcie: Gry nie tylko to gry komuterowe!!

4 Rodzaje gier 1. Gry fizyczne (sport) Piłka norzna Siatkówka Wiele innych 2. Gry umysłowe Szachy Warcaby Państwa miasta 3. Gry podwórkowe Kapsle W chowanego Berek 4. Gry planszowe Chińczyk Eurobiznes/Monopol 5. Gry karciane Makao Wojna

5 Rodzaje gier Gry komputerowe Platformowe Zręcznościowe Przygodowe Akcji Sportowe Fabularne (RPG) Strategiczne Symulacyjne Edukacyjne

6 Gry kiedyś i dzisiaj Pierwsza gra powstała 1947r. Pierwsza gra konsolowa PONG (1972r.) dostępna dla ludzi Z czasem powstały komputery specjalnie do gier komputerowyc Konsole do gier Nintendo PlayStation X-BOX

7 Trochę o grafice komputerowej Klasyfikacja grafiki komputerowej według 1. Techniki tworzenia Grafika wektorowa Grafika rastrowa 2. Charakter danych 2D 3D

8 Animacja Rodzaje animacji: Rysunkowa Lalkowa Plastelinowa Animacja komputerowa. Rodzaje animacji? Animacje 2D Gotowe ilustracje (sprite) Wirtualny szkielet Animacje 3D W zasadzie tylko i wyłącznie używa się modelu wirtualnego szkieletu

9 Animacja 1. FPS Co to jest? Ile powinno wynosić? Minimum 12, zalecane 15. W grach zalecane nie mniej jak 20 FPS 2. W czym się tworzy animacje 2D Adobe Photoshop GIMP Inkscape Adobe Flash Notatnik (czyli javascript oraz SVG) 3. A co z grafiką 3D Najpierw uczymy się 2D! Dla ciekawych: opengl, directx, 3ds Studio (wcześniej 3D Max Studio), Autodesk Softimage, Cinema 4D, LightWave 3D, Maya, Rhinoceros 3D, Blender

10 Animacja GIF najprostsza i najstarsza forma animacji 2D Jakieś wnioski? Bardzo prosty efekt Płynność niestety tylko wystarczająca Brak możliwości zatrzymania Czy ktoś to jeszcze używa? Głównie na stronach WWW coraz rzadziej w formie animacji Ikonki w niektórych programach Częściej stosowana jest jego konkurencja - PNG

11 Dzień dobry. Nazywam się Flash Grafika wektorowa Animacje tworzone na zasadzie klatek kluczowych Program komercyjny (czyli niestety płatny) Istnieją darmowe odpowiedniki Daje możliwość programowani Wykorzystywany przy tworzeniu: gier internetowych, banerów reklamowych, niekiedy całych stron internetowych, częściej pojedyncze elementy strony

12 Szybki kurs programowania Wszystko jest zmienne Co to jest zmienna? Co może przechowywać? Jak ją tworzyć? Podstawy logiki NIE pada deszcz pada deszcz I świeci słońce pada deszcz LUB świeci słońce pada deszcz I NIE świeci słońce pada deszcz LUB NIE świeci słońce Operacje matematyczne Reszta z dzielenia Układ współżędnych ++ += -=

13 Tworzymy grę Kilka słów wstępu Tworzymy platformową grę 2D Poruszamy się autkiem tylko do przodu Autko może podskakiwać Losowo zostaje stworzony obiekt przeszkoda W lewym górny narożniku wyświetlana jest ilość kolizji autka z przeszkodami

14 Tworzymy grę No to do roboty 1. Z prawej strony wybieramy narzędzie Linia Rysujemy linię poziomą Przekształcamy na klip filmowy Ustawiamy jej Y=330 Nazywamy ziemia 2. Wybieramy narzędzie owal Nad ziemią tworzymy koło (z klawisze shift tworzy się ładne koło nie jajo) Przekształcamy na klip filmowy Nazywamy kolo 3. Przechodzimy do zakładki kodu źródłowego

15 Tworzymy grę Kodujemy import flash.events.event; import flash.ui.keyboard; import flash.events.keyboardevent; var skok = false; var spadek = true; var spadanietempo = 5; var skakanietempo = -5; ziemia.y = 330; this.addeventlistener(event.enter_frame, enterframe, false, 0, true); stage.addeventlistener(keyboardevent.key_down, key_down); function key_down(event:keyboardevent):void{ if (event.keycode ==Keyboard.SPACE){ skok=true; function enterframe(event:event) :void { if (skok){ kolo.y += skakanietempo; if (kolo.y <= 200){ skok=false; spadek=true; if (spadek){ kolo.y += spadanietempo; if((ziemia.hittestobject(kolo))){ spadek=false;

16 Tworzymy grę Kodujemy - timer import flash.utils.timer; import flash.events.timerevent; // var czasomierz:timer = new Timer(2000); czasomierz.start(); // czasomierz.addeventlistener(timerevent.timer,timer); // function timer(event:timerevent):void{ skok=true;

17 Tworzymy grę Kodujemy - timer Mała zmiana timera ;) // var tworz=false; var stworzony = false; var mc:movieclip = new MovieClip(); mc.graphics.beginfill(0x000000); mc.graphics.drawrect(0,0,30,30); mc.graphics.endfill(); // function timer(event:timerevent):void{ if (Math.random()%6==0!stworzony){ tworz=true; function enterframe(event:event) :void { /* ZOSTAWIAMY BEZ ZMIAN DO if((ziemia.hittestobject(kolo))){ spadek=false; */ if(tworz){ stworzony=true; mc.x=485; mc.y=300; stage.addchild(mc); tworz=false; if (stworzony){ mc.x -= 5; if (mc.x<0){ stworzony=false;

18 Tworzymy grę Licznik kolizji Tworzmy dwa pola tekstowe w jednym wisujemy kolizje drugie zmieniamy na klip filmowy i nazywamy txt_kolizje i zostawiamy puste // var kolizje=0; var koliza_trwa=false; // // Na koniec function enterframe(event:event) :void zmieniamy if (stworzony){ mc.x -= 5; if (mc.x<0){ stworzony=false; if (kolo.hittestobject(mc)!kolizja_trwa){ kolizje++; txt_kolizje.text = kolizje; kolizja_trwa=true; else{ kolizja_trwa = false;

19 import flash.events.event; import flash.ui.keyboard; import flash.events.keyboardevent; import flash.utils.timer; import flash.events.timerevent; import flash.display.movieclip; var skok = false; var spadek = true; var spadanietempo = 5; var skakanietempo = -5; var czasomierz:timer = new Timer(2000); var tworz=false; var stworzony = false; var kolizje=0; var koliza_trwa=false; var mc:movieclip = new MovieClip(); mc.graphics.beginfill(0x000000); mc.graphics.drawrect(0,0,30,30); mc.graphics.endfill(); czasomierz.start(); ziemia.y = 330; this.addeventlistener(event.enter_frame, enterframe, false, 0, true); stage.addeventlistener(keyboardevent.key_down, key_down); czasomierz.addeventlistener(timerevent.timer,timer); function key_down(event:keyboardevent):void{ if (event.keycode ==Keyboard.SPACE){ skok=true; function timer(event:timerevent):void{ if (Math.random()%6==0!stworzony) { tworz=true; function enterframe(event:event) :void { if (skok){ kolo.y += skakanietempo; if (kolo.y <= 200){ skok=false; spadek=true; if (spadek){ kolo.y += spadanietempo; if((ziemia.hittestobject(kolo))){ spadek=false; if(tworz){ stworzony=true; mc.x=485; mc.y=300; stage.addchild(mc); tworz=false; if (stworzony){ mc.x -= 5; if (mc.x<0){ stworzony=false; if (kolo.hittestobject(mc)!kolizja_trwa){ kolizje++; txt_kolizje.text = kolizje; kolizja_trwa=true; else{ kolizja_trwa = false;

20 Zakończenie Pytania?

21 Dziękujmy Za uwagę! /