Wyścigówka (wersja C)

Materiały stworzone przez Fundację Coder Dojo Polska w ramach Programu „Mistrzowie Kodowania” finansowanego przez Samsung Electronics Polska, objęte licencją CC BY 3.0 PL "Creative Commons Uznanie Autorstwa 3.0 Polska".

Cel

Celem projektu jest stworzenie przez uczniów gry zręcznościowej typu wyścig. W proponowanym projekcie jest to Gra wyścigowa jednak możliwe jest zastąpienie duszka samochód innymi postaciami, zgodnie z zainteresowaniami uczniów (np.: duszek koń dla miłośników hippiki, duszek rower dla osób zainteresowanych kolarstwem)

Cele ogólne:

• przypomnienie i utrwalenie poznanych wcześniej poleceń i konstrukcji języka Scratch
• opracowanie projektu gry zręcznościowej
• implementacja projektu w środowisku Scratch

Cele szczegółowe

• uczeń rozumie i potrafi stosować odpowiednie instrukcje strukturalne
• uczeń potrafi konstruować skrypty i implementować grę w środowisku Scratch

Zgodność z Podstawą Programową

Zajęcia komputerowe. Uczeń:

• posługuje się komputerem w podstawowym zakresie: uruchamia program, korzystając z myszy i klawiatury;
• wie, jak trzeba korzystać z komputera, żeby nie narażać własnego zdrowia;
• stosuje się do ograniczeń dotyczących korzystania z komputera.

• Plastyka - perspektywa, pojęcie perspektywy, rodzaje perspektyw
• Geometria - rzutowanie

Orientacyjny czas realizacji

Orientacyjny czas realizacji jednej z proponowanych wersji: 2x 45minut

Poziom trudności i proponowane wersje

• dla klas 1-3 ✪✪✪✰ przejdź do scenariusza [Wyścigówka (wersja A)] lub zobacz gotowy projekt Wyścigówka Wersja A
• dla klas 4-6 ✪✪✪✰ przejdź do scenariusza [Wyścigówka (wersja B)] lub zobacz gotowy projekt Wyścigówka Wersja B
• dla gimnazjum ✪✪✰✰ Wyścigówka Wersja C

• Wersja z grafiką, bez skryptu dostępna jest tutaj
• Poglądowy projekt Gra wyścigowa
• Wersja z rankingiem zwycięstw

Wprowadzenie teoretyczne do projektowania gry typu “wyścig”, przygotowanie kostiumów duszków “droga” i “samochód”.

Wprowadzenie.

Czas realizacji 10 minut

Przedstawienie koncepcji projektu stworzenia gry zręcznościowej. Przypomnienie realizowanych na dotychczasowych zajęciach, wcześniejszych modułów dotyczących sterowania postaciami poprzez użycie klawiszy “strzałka lewo/prawo”, “strzałka góra/dół” Rozmowa odnosząca się do doświadczeń uczniów związanych z rodzajami gier typu “wyścig”. Skoncentrowanie się na grach, w których występuje element poruszania bohaterem widocznym “z lotu ptaka” (np.: River Ride, Pro Racing GT, Extreme Rally lub Reckless Racing).

Przygotowanie elementu startowego

W rozmowie na temat gier zręcznościowych, warto poruszyć kwestię momentu rozpoczęcia jazdy samochodu. Analogicznie do sytuacji z rzeczywistego toru wyścigowego, pojazdy zwykle stoją na linii startu w gotowości i czekają, na odmierzenie czasu do startu. W proponowanej wersji gry stworzony został zegar, nadający sygnał cały czas. Zegar najlepiej stworzyć w polu scena ponieważ będzie on przydatny dla wszystkich duszków. Dodatkowo stworzymy też nadawanie startu, ułatwi nam to w przyszłości stworzenie menu. W rozwinięciu gry, między inicjowaniem programu poprzez kliknięcie w zieloną flagę, a nadaniem sygnału start! można dodać element wizualny lub dźwiękowy w postaci odliczania (np.: 3, 2, 1...).

Przygotowanie duszka pojazdu oraz trasy wyścigu.

Czas realizacji 20 minut.

