Wyścigówka (wersja B): Różnice pomiędzy wersjami

Z Wiki Mistrzowie Kodowania
Skocz do: nawigacji, wyszukiwania
(Informacje)
 
(Nie pokazano 39 wersji utworzonych przez 4 użytkowników)
Linia 1: Linia 1:
 
+
[[Category:Scenariusze Scratch]] [[Category:Mistrzowie Kodowania]]
'''Materiały stworzone w ramach Programu „Mistrzowie Kodowania” finansowanego przez Samsung Electronics Polska'''
+
'''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".'''
  
 
== Informacje==
 
== Informacje==
Linia 22: Linia 22:
 
* wie, jak trzeba korzystać z komputera, żeby nie narażać własnego zdrowia;  
 
* wie, jak trzeba korzystać z komputera, żeby nie narażać własnego zdrowia;  
 
* stosuje się do ograniczeń dotyczących korzystania z komputera.
 
* stosuje się do ograniczeń dotyczących korzystania z komputera.
 +
 +
* Plastyka - perspektywa, pojęcie perspektywy, rodzaje perspektyw
 +
* Geometria - rzutowanie
  
 
===Orientacyjny czas realizacji===
 
===Orientacyjny czas realizacji===
Orientacyjny czas realizacji jednej z proponowanych wersji: 2x 45minut
+
Orientacyjny czas realizacji jednej z proponowanych wersji: '''2 x 45 minut'''
===Poziom trudności===
+
* dla klas 1-3 ✪✪✪✰ Wyścigówka [http://scratch.mit.edu/projects/25909243/ Wersja A]
+
* dla klas 4-6 ✪✪✪✰ Wyścigówka [http://scratch.mit.edu/projects/25488659/ Wersja B]
+
* dla gimnazjum ✪✪✰✰
+
===Gotowe projekty===
+
Wersja z grafiką, bez skryptu dostępna jest [http://scratch.mit.edu/projects/25996540/ tutaj]
+
Poglądowy projekt [http://scratch.mit.edu/projects/25826861/ Gra wyścigowa] oraz [http://scratch.mit.edu/projects/25827069/ Wersja z rankingiem zwycięstw]
+
  
== Cele ==
+
===Poziom trudności i proponowane wersje===
Celem projektu jest stworzenie przez uczniów gry zręcznościowej typu wyścig. W proponowanym projekcie jest to [http://scratch.mit.edu/projects/25251429/ 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)
+
* dla klas 1-3 ✪✪✪✰ przejdź do scenariusza [[Wyścigówka (wersja A)]] lub zobacz gotowy projekt Wyścigówka [http://scratch.mit.edu/projects/25909243/ Wersja A]
 +
* dla klas 4-6 ✪✪✪✰ [[Wyścigówka (wersja B)]] (ten scenariusz), zobacz gotowy projekt Wyścigówka [http://scratch.mit.edu/projects/25911076/ Wersja B]
 +
* dla gimnazjum ✪✪✰✰ przejdź do scenariusza [[Wyścigówka (wersja C)]] lub zobacz gotowy projekt Wyścigówka [http://scratch.mit.edu/projects/25955675/ Wersja C]
  
=== Cele ogólne: ===
+
Dodatkowe projekty:
* przypomnienie i utrwalenie poznanych wcześniej poleceń i konstrukcji języka Scratch
+
* Wersja z grafiką, bez skryptu dostępna jest [http://scratch.mit.edu/projects/25996540/ tutaj]
* opracowanie projektu gry zręcznościowej
+
* Poglądowy projekt [http://scratch.mit.edu/projects/25826861/ Gra wyścigowa]
* implementacja projektu w środowisku Scratch
+
* [http://scratch.mit.edu/projects/25827069/ Wersja z rankingiem zwycięstw]
  
=== Cele szczegółowe: ===
+
===Orientacyjny czas realizacji===
* uczeń rozumie i potrafi stosować odpowiednie instrukcje strukturalne
+
Orientacyjny czas realizacji jednej z proponowanych wersji: 3 x 45minut
* uczeń rozumie pojęcie zmiennej i wykorzystuje je w programie Scratch
+
* uczeń potrafi konstruować skrypty zawierające zmienną
+
* uczeń potrafi implementować grę w środowisku Scratch
+
  
=== Zgodność z Podstawą Programową ===
+
==Etapy==
* plastyka - perspektywa, pojęcie perspektywy, rodzaje perspektyw
+
Wprowadzenie teoretyczne do projektowania gry typu “wyścig”, przygotowanie kostiumów duszków “droga” i “samochód”.
* geometria - rzutowanie
+
* przyroda - mapy
+
* informatyka
+
 
+
== Etapy realizacji ==
+
=== Wprowadzenie teoretyczne do projektowania gry typu “wyścig”, przygotowanie kostiumów duszków “droga” i “samochód”. ===
+
 
==== Wprowadzenie. ====
 
==== Wprowadzenie. ====
Czas realizacji 10 minut.
+
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 [[https://www.youtube.com/watch?v=T4Gq5NSnvK4 Reckless Racing ]] ).
+
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 [//www.youtube.com/watch?v=T4Gq5NSnvK4 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 sceny ponieważ będzie on przydatny dla wszystkich duszków. Dodatkowo stworzymy też nadawanie sygnału ''start!'', 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...).
 +
 
 +
[[Plik:Wa scena skrypt.PNG]]
  
 
==== Przygotowanie duszka pojazdu oraz trasy wyścigu. ====
 
==== Przygotowanie duszka pojazdu oraz trasy wyścigu. ====
Czas realizacji 15* minut.
+
Czas realizacji 20 minut.
 +
 
 
'''Uwaga!'''
 
'''Uwaga!'''
Jeśli dysponujemy ograniczonym czasem pracy, zaproponujmy uczniom stworzenie zarysu duszków, które mogą zostać dopracowane graficznie samodzielnie podczas indywidualnej pracy uczniów w domu.
+
Jeśli dysponujemy ograniczonym czasem pracy, możemy wykorzystać projekt posiadający gotowe grafiki ( [http://scratch.mit.edu/projects/25996540/ 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”.  
 
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”.  
  
'''Uwaga!'''
+
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.
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” =====  
===== Tworzenie duszka “droga” będącego trasą toru wyścigowego. =====  
+
 
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.
 
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.
  
[[Plik:Gra wyscigowa droga.jpg]]
+
[[Plik:Wa torwyscigowy.PNG]]
  
 
===== Tworzenie duszka samochodu. =====  
 
===== Tworzenie duszka samochodu. =====  
Na potrzeby niniejszego scenariusza przygotowane zostały dwie propozycje samochodów:
+
Przygotowujemy grafikę pojazdu, uwzględniając proporcje duszków "TorWyścigowy" i "Samochód"
  
[[Plik:Gra wyscigowa auta.jpg]]
+
[[Plik:Wa samochód.PNG]]
  
Wskazówka:
+
=== Budowanie skryptu sterowania i poruszania się, tworzenie menu gry. ===
Kostium duszka, narysowany jako widok z perspektywy lotu ptaka, powinien umożliwić łatwą identyfikację przodu-tyłu pojazdu lub postaci (np.: w przypadku zielonego samochodu jest to wyraźnie zaznaczona przednia szyba pojazdu).
+
 
+
==== Wstęp do budowania skryptu. ====
+
 
Czas realizacji: 15 minut
 
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.:
  
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 [https://www.youtube.com/watch?v=oswkLE4mGLI River Ride] tj.: nadanie efektu “ruchu” postaci droga, czyli trasie wyścigu.
  
* '''W którym momencie samochód ma rozpocząć jazdę?''' Zazwyczaj rozpoczęcie gry klawiszem “Kiedy kliknięto zieloną flagę” inicjuje pojawienie się planszy startowej (intro), na której znajdują się podstawowe instrukcje oraz przycisk rozpoczynający grę “Start”. Warto zatem od razu ustalić, że ruch pojazdu inicjuje inny komunikat, np.: otrzymanie wiadomości “Start”.
+
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”.
* '''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 gry “rakieta” tj.: nadanie efektu “ruchu” postaci droga, czyli trasie wyścigu.  
+
  
'''Uwaga!'''
+
[[Plik:Wa skrypt samochod.PNG]]
Jeśli zajęcia realizujemy w blokach trwających 45minut, możemy zakończyć ten etap w formie zadania do samodzielnego rozwiązania przez uczniów w domu. Wówczas kolejne zajęcia należy rozpocząć od przypomnienia zrealizowanych etapów oraz od omówienia propozycji uczniów.
+
  
=== Budowanie skryptu sterowania i poruszania się, tworzenie menu gry. ===
+
====Skrypt duszka "Tor Wyścigowy"====
====Skrypt sterowania jazdą samochodu.====
+
Czas realizacji: 20 minut
+
  
Proponowane w scenariuszu rozwiązanie zakłada następujące etapy realizacji gry:
+
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”:
  
===== Skrypt obrotu samochodu (ustawianie kierunku jazdy)=====
+
[[Plik:Wa skrypt droga.PNG]]
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”
+
Uwaga!
+
W proponowanym skrypcie dodatkowo wprowadzony został element pętli umożliwiającej stałe sprawdzanie czy stan klawisza “strzałka lewo/prawo” nie uległ zmianie. Pętla powstała poprzez wprowadzenie polecenia “zawsze nadaj wiadomość” oraz “kiedy otrzymam tick”. To rozwiązanie umożliwia zsynchronizowanie wszystkich pętli, uruchamianych w tym samym czasie.  
+
  
[[Plik:Gra wyscigowa skrypt auta.jpg]]
+
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:
  
===== Skrypt imitujący jazdę samochodu. =====
+
[[Plik:Gra wyscigowa skrypt droga.jpg]]
Konsekwencją osadzenia “samochodu” 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”:
+
  
[[Plik:Gra wyscigowa skrypt auta2.jpg]]
+
====Przeszkody====
 +
Czas realizacji: 30 minut
  
Uwaga!
+
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.
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.  
+
  
[[Plik:Gra wyscigowa skrypt droga.jpg]]
+
[[Plik:Wa woda.PNG]] [[Plik:Wa obszarzielony.PNG]]
  
===== Ustawienie zmiennej “prędkość” =====
+
'''Uwaga:'''
Dotychczas zrealizowane etapy umożliwiają osiągnięcie efektu poruszania się samochodu po drodze. Aby urozmaicić i rozwinąć grę można wprowadzić zmienną “prędkość”. Prędkość będzie zastępowała wartość wyrażającą liczbę kroków oraz umożliwi uzyskanie efektu przyspieszenia (zwiększanie prędkości).
+
Analogicznie do ustawień duszka "TorWyścigowy", w ustawieniach grafiki włączony został styl obrotów w opcji nie obracaj.
Uwaga!
+
Zmienna prędkość musi być ustawiona w opcji “dla wszystkich duszków”
+
  
[[Plik:Gra wyscigowa skrypt droga2.jpg]]
+
Część kodu odpowiedzialna za poruszanie się wody oraz obszaru zieleni, może wyglądać w następujący sposób:
  
 +
[[Plik:Wa skrypt1.PNG]]
  
Uwzględnienie prędkości samochodu kodujemy, analogicznie do informacji o ruchu, w skrypcie duszka “droga”. Dodatkowo warto dodać maksymalną prędkość samochodu Tworzymy zmienną dostępną tylko dla tego duszka i ustawimy ją np. na 2.
+
A po dodaniu zderzenie, jeżeli samochód dotknie przeszkody gra zostanie zatrzymana:
Na tym etapie skrypt duszka “droga” może wyglądać następująco:
+
  
Skrypt do uzupełnienia o jeżeli prędkość <0 to ustaw prędkość na 0
+
[[Plik:Wa skrypt2.PNG]]
 +
 
 +
'''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ć:
 +
# 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”
 +
# zmienną ”maksymalna prędkość”
 +
#* ograniczającą prędkość do maksymalnej liczby kroków (przykładowo - 5)
 +
#* umożliwiającą jej kontrolę
 +
#* ustawioną w opcji “tylko dla tego duszka”
 +
 
 +
Na tym etapie skrypt duszka “droga” może wyglądać następująco:
  
[[Plik:Gra wyscigowa skrypt droga3.jpg]]
+
[[Plik:Gra wyscigowa skrypt droga32.jpg]]
  
 
==== Tworzenie planszy startowej oraz budowanie menu gry. ====
 
==== Tworzenie planszy startowej oraz budowanie menu gry. ====
Czas realizacji 20 minut.
+
Czas realizacji 15 minut.
  
 
Menu prezentowanej wersji gry zawiera jedynie:
 
Menu prezentowanej wersji gry zawiera jedynie:
Linia 141: Linia 140:
 
* nazwę gry umieszczoną na scenie;   
 
* nazwę gry umieszczoną na scenie;   
 
* przycisk rozpoczynający grę oraz nadający sygnał ‘Start’;  
 
* przycisk rozpoczynający grę oraz nadający sygnał ‘Start’;  
* miejsce na ranking;
 
* przycisk zerujący podium.
 
  
 
===== Plansza startowa (intro)=====
 
===== 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.
 
Bazowa plansza startowa to tło “scena” z podaną nazwą gry (w tym wypadku Track Car):
 
  
[[Plik:Gra wyscigowa intro.jpg]]
+
[[Plik:Wyscigowka intro.PNG]]
 +
 
 +
'''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” =====
 
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:
 
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:
  
[[Plik:Gra wyscigowa przycisk start.jpg]]
+
[[Plik:Wyscigowka start.PNG]]
  
===== Zmienne globalne rankingu.=====
+
'''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''.
Jednym z elementów uatrakcyjniających gry zręcznościowe jest możliwość porównywania uzyskanych wyników. Aby porównywać rezultaty warto stworzyć zmienne globalne rankingu. W przykładowym scenariuszu zostały stworzone nastepujące zmienne:
+
* czas
+
* nick
+
  
Obie zmienne przygotowane zostały dla trzech najlepszych spośród uzyskanych wyników. Zmienne te umożliwią przechowywanie czasu okrążenia oraz nick gracza. Do duszka startu dodamy dodatkowe skrypty odpowiedzialne za ranking. Aby zmienne były widoczne na planszy startowej, a znikały po uruchomieniu gry, należy uzupełnić skrypt duszka “Start”.
+
=== Meta, check point, dodatki do samochodu. ===
 +
Czas realizacji 20 minut
  
[[Plik:Gra wyscigowa zmmienne rankingu.png]]
+
====Cień samochodu====
 
+
Jednocześnie na ekranie  może zostać dodany licznik z działu klocków “czujniki”:
+
 
+
[[Plik:Gra wyscigowa czujniki.png]]
+
 
+
Dodatkowo stwórzmy duszka który będzie nam resetował podium.
+
 
+
[[Plik:Gra wyscigowa reset podium.jpg]]
+
+
Na tym etapie menu przykładowe menu może wyglądać następująco:
+
 
+
[[Plik:Gra wyscigowa intro2.jpg]]
+
 
+
Uwaga!
+
Ranking w tej formie nie działa ponieważ wymaga dokończenia poprzez dodanie mety na trasie (patrz: Moduł 3)
+
 
+
=== Zaawansowane opcje gry - nitro, przeszkoda, dodatki do samochodu oraz meta i check point. ===
+
====Cień samochodu i światła.====
+
  
 
Grafikę gry może uatrakcyjnić dodanie cienia pod samochodem. W tym celu można zduplikowac duszka ''samochód'' oraz pomalować na czarno.  
 
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'':
 
Skrypty zastępujemy nowymi, umożliwiającymi poruszanie się duszka ''cień'' razem z duszkiem ''samochód'':
  
[[Plik:Wyscigówka cien.jpg]]
+
[[Plik:Wyscigowka cien.PNG]]
  
Dodatkowo można przygotować duszka ''światła''
+
'''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 [[Plik:Klocek warstwy.png]]
[[Plik:Wyscigówka swiatla.jpg]]
+
 
+
Do świateł wykorzystujemy opcję [[zmienna lokalna]], która będzie przechowywała stan świateł (włączone/wyłączone).
+
 
+
[[Plik:Wyscigowka skrypt swiatla.jpg]]
+
 
+
====Wielka przeszkoda. Jezioro!====
+
 
+
Jednym ze sposobów uniemożliwiającym graczom przejechanie z linii startu do mety "na skróty" jest umiejscowienie wewnątrz pętli ''droga'' 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.
+
 
+
[[Plik:Jezioro grafika.jpg]]
+
 
+
W ustawieniach grafiki włączony został [[styl obrotów]] w opcji ''nie obracaj''.
+
 
+
[[Plik:Jezioro nie obracaj.jpg]]
+
 
+
Część kodu odpowiedzialna za poruszanie się naszej wody może wyglądać w następujący sposób:
+
 
+
[[Plik:Jezioro skrypt.jpg]]
+
  
 
==== Meta i Check Point. ====
 
==== Meta i Check Point. ====
  
Aby wygrać wyścig trzeba dotrzeć do mety pokonując trasę. Tworzymy duszka ''meta'' oraz tzw. ''check point'' sprawdzające czy gracz na pewno przejechał przez wyznaczoną trasę. W prezentowanej wersji stworzone zostały tylko dwa punkty kontrolne, położone tuż przed metą. W skrypcie umieszczone zostały zmienne: ''okrążenie'' przechowujące ilość pokonanych okrążeń, ''pierwsze_sprawdzenie'' oraz ''drugie_ sprawdzenie'', informujące czy dane punkty kontrolne (check point) zostały zaliczone.
+
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):
 
+
[[Plik:Check point meta1.jpg]]
+
 
+
[[Plik:Check point meta2.jpg]]
+
  
Teraz stworzymy metę - reprezentowaną graficznie jako jasny, prosty odcinek. Duszek mety również w ustawieniach [[styl obrotów]] ma zaznaczoną opcję ''nie obracaj''.
+
[[Plik:Wyscigowka skrypt checkpoint.PNG]]
  
[[Plik:Skrypt meta.jpg]]
+
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.
  
==== Przegrana ====
+
[[Plik:Wyscigowka meta.PNG]]
Do gry można dodać duszka sygnalizującego przegraną, w sytuacji, gdy samochód wjedzie do jeziora. Skrypt takiego napisu ''przegrana'' może wyglądać w następujący sposób:
+
  
[[Plik:Duszek przegrana.jpg]]
+
==== Wygrana! ====
 +
Dodatkowo można stworzyć duszka ''wygrana''
  
Innym rozwiązaniem może być wypowiedź kierowcy samochodu np. „O nie! Toniemy! Przegraliśmy!”.
+
[[Plik:Wyscigowka wygrana2.PNG]]
  
==== Wygrana! Ranking zwycięstw ====
+
==== Porażka ====
Gra jest gotowa. Można ożywić ranking poprzez stworzenie duszka ''wygrana''. Będzie to napis informujący o wygranej, a przy okazji sprawdzający czy nasz znaleźliśmy się na podium. Opcjonalnie cały ranking można wyzerować przypisanym klawiszem.
+
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:
  
[[Plik:Ranking.png]]
+
[[Plik:Wyscigowka porazka2.PNG]]

Aktualna wersja na dzień 12:01, 7 lis 2014

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".

Informacje

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: 2 x 45 minut

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 ✪✪✪✰ Wyścigówka (wersja B) (ten scenariusz), zobacz gotowy projekt Wyścigówka Wersja B
  • dla gimnazjum ✪✪✰✰ przejdź do scenariusza Wyścigówka (wersja C) lub zobacz gotowy projekt Wyścigówka Wersja C

Dodatkowe projekty:

Orientacyjny czas realizacji

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

Etapy

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 sceny ponieważ będzie on przydatny dla wszystkich duszków. Dodatkowo stworzymy też nadawanie sygnału start!, 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...).

Wa scena skrypt.PNG

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.

Wa torwyscigowy.PNG

Tworzenie duszka samochodu.

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

Wa samochód.PNG

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”.

Wa skrypt samochod.PNG

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”:

Wa skrypt droga.PNG

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:

Gra wyscigowa skrypt droga.jpg

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.

Wa woda.PNG Wa obszarzielony.PNG

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:

Wa skrypt1.PNG

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

Wa skrypt2.PNG

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ść”
    • ograniczającą prędkość do maksymalnej liczby kroków (przykładowo - 5)
    • umożliwiającą jej kontrolę
    • ustawioną w opcji “tylko dla tego duszka”

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

Gra wyscigowa skrypt droga32.jpg

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)

Wyscigowka intro.PNG

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:

Wyscigowka start.PNG

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, dodatki do samochodu.

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:

Wyscigowka cien.PNG

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 Klocek warstwy.png

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):

Wyscigowka skrypt checkpoint.PNG

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.

Wyscigowka meta.PNG

Wygrana!

Dodatkowo można stworzyć duszka wygrana

Wyscigowka wygrana2.PNG

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:

Wyscigowka porazka2.PNG