2.5. Spacer duszka nad jeziorem

Scenariusz projektu

Najwyższy czas na przygotowanie twojej pierwszej animowanej historyjki. Duszek będzie spacerował po pomoście na tle jeziora. Gdy dojdzie do końca sceny, zawróci i zacznie iść z powrotem. Spacer rozpocznie po uruchomieniu programu zieloną flagą, a gdy go zatrzymasz, wybierając przycisk stop, duszek zakończy spacer.

Zmiana tła sceny

Realizację projektu zaczniemy od zmiany tła.

Zadanie 2.5.1.

Wybierz z galerii tło, które jest podpisane boardwalk i przedstawia pomost nad jeziorem.

Instrukcja: Możesz skorzystać z poniższych podpowiedzi, które krok po kroku opisują, jak zmienić obraz tła na jeden z obrazków dostępnych w galerii.

Krok 1
Kliknij w lewym dolnym rogu ekranu w obszarze zarządzania sceną w ikonę wyboru nowego tła z galerii.
Krok 2
Wybierz tło (widok z pomostem na jezioro – boardwalk) i zatwierdź wybór przyciskiem OK.
Krok 3
Wybierz puste tło nr 1 i usuń je, klikając w krzyżyk zamknięcia.
Krok 4
Kliknij w duszka w obszarze zarządzania duszkami, a następnie w zakładkę skrypty, aby powrócić do znanego ci już wyglądu ekranu.

Dodawanie i usuwanie duszków

Spacerować nad jeziorem może kotek, ale warto dobrać inną postać, bardziej odpowiadającą takiemu spacerowi.

Zadanie 2.5.2.

Dodaj z galerii nowego duszka przedstawiającego spacerującego chłopca. Jest podpisany Boy3 walking.

Instrukcja: Możesz skorzystać z poniższych podpowiedzi, które krok po kroku opisują, jak dodać z galerii nowego duszka.

Krok 1
Kliknij w obszarze zarządzania duszkami w ikonę wyboru nowego duszka z galerii.
Krok 2
Wybierz duszka (spacerujący chłopiec – Boy3 walking) i zatwierdź wybór przyciskiem OK.
Przesuń duszka chłopca, żeby znalazł się na pomoście po lewej stronie sceny. Domyślny duszek - kotek nie będzie potrzebny, więc możesz go usunąć.

Zadanie 2.5.3.

Usuń niepotrzebnego duszka - kotka.

Wskazówka

Duszka można usunąć, klikając go (obojętne, czy na scenie, czy w obszarze zarządzania duszkami) prawym przyciskiem myszy. Następnie należy wybrać opcję usuń.
Poniżej możesz obejrzeć film ilustrujący wszystkie wykonane powyżej czynności.

Budujemy skrypty dla duszka - chłopca

Umiesz już przesuwać duszka o określoną liczbę kroków, np. po naciśnięciu klawisza spacji. Wiesz też, że jak duszek dojdzie do krawędzi, to dalsze naciskanie klawisza spacji już nic nie da, musisz przeciągnąć duszka z powrotem na scenę. Potrafisz także wyświetlać informację w dymku komiksowym.
Spróbuj teraz zautomatyzować zachowanie chłopca. Niech po kliknięciu w zieloną flagę wyświetli informację, że zaraz rozpocznie spacer, a potem chodzi już samodzielnie, aż nie naciśniesz przycisku stop na pasku narzędziowym. Po dojściu do krawędzi sceny chłopiec powinien się obrócić i iść w przeciwną stronę.

Zadanie 2.5.4.

Przygotuj skrypt dla chłopca realizujący samodzielny spacer nad jeziorem według poniższego przepisu.

Po wciśnięciu zielonej flagi duszek:
  1. 1.
    wyświetla przez 2 sekundy w dymku komiksowym informację, że rozpocznie spacer,
  2. 2.
    cyklicznie (zawsze) wykonuje następujące czynności:
  1. a.
    przesuwa się o 3 kroki,
  2. b.
    jeśli dojdzie do brzegu sceny, obraca się w przeciwną stronę (odbija).
  1. 1.
    Wybierz kategorię Zdarzenia i przeciągnij klocek kiedy kliknięto zieloną flagę do obszaru skryptów.
  2. 2.
    Wybierz kategorię Wygląd i przeciągnij klocek powiedz … przez … s do obszaru skryptów. Połącz go z klockiem zielonej flagi. Zmień napis Hello! na informujący o rozpoczęciu spaceru.
  3. 3.
    Wybierz kategorię Kontrola i przeciągnij klocek zawsze do obszaru skryptów. Połącz go z poprzednim klockiem. Zwróć uwagę na wygląd tego klocka. Ponieważ będzie on powtarzał bez końca (zawsze) klocki, które znajdą się w jego wnętrzu, nie da się do niego podłączyć od dołu żadnego klocka.
  4. 4.
    Wybierz kategorię Ruch i przeciągnij klocek przesuń o … kroków do obszaru skryptów. Osadź go wewnątrz klocka zawsze. Zmień liczbę kroków na 3.
  5. 5.
    Z kategorii Ruch przeciągnij klocek jeżeli na brzegu, odbij się od obszaru skryptów i osadź go wewnątrz klocka zawsze.
Przetestuj (wypróbuj) działanie skryptu.

Zadanie 2.5.5.