Uwaga! Jeśli dysponujemy ograniczonym czasem pracy, możemy wykorzystać projekt posiadający gotowe grafiki ( Wyścigówka - podstawy) lub możemy zaproponować uczniom stworzenie zarysu duszków, które mogą zostać dopracowane graficznie samodzielnie podczas indywidualnej pracy uczniów w domu. Pierwsze zadanie dotyczy stworzenia podstawowych duszków, tj. pojazdu oraz drogi będącej trasą wyścigu. Kolejność powstawania obu kostiumów nie ma znaczenia, na potrzeby tego skryptu rozpoczniemy od tworzenia duszka “droga”.

W programie Scratch istnieją dwie opcje rysowania kostiumów: tryb bitmapy oraz tryb rysowania wektorowego. Wybór opcji rysowania w trybie wektorowym umożliwia swobodne przybliżanie i oddalanie obrazka, bez utraty jego jakości. Dodatkowo tryb wektorowy oferuje inny zestaw narzędzi graficznych, niż tryb bitmapy.

Tworzenie duszka “Tor Wyścigowy”

Jedną z możliwości narysowania trasy jest użycie narzędzia “Elipsa”. Po narysowaniu bazowego kształtu używając narzędzia “Przekształć” modyfikujemy trasę wzbogacając ją o zakręty.

Tworzenie duszka samochodu.

Przygotowujemy grafikę pojazdu, uwzględniając proporcje duszków "TorWyścigowy" i "Samochód"

Budowanie skryptu sterowania i poruszania się, tworzenie menu gry.

Czas realizacji: 15 minut

Skrypt duszka "Samochód"

Intuicyjnym jest rozpoczęcie tworzenia skryptu “ruchu” od postaci samochodu. W rozmowie na temat przygotowania takiego skryptu warto ustalić istotne punkty, np.:

• W jaki sposób zapewnić płynność obrotu pojazdu? Aby poruszać się płynnie po krzywiznach drogi korzystnie jest połączyć warunek “jeśli klawisz strzałka w lewo/prawo wciśnięty” z klockiem “obróć o X stopni”.
• Co zrobić aby samochód był stale widoczny na planszy (unikanie sytuacji, w której pojazd “ucieka” poza planszę)? Rozwiązaniem może być osadzenie pojazdu np.: w centralnym punkcie planszy.
• Wówczas należy odpowiedzieć na kolejne pytanie: W jaki sposób uzyskać efekt “jazdy samochodem”, jeśli “osadzimy” pojazd w centralnym punkcie planszy? Rozwiązanie może nasunąć obserwacja konstrukcji gier typu River Ride tj.: nadanie efektu “ruchu” postaci droga, czyli trasie wyścigu.

Aby uniknąć sytuacji w której pojazd “ucieka” poza ekran, ustawiamy w zakładce skryptów informację określającą pozycję duszka “samochód” zawsze na środku ekranu. Określamy warunek umożliwiający obracanie pojazdem poprzez sterowanie klawiszami “strzałka lewo/prawo”.

Skrypt duszka "Tor Wyścigowy"

Konsekwencją osadzenia duszka “samochód” w centralnym punkcie ekranu, jest konieczność niestandardowego podejścia do kodowania jego “jazdy”. W proponowanym rozwiązaniu, to nie samochód będzie się poruszał, tylko droga po której jedzie. W tym celu tworzymy skrypt ruchu w zakładce duszka “droga”:

Uwaga! W ustawieniach stylu obrotu duszka “droga” należy ustawić tryb “nie obracaj”. Wówczas duszek nie reaguje na zmianę kierunku, porusza się zgodnie ze swoim kierunkiem:

Przeszkody

Czas realizacji: 30 minut

Jednym ze sposobów uniemożliwiającym graczom przejechanie z linii startu do mety "na skróty", jest umiejscowienie wewnątrz Toru Wyścigowego naturalnej przeszkody. W prezentowanym projekcie jest to jezioro, przygotowane jako kopia duszka droga oraz wypełnienie środkowej części kolorem niebieskim. Jezioro można upiększyć roślinami i zwierzakami. Aby uniemożliwić pojazdom ucieczkę daleko poza tor wyścigowy, wokół drogi będą do obszary zieleni.

Uwaga: Analogicznie do ustawień duszka "TorWyścigowy", w ustawieniach grafiki włączony został styl obrotów w opcji nie obracaj.

