W ostatnim wpisie opisałam jak zaplanować swoją własną grę, dzisiaj tematem przewodnim jest hasło “Scratch – jak to działa ?”.

Czy wiesz już jak będzie wyglądała Twoja pierwsza gra w Scratch ’u? Jeżeli jeszcze się nad tym nie zastanawialiście ( Ty i Twoje dziecko), zajrzyj proszę do poprzedniego wpisu. Znajdziesz tam instrukcję jak krok po kroku skonkretyzować swoją wizję gry 🙂

Jest to kolejny wpis z serii „Scratch – pierwsza gra

Poprzednie posty to:

Scratch – pierwsza gra

Tak jak obiecałam, dzisiaj zajmiemy się tym, jak poruszyć duszki w Scratch ‘u. Dla przypomnienia, duszkiem nazywamy wszystkie elementy programu w Scratch’ u, które mogą być zaprogramowane.

Główne tematy poruszone w tym wpisie to:

  • Jak dodać muzyczkę do naszej gry ?
  • Bloki w Scratch – jak to działa ?
  • Jak sprawić, żeby kotek poruszał się tanecznym krokiem reagując na klawisze w prawo i w lewo ?
  • Jak sprawić żeby przedmioty spadały z góry?

Zanim zaczniemy pracę nad grą.

Zanim zaczniemy programowanie koniecznie przypomnijcie sobie, jaką historię opowiada Wasza gra. Niech ten czas będzie dla Was nie tylko nauką poszczególnych elementów Scratch ‘a, ale przede wszystkim czasem na zabawę i kreatywność 🙂

Tematem przewodnim naszej gry będzie historia kotka, który marzył, żeby być muzykiem. Niestety nie umiał grać na żadnym instrumencie. Ale żeby nauczyć się grać potrzebny jest instrument. Kotek musi zatem takowy zdobyć. Niestety, jak to w życiu zwykle bywa, nic nie jest takie proste jak się wydaje. Co prawda z góry spadają instrumenty muzyczne, ale także głośniki, które mogą zwyczajnie przygnieść kotka…

Otwieramy projekt.

Żeby otworzyć projekt nad którym ostatnio pracowaliśmy, wchodzimy na stronę https://scratch.mit.edu. Jeżeli nie jesteś zalogowany – zaloguj się. Wybierz opcję „Moje rzeczy”, po czym odszukaj swój projekt:

 

 

Wybierając opcję: „Zajrzyj do środka”, znajdziesz się w edytorze i będziesz mógł razem ze swoim dzieckiem rozpocząć kolejny etap tworzenia gry.

Teraz proponuję Wam „posprzątać” trochę scenę. Chcemy, żeby na scenie pozostały tylko te elementy, które aktualnie będą programowane. W tym celu we wszystkich duszkach oprócz głównego bohatera odznaczamy opcję „pokaż”. Opcja ta jest dostępna po kliknięciu ikonki „i” na duszku.

 

 

Jak wybrać muzyczkę do naszej gry ?

Jesteśmy już wprowadzeni w historię naszej gry, więc możemy zabrać się za kolejne kroki 🙂

Na początek dodamy do naszej gry wesołą muzyczkę.

Pamiętajcie, że to co stworzycie musi być przede wszystkim Wasze, lekkie i przyjemne, a aktywność którą tutaj proponuje ma być przede wszystkim czasem, który w kreatywny sposób spędzisz ze swoim dzieckiem. To czy ono „załapie coś” z programowania jest naprawdę rzeczą wtórną. Liczy się dobra zabawa!

Ale muszę tutaj Cię zapewnić, że zdziwisz się jak szybko dzieciaki nauczą się korzystać z edytora 🙂

No dobrze, ale wracając do muzyczki. Muzyka, podobnie jak duszki, czy tła, ma swoja bibliotekę w Scratch ‘u więc śmiało możecie z niej skorzystać. Natomiast, jeżeli macie jakiś inny motyw, który lubicie, a którego tam nie ma, możecie go dodać do tworzonej przez Was gry.

Ja oczywiście pokażę jaki motyw my wybraliśmy 🙂

Ponieważ muzyczka, jest czymś, co powinno grać niezależnie od duszków (chyba że Wasz plan jest inny), będziemy ją umieszczać w kontekście sceny.

Czym jest scena mówiła w poprzednim wpisie, jeżeli jeszcze go nie przeczytałeś zachęcam do zapoznania się z treściami w nim zawartymi :).

W lewej, dolnej części edytora wybieramy ikonkę sceny.

W tzw. obszarze roboczym, pojawią się wówczas trzy zakładki: „Skrypty”, „Tła”, „Dźwięki”. Wybieramy zakładkę dźwięki, a następnie ikonkę głośniczka  („Wybierz dźwięk z biblioteki” ). W kategorii „Sample muzyczne” znajdziecie trwające, kilka czy kilkanaście sekund fragmenty muzyczne.

 

My naszego wyboru dokonywaliśmy poprzez przesłuchanie wszystkich fragmentów, zapisując na kartce nazwy sampli, które wpadły nam w ucho, po czym przesłuchaliśmy jeszcze raz fragmenty, wcześniej zapisane i dokonaliśmy ostatecznego wyboru :).

Podło na „dance around”.

Pamiętajcie, żeby dać sobie czas i pozwolić dziecku nacieszyć się możliwością dokonywania wyborów. Każdy kolejny wybór sprawia, że gra jest bardziej personalna, a tym samym bardziej się chce ja tworzyć, a później udoskonalać 🙂

Bloki w Scratch – jak to działa ?

Czas na pierwsze bloki i programowanie!

Pisałam już, że programowanie w Scratch ‘u polega na odpowiednim zaprogramowaniu duszków. Dodatkowo jednak mamy miejsce w którym możemy zaprogramować rzeczy, które z duszkami nie są ściśle związane.  Takim miejscem jest scena. Tak jak przy wyborze muzyczki, zaznaczamy ikonkę sceny, ale tym razem wybieramy zakładkę „Skrypty”.

 

W lewym górnym rogu tejże zakładki, znajdują się bloki, z których będziemy tworzyć nasz program. Są one odpowiednio pogrupowane, a każda grupa bloków oznaczona jest innym kolorem.

Ja oczywiście tutaj nie będę opisywała poszczególnych grup, czy bloczków. Jeżeli czujecie, że jest to Wam potrzebne i że zanim zaczniecie programować potrzebujecie wyjaśnienia wszystkich elementów, dajcie proszę znać, a ja postaram się opisać to w innym poście.

Zawsze też możecie skorzystać z wbudowanej pomocy. W tym celu wybierzcie ikonkę pytajnika znajdująca się w prawym górnym rogu obszaru roboczego, następnie „All Tips”, „Bloki”, a potem już wybieracie konkretną kategorię oraz konkretny blok. Znajdziecie tam wyjaśnienie, niestety z tego, co widzę na tą chwilę tylko w języku angielskim, oraz przykład użycia wybranego bloku.

Tutaj będę opisywała tylko te elementy z których korzystamy, ewentualnie z których próbowaliśmy skorzystać podczas tworzenia naszej gry.

Jak sprawić, żeby muzyczka zagrała ?

Przypominam, że naszym aktualnym celem jest sprawienie, żeby wybrana przez nas muzyczka trwała przez cały czas gry.

Zacznę od tego, że projektując grę, zwykle chcemy, żeby coś wydarzyło się w wyniku jakiejś akcji, czyli zdarzenia. Przejdźcie zatem do sekcji „Zdarzenia” i zobaczcie jakie zdarzenie najbardziej pasuje do naszego celu.

My chcemy, żeby muzyka włączyła się w momencie startu gry. Grę startujemy wciskając zieloną flagę w prawym, górnym rogu sceny (stopujemy ją wykorzystując czerwony ośmiokąt).

Prawdopodobnie tym, co nas interesuje jest bloczek „kiedy kliknięto zieloną flagę”. Żeby go użyć, poprzez przeciąganie umieszczamy go w obszarze roboczym i gotowe mamy punkt startowy 🙂

Co teraz?

Teraz chcemy żeby wybrany przez nas dźwięk został zagrany. Przechodzimy zatem na zakładkę „dźwięk” i pierwszy bloczek jaki nam pasuje to oczywiście „zagraj dźwięk”.

Dzięki temu, że wcześniej, w zakładce „Dźwięki” wybraliśmy już muzyczkę, która nam odpowiada, pojawi się ona na liście rozwijanej w tym bloczku, a najprawdopodobniej jest nawet już wybrana.

Przeciągamy zatem bloczek „zagraj dźwięk” i „doczepiamy” do wybranego wcześniej bloczka startowego. Jeżeli jest taka potrzeba to po naciśnięciu strzałki, z listy rozwijanej wybieramy nasz utwór.

Czas na pierwszy test !

Jeżeli podczas dotychczasowych akcji, to Ty byłeś głównym operatorem myszki, teraz KONIECZNIE pozwól, żeby to dziecko nacisnęło zieloną flagę 🙂

I jak tam, muzyczka zagrała?

Tylko czemu tak szybko się kończy?

Program, który napisaliśmy sprawia, że wybrany przez nas utwór zostanie odegrany dokładnie raz.

Pętle

Znacie pojęcie pętli w programowaniu? Jeżeli tak to super! A jeżeli nie, to nic straconego – w wolnej chwili zapraszam do moich poprzednich wpisów o pętli licznikowej i pętli warunkowej. Możecie tam zapoznać się z teorią dotyczącą tych konstrukcji, a także wykonać kilka ćwiczeń, które pozwolą Wam utrwalić zdobytą wiedzę ( aktywności beż użycia komputera ).

Wyjaśnienie na teraz: pętla jest to coś, co pozwala komputerowi na wykonywanie określonych działań określoną lub nieskończoną ilość razy. Ta ilość razy może być określona przez liczbę lub jakiś warunek.

Możesz powiedzieć: „Idź dziesięć kroków”, albo „Idź aż dojdziesz do ściany”, albo po prostu „Idź”.

Jak sprawić, żeby muzyczka grała przez cały czas trwania gry?

W Scratch ‘u pętle znajdują się w sekcji „Kontrola”. Ponieważ chcemy chcemy, żeby muzyczka płynęła przez cały czas trwania gry, nasz wybór pada na bloczek „zawsze”. Zauważcie, że wszystkie bloczki, oznaczające pętle mają taki kształt, który pozwala wkładać inne bloczki w ich środek. Możemy tam wstawić dowolną ilość innych bloczków.

Po przeorganizowaniu nasz program wygląda następująco:

Mamy bloczek startowy, następnie pętla w której znajduje się bloczek „zagraj dźwięk”.

Jak myślicie – zadziała?

Czas na test 🙂

Hmm, chyba czegoś tu jeszcze brakuje. Okazuje się, że bloczek „zagraj dźwięk” nie dba o to, żeby wybrany przez nas utwór został zagrany do końca.

Przechodzimy do sekcji „Dźwięk” i szukamy czegoś, co bardziej odpowiada na nasze potrzeby. Na szczęście istnieje bloczek „zagraj dźwięk i czekaj”.

Mamy teraz taki program:

Przetestujmy jak to działa.

Super !

To jest dokładnie to, o co chodziło. Muzyka gra od momentu wciśnięcia zielonej flagi, tak długo jak chcemy. Możemy ją zatrzymać, zatrzymując grę, czyli wciskając czerwony ośmiokąt.

Dobra robota !

Jak sprawić, żeby kotek poruszał się reagując na klawisze w prawo i w lewo ?

Kolejne zadanie na dzisiaj to poruszenie kotka.

W sekcji „Duszki” wybieramy naszego głównego bohatera ( u nas jest to kotek ). W sekcji skrypty wybieramy kategorię zdarzenia i szukamy zdarzeń, na które chcemy, żeby reagował nasz duszek.

Ponieważ naszym założeniem jest, żeby kotek poruszał się w prawo i w lewo w granicach sceny, zdarzeniami, które będziemy obsługiwać są:

„kiedy klawisz strzałka w prawo naciśnięty”

oraz

„kiedy klawisz strzałka w lewo naciśnięty”

Tak naprawdę wykorzystujemy w tym celu jedno zdarzenie, tylko z różnymi parametrami.

Zarówno dla strzałki w lewo, jak i strzałki w prawo przeciągamy bloczek „kiedy klawisz … naciśnięty”, a następnie z listy rozwijanej (po naciśnięciu strzałki w dół) wybieramy „strzałka w lewo”, a w drugim bloczku „strzałka w prawo”.

Wiemy już na jakie zdarzenia będzie reagował nasz kotek, teraz zastanówmy się jak ma on zareagować ?

Najlepiej jakby poruszał się w prawo i w lewo 🙂

Przechodzimy do sekcji „Ruch” i wybieramy bloczek, który najlepiej pasuje do tego, co chcemy osiągnąć.

My wybraliśmy bloczek „przesuń o 10 kroków”. Oczywiście w miejscu liczby 10 można wybrać dowolną liczbę. Dla nas była ona ok, więc zostawiliśmy domyślną wartość.

Bloczek podczepiamy pod zdarzenie, „kiedy klawisz strzałka w prawo naciśnięty” i sprawdzamy jak to działa 🙂

Pamiętajcie, żeby testować wszystkie, najmniejsze nawet części Waszego programu. Dzięki temu nie tylko widzicie, że Wasza praca daje efekty, ale także uniknięcie szukania błędu w rozrośniętych już programach.

Faktycznie nasz program powoduje, że po naciśnięciu strzałki w prawo, nasz kotek porusza się w prawo. Co prawda chcieliśmy, żeby kroczył, a on raczej sunie… Ale na początek i tak jest super! Kotek porusza się.

Czas na strzałkę w lewo.

Powtórzmy zatem to dla strzałki w lewo. Wybieramy ten sam bloczek „przesuń o 10 kroków” i sprawdzamy jak to działa.

O nie ! Okazuje się, że kotek niezależnie od tego czy naciśniemy strzałkę w lewo czy w prawo przesuwa się w prawo.

Czas na wyjaśnienie:

Duszki w Scratch ‘u w poziomie poruszają się po osi x, której wartości wynoszą o -240 do 240 i rosną ze strony lewej na prawą. „przesuń o 10 kroków” oznacza zatem, że położenie kotka na osi x „urośnie”  o 10, co skutkuje tym, ze kotek przemieści się w prawo.

Jeżeli chcemy przesunąć duszka w lewo, musimy zmniejszyć wartość oznaczającą położenie kotka na osi x, czyli jako liczbę kroków przekazać wartość ujemną.

W uproszczeniu: jeżeli chcemy, żeby duszek poruszał się w prawo musimy użyć bloczka „przesuń o 10 kroków”, natomiast jeżeli chcemy, żeby kotek przesuną się w lewo, użyjemy opcji „przesuń o -10 kroków”.

Ostatecznie skrypty dla naszego kotka wyglądają następująco:

Czas na test 🙂

Kotek sunie w prawo i w lewo w zależności od tego, którą strzałkę naciśniemy !

Kolejny sukces na naszym koncie !

Jak sprawić, żeby kotek poruszał się tanecznym krokiem ?

Ponieważ totalnie nie spodobał nam się posuwisty ruch kotka, tym bardziej, że poruszając się w prawo jest co prawda skierowany przodem do ruchu, ale w lewo porusza się do tyłu… Postanowiliśmy coś z tym zrobić. Po kilku próbach zdecydowaliśmy się na „krok taneczny” , ponieważ pasuje to do tematyki naszej gry i jak mówi moje dziecko „epicko wygląda” 😉

Żeby osiągnąć pożądany efekt musimy przygotować kilka kolejnych kostiumów, które następnie będziemy wyświetlać jeden po drugim.

Znajdując się w kontekście kotka, przechodzimy na zakładkę kostiumy. Domyślne kostiumy jakie zastaliśmy w tej zakładce:

Z  biblioteki (tej samej z której wybieraliśmy duszki – ikonka twarzy) wybieramy jeszcze raz te dwa kostiumy, jeden po drugim. Nasze nazywają się cat1-a oraz cat1-b.  Zaznaczamy cat1-a  i wybieramy ikonkę „Przerzuć lewo-prawo” znajdującą się w prawym górnym rogu. Mamy kotka odwróconego w lewo. Analogicznie postępujemy z cat1-b.

Czas na nazwanie kostiumów. Dla kotków skierowanych w prawo wybraliśmy nazwy „prawo1”, „prawo2”, natomiast tych skierowanych w lewo – „lewo1”, „lewo2”. Nazwy wpisujemy w edytowalnym polu w lewym górnym rogu. Oto nasz zestaw kostiumów:

Teraz wystarczy przejść do zakładki “Skrypty” i z sekcji „Wygląd” wybrać „następny kostium”. Metoda ta sprawia, że za każdym razem, kiedy klikniemy strzałkę w lewo, bądź w prawo, duszek nie tylko przemieści się na planszy, ale także zmieni swoją pozę.

Polecenie dodajemy zarówno do zdarzenia związanego z ruchem w prawo, jak i lewo.

Gotowe skrypty:

I oczywiście sprawdzamy jak to działa 🙂

Nasz kolek porusza się krokiem tanecznym !

Jak sprawić żeby przedmioty spadały z góry?

To już ostatnie zadanie na dzisiaj. Sprawimy, że głośnik będzie spadał z góry na dół. Jak to działa ?

Zanim zaczniecie programować, zaznaczcie opcje „pokaż” dla duszka „Głośnik” ( po kliknięciu “i” na miniaturce duszka ).

 

Ponieważ nie chcemy wiedzieć, kiedy głośnik spadnie nie może to odbywać się w wyniku zdarzania wynikającego np. z naciśnięcia jakiegoś przycisku. Najlepiej gdyby działo się to w jak najbardziej losowym momencie.

Na szczęście niemal w każdym języku programowania istnieje metoda, która pozwala na generowanie losowych liczb. Jak to działa w Scratch ‘u?  Jest do tego dedykowany specjalny blok. Znajduję się on w zielonej sekcji „Wyrażenia” – „losuj od 1 do 10”. Oczywiście możemy wstawić tutaj dowolne wartości.

Zaczynamy od bloczku „kiedy kliknięto zieloną flagę”. Pamiętacie? Znajduje się on w sekcji „Zdarzenia”. Potem dobrze nam znana pętla „zawsze” (sekcja „Kontrola”) i chwila zastanowienia, co właściwie chcemy żeby działo się „zawsze”. Oczywiście bloczki te umieszczamy w kontekście duszka – Głośnika. W tym celu zaznaczamy głośnik w sekcji „Duszki” 🙂

Starajcie się zawsze programować małymi krokami.

My na początek chcieliśmy, żeby głośnik spadał ciągle w jednym miejscu, ale co losową liczbę sekund.

W tym celu zwyczajnie przesunęliśmy duszka Głośnik jak najwyżej mogliśmy. Przesuwając go w obszarze sceny i do pętli wstawiliśmy polecenie z sekcji „Ruch” „leć przez 1 s do x 31 y -174”. Oczywiście wartości te powinniście ustawić według własnych potrzeb. Polecenie to pozwala płynne przemieszczanie się duszka przez określony przez nas czas, z punktu w którym aktualnie się znajduje do miejsca, które oznaczymy jako punkt docelowy.

Przy określaniu miejsca docelowego, posługujemy się wpółrzędnymi x i y. Przemieszczając kursor po scenie Scratch ‘a w prawym dolnym rogu sceny wyświetlane są współrzędne kursora.

Szybkie sprawdzenie jak to działa.

Świetnie – głośnik spadł, ale już został na dole.

Jak sprawić żeby przedmioty znikały po tym jak spadną?

Nasz pomysł jest taki, że czekamy 1 s, po czym ukrywamy głośnik. Następnie musimy go “przenieść na górę”, ustawiając “y” na powiedzmy 200.

Blok „czekaj” znajduje się w sekcji „Kontrola”, „ukryj ”  i “pokaż”– w sekcji „Wygląd”, natomiast “ustaw y na 200” w sekcji “Ruch”. Dla ułatwienia przypomnę, że kolory bloczków są takie same jak kolory sekcji w których się znajdują 🙂

 

Szybki test i okazuje się, że co 1 s spada nam głośnik. Teraz wystarczy dodać losowe oczekiwanie głośnika , kiedy ten znajduje się na górze. W tym celu wykorzystujemy po raz drugi blok czekaj, tylko teraz w miejsce w którym ostatnio wpisana była 1 s, wstawiamy blok losuj od 1 do 10 (sekcja „Wyrażenia”).

Gotowy kod głośnika:

Sprawdzamy jak to działa…

Mamy Głośnik spadający co prawda w jednym miejscu, ale za to w losowych odstępach czasu 🙂

Gratulacje !

To tyle na dzisiaj. Śmiało możesz pogratulować swojemu dziecku i sobie. Macie już grę z pięknym tłem i muzyczką, Wasz bohater porusza się i to w ciekawy sposób, a z góry spadają przedmioty.

Naprawdę dobra robota!

Nie zapomnijcie zapisać efektów Waszej pracy !

Co dalej ?

W kolejnej części pokażę jak sprawić, żeby Głośnik spadał nie tylko w losowym czasie, ale także w losowym miejscu.

Sprawimy także, że dotknięcie przez Głośnik Puszka powodować będzie koniec gry…

Jeżeli macie ochotę śmiało możecie samodzielnie spróbować sprawić, żeby przedmioty spadały w losowym miejscu, a swoimi rezultatami możecie podzielić się w komentarzach pod tym postem 🙂

Będzie mi bardzo miło „podglądać” Wasze postępy. Oczywiście, jeżeli macie jakiekolwiek pytania lub wątpliwości związane z tym tematem piszcie – postaram się na nie odpowiedzieć 🙂

Życzę Wam owocnego programowania!

I pamiętajcie, że programowanie to przede wszystkim świetna zabawa 🙂