Zapewne podczas testowania skryptu, wykonanego w poprzednim zadaniu, zwrócił twoją uwagę fakt, że chłopiec po zmianie kierunku idzie „do góry nogami”. Dzieje się tak, ponieważ duszek, obracając się, kręci się dookoła swojego domyślnego środka. Spróbuj odnaleźć i dodać do skryptu odpowiedni klocek, który spowoduje, że duszek będzie obracał się tylko w prawą lub w lewą stronę. Zastanów się, gdzie i dlaczego ten klocek powinien zostać wstawiony do skryptu, który już istnieje.

Wskazówka

Znajdź w kategorii Ruch klocek ustaw styl obrotu i dodaj go do skryptu przed klockiem zawsze. Z listy rozwijalnej wybierz lewo - prawo. Chłopiec powinien patrzeć tylko w dwie strony, w lewo i w prawo.
Duszek - chłopiec porusza się już samodzielnie na scenie, możesz dodać jeszcze do projektu animację. Spacerując, chłopiec powinien poruszać nogami.

Ważne

Animować można duszki, które mają więcej niż jeden kostium. Wybierając zakładkę Kostiumy, sprawdzisz, ile kostiumów ma dany duszek. Spacerujący chłopiec w tym projekcie ma pięć kostiumów, które możesz cyklicznie zmieniać (następnym kostiumem po ostatnim jest ponownie pierwszy).
Ponieważ komputer może wykonywać jednocześnie wiele poleceń, przygotuj dla niego kilka zadań w postaci oddzielnych skryptów. Masz już skrypt, który powoduje, że duszek porusza się na scenie. Można dodać drugi skrypt, który spowoduje, że dzięki zmianie kostiumów duszek będzie animowany. Oba skrypty będą działały jednocześnie.

Zadanie 2.5.6.

Przygotuj skrypt animujący duszka według poniższego przepisu.
Po wciśnięciu zielonej flagi duszek:
  1. 1.
    czeka 2 sekundy, aż zniknie dymek informujący o rozpoczęciu spaceru,
  2. 2.
    cyklicznie (zawsze) wykonuje następujące czynności:
    1. a.
      zmienia kostium na następny,
    2. b.
      chwilę czeka, np. 0.3 sekundy.
  1. 1.
    Wybierz kategorię Zdarzenia i przeciągnij klocek kiedy kliknięto zieloną flagę do obszaru skryptów.
  2. 2.
    Wybierz kategorię Kontrola i przeciągnij klocek czekaj … s do obszaru skryptów. Połącz go z klockiem zielonej flagi. Zmień czas na 2 sekundy.
  3. 3.
    Z kategorii Kontrola przeciągnij klocek zawsze do obszaru skryptów. Połącz go z poprzednim klockiem.
  4. 4.
    Wybierz kategorię Wygląd i przeciągnij klocek następny kostium do obszaru skryptów. Osadź go wewnątrz klocka zawsze.
  5. 5.
    Z kategorii Kontrola przeciągnij klocek czekaj … s do obszaru skryptów i osadź go wewnątrz klocka zawsze. Popraw czas na 0.3 sekundy.
Przetestuj (wypróbuj) działanie programu. Składa się już z dwóch skryptów.

Ważne

Pamiętaj o zapisaniu projektu.

Zadania uzupełniające

Zadanie 2.5.7.

Dopisz jeszcze jeden skrypt do projektu Spacer nad jeziorem. Po kliknięciu w duszka wyświetli w dymku informację, że za chwilę (np. po dwóch sekundach) zakończy spacer i zatrzyma się.

Wskazówka

Wykorzystaj klocek zatrzymaj … z kategorii Kontrola i wybierz z listy rozwijalnej wszystko lub inne skrypty duszka.

Zadanie 2.5.8.

Sprawdź, ile kostiumów ma domyślny duszek – kotek. Przygotuj projekt pt. Spacer kotka po polu.

Zadanie 2.5.9.

Przygotuj projekt, w którym rybka będzie pływać w akwarium. Kliknięcie w rybkę niech spowoduje jej obrót, czyli zmianę kierunku płynięcia. Może masz pomysły na dodatkowe zadania dla rybki, np. reagującej na wciśnięcie jakiegoś klawisza? Spróbuj je także dodać.

Zadanie 2.5.10.

Przygotuj animowany projekt wykorzystujący przez ciebie zaprojektowanego duszka oraz tło sceny.

Wskazówka

Wygląd duszka możesz zaprojektować w edytorze graficznym Scratcha. Wystarczy kliknąć w ikonę Namaluj nowego duszka w obszarze zarządzania duszkami.
Jeśli twój duszek ma być animowany, powinien mieć co najmniej dwa kostiumy. Kolejny kostium tworzymy najczęściej poprzez drobne zmiany poprzedniego. Wygodnie jest więc skopiować dany kostium i go poprawiać. W tym celu kliknij w kostium prawym przyciskiem myszy i z menu kontekstowego wybierz opcję duplikuj.
Tło sceny możesz przygotować także w edytorze graficznym Scratcha (ikona Namaluj nowe tło w obszarze zarządzania sceną). Możesz także wykorzystać zdjęcie z wakacji i wgrać jako tło.

Ważne

Scena ma stałe wymiary: szerokość 480 punktów i wysokość 360 punktów. Jeśli wykorzystujesz zdjęcie jako tło, pamiętaj aby je wcześniej przyciąć (przekształcić) w dowolnym edytorze graficznym do wymiarów 480 na 360 punktów.