Część kodu odpowiedzialna za poruszanie się wody oraz obszaru zieleni, może wyglądać w następujący sposób:

A po dodaniu zderzenie, jeżeli samochód dotknie przeszkody gra zostanie zatrzymana:

Uwaga: Ten sam fragment kodu wprowadzamy w skrypcie obu duszków.

Ustawienie zmiennej “prędkość”

Dotychczas zrealizowane etapy umożliwiają osiągnięcie efektu poruszania się samochodu po drodze. Aby urozmaicić i rozwinąć grę można wprowadzić:

1. zmienną “prędkość”:
   • zastępującą wartość wyrażającą liczbę kroków
   • umożliwiajacą uzyskanie efektu przyspieszenia (zwiększanie prędkości)
   • ustawioną w opcji “dla wszystkich duszków”
   • wprowadzoną w skrypcie duszka “droga”
2. zmienną ”maksymalna prędkość”
   • umożliwiającą kontrolę maksymmalnej prędkości pojazdu
   • ustawioną w opcji “tylko dla tego duszka”
   • określoną jako wartość maksymalna 5.

Na tym etapie skrypt duszka “droga” może wyglądać następująco:

Tworzenie planszy startowej oraz budowanie menu gry.

Czas realizacji 15 minut.

Menu prezentowanej wersji gry zawiera jedynie:

• nazwę gry umieszczoną na scenie;
• przycisk rozpoczynający grę oraz nadający sygnał ‘Start’;

Plansza startowa (intro)

Wskazówka. Uczniowie mogą przygotować własne wersje menu startowego. Prace nad zaawansowaną grafiką można zorganizować również w formie zadania do samodzielnego wykonania po zajęciach.

Przycisk “Start”

Przycisk “Start” rozpoczynający grę również warto przygotować w trybie wektorowym edytora grafiki programu Scratch. Wówczas zachowa on wyraźne kontury niezależnie od późniejszej modyfikacji wielkości. Podstawowy skrypt przycisku “Start” może wyglądać następująco:

Uwaga: Jednocześnie należy wprowadzić we wcześniejszych skryptach korektę o ukrycie duszka po kliknięciu w zieloną flagę oraz pojawienie się go wraz z otrzymaniem komunikatu Start.

Meta, check point, wygrana i przegrana

Czas realizacji 20 minut

Cień samochodu

Grafikę gry może uatrakcyjnić dodanie cienia pod samochodem. W tym celu można zduplikowac duszka samochód oraz pomalować na czarno. Skrypty zastępujemy nowymi, umożliwiającymi poruszanie się duszka cień razem z duszkiem samochód:

Uwaga: Na tym etapie można uzupełnić skrypty wszystkich duszków o informacje na temat warstwy (np.: duszek Tor Wyścigowy może zasłaniać duszka samochód jeśli nie ustalimy odpowiedniej kolejności warstw). W dalszej części prac należy kontrolować sytuację w której potrzebne będzie uzupełnienie tych informacji. Aby ustalić kolejność warstw używamy klocków z bloku

Meta i Check Point.

Aby wygrać wyścig trzeba dotrzeć do mety pokonując całą trasę. Tworzymy dwa punkty kontrolne (tzw. check point) sprawdzające czy gracz na pewno przejechał przez wyznaczoną trasę. W skrypcie umieszczony został kod, umożliwiający zasygnalizowanie graczowi zaliczenie punktu kontrolnego (zmiana kostiumu na jaśniejszy kolor):

Kolejnym etapem jest stworzenie duszka meta, reprezentowanego graficznie jako jasny, prosty odcinek. Duszek mety również w ustawieniach styl obrotów ma zaznaczoną opcję nie obracaj. Dodatkowo ustalamy, jaka liczba okrążeń gwarantuje wygraną. Tworzymy zmienną Okrążenia, kodujemy w skrypcie warunek wygranej (jeżeli liczba okrążeń równa jest 3) wynikających ze spełnienia warunku przejechania samochodem przez trzykrotnie przez oba punkty kontrolne.

W skrypcie Puntku Kontrolnego (check point) dodajemy kod

Wygrana!

Dodatkowo można stworzyć duszka wygrana

Porażka

Do gry można dodać duszka sygnalizującego przegraną, w sytuacji, gdy samochód wjedzie do jeziora. Skrypt takiego napisu porażka może wyglądać w następujący sposób:

Uwaga: w skrypie pojawia się funkcjonalnośc polegająca na przejściu do startu gry, wraz z kliknięciem w duszka Przegrana

Dodatkowe opcje Wygrana/Start

Dotychczasowe kody duszków Wygrana/Start zostają rozwinięte w analogiczny sposób:

Odliczanie

Tworzymy duszka odliczanie, który będzie graficzną reprezentacją odliczania przed startem samochodu.

Skrypt duszka odliczanie umożliwia:

• ustawienie duszka w centralnym punkcie planszy
• pojawienie się duszka w chwili rozpoczęcia gry
• zmianę kostiumów od 5 do hasła Go!
• nadanie sygnału 'Start Gry'
• wyzerowanie czasomierza

Uwaga! Wprowadzając element odliczania niezbędna jest zmiana nadawania sygnału start w skrypcie sceny (nadawanie TikTak).

Dodatkowo skrypt można wzbogacić o efekty wizualne:

• zmianę rozmiaru odliczanych liczb
• efekt 'duch' widoczny jako rozpływanie się duszka

Finałowa wersja skryptu duszka "odliczanie":

Efekt nitro

Nitro jest potoczną nazwą tlenku diazotu (podtlenek azotu, N2O), nieorganiznego związku chemicznego, stosowanego m. in.:

• w anestezjologii i stomatologii, jako gaz znieczulający (tzw. gaz rozweselający, zwany "Głupim Jasiem")
• w samolotach typu Messerchmitt, używanych w czasie II Wojny Swiatowej, jako zwiększenie mocy silników tłokowych poprzez wstrzyknięcie podtlenku do komory spalania
• w produkcji spożywczej, jako dodatek do żywności (E942)
• w motoryzacji, ponieważ gaz ten posiada możliwości generowania przyrostów mocy w silniku spalinowym (NOS)

W proponowanej wersji gry 'Wyścigówka' dodany zostanie element nitro, mający na celu zwiększanie mocy pojazdu, czyli powodując jego przyspieszenie. Ponieważ użycie w samochodach 'dopalacza' nitro bywa widoczne jako błyski ognia, narysujemy dwa kostiumy duszka nitro:

Skrypt nitro uwzględnia:

• pojawienie się efektu nitro wraz z wciśnięciem klawisza spacja
• osadzenie w pozycji i kierunku samochodu
• generowanie efektu 'spalania' poprzez pojawienia się klonów duszka nitro wraz z efektem
• zwięszkanie prędkości wraz z jednoczesnym zmniejszaniem się zapasu nitro w zbiorniku (zmienna nitro)
• zmienną 'Los', która:
  • wpływa na wymiar nitro oraz proporcjonalnie występujące zanikanie (efekt duch)
  • wyznaczana jest w sposób losowy w zakresie od 5 do 10

Skrypt duszka nitro przedstawia się następująco:

"Ładowanie nitro"

Dodajemy kolejnego duszka, będącego uzupełnieniem duszka 'nitro'

Uwaga: Warto zwrócić uwagę na nazwy kostiumów, zostaną wykorzystane w kodzie odpowiadającym za zmianę kostiumu!

• w chwili rozpoczęcia gry, zbiornik nitro jest pusty (zmienna 'nitro' równa jest 0, graficznie pusty zbiornik reprezentuje kostium 1)
• każdorazowo zwolniony klawisz spacja powoduje podniesienie poziomu nitro w zbiorniku, aż będzie pełen (graficznie, reprezentuje to kostium 5)
• każdorazowo uruchomiony klawisz spacja, powoduje przyspieszenie samochodu, ale jednocześnie poziom nitro w zbiorniku maleje (zmiany kostiumów od 5 do 1)

W skrypcie zastosowane zostały następujące kody:

• zmianę kostiumów zamyka kod wykorzystujący nazwy kostiumów wyrażone w liczbach:

• zwiększanie poziomu nitro przy zwolnionym klawiszu spacja:

Finalnie skrypt duszka "ładowanie nitro" wygląda w następujący sposób: