Ru01RvNzj6ENh
Zdjęcie przedstawia kładkę z mostkiem nad jeziorem

Pierwsze projekty w Scratchu

Źródło Alicja z pixabay.com, licencja CC0

Spacer duszka nad jeziorem

Ten materiał pomoże ci przygotować w środowisku Scratch  animowane historyjki, na przykład taką, w której duszek będzie spacerował po pomoście na tle jeziora.

Obejrzyj film przedstawiający sposób działania aplikacji.

RpqGDXWjIMoyp
Film przedstawia działanie aplikacji. Widoczna jest scena programu ustawiona na molo z morzem w tle. Na pierwszym planie widoczny jest duszek - kotek. Po kliknięciu zielonej flagi wyświetla on komunikat "Zaraz rozpocznę spacer nad jeziorem." przez 2 sekundy. Po tym czasie duszek zaczyna się poruszać przełączając na zmianę między dwoma kostiumami. Po kliknięciu duszka pojawia się komunikat "Zaraz zakończę spacer.". Widoczny jest on przez 2 sekundy i zatrzymuje poruszanie duszka.

Twoim zadaniem będzie zaprogramowanie działań duszka, aby rozpoczął spacer po kliknięciu zielonej flagi, spacerował i zawrócił, gdy dojdzie do końca sceny. W tym czasie będzie on zmieniać swoje kostiumy w sposób animowany. Na początku aplikacji na ekranie wyświetlili się przez 2 sekundy komunikat „Zaraz rozpocznę spacer nad jeziorem.”. Duszek będzie spacerować, a jeśli klikniesz na duszka na ekranie pojawi się komunikat „Zaraz zakończę spacer” i  skrypt zostanie zatrzymany po 2 sekundach.

Zmiana tła sceny

Realizację zadania rozpoczniemy od zmiany domyślnego tła.

Ćwiczenie 1

Wybierz z galerii tło, które jest podpisane Boardwalkma7b4c8881bf1197c_d532e200Boardwalk i przedstawia pomost nad jeziorem. Pomoże Ci w tym poniższy film.

RU50rbyBa1Ray
Film przedstawia najechanie na przycisk do ustawienia tła sceny i wybranie opcji "Wybierz tło" z rozwijanej listy. Po kliknięciu tej opcji następuje otworzenie nowego okna z dostępnymi grafikami. Następnie narrator najeżdża kursorem na tło "Boardwalk" i zatwierdza wybór kliknięciem myszy.

Dodawanie i usuwanie duszków

Kotek oczywiście może spacerować nad jeziorem. Spróbujmy  jednak dobrać inną postać, np. dziewczynkę.

Ćwiczenie 2

Dodaj z galerii nowego duszka przedstawiającego spacerującą dziewczynkę. Jest podpisana jako Avery Walkingma7b4c8881bf1197c_d532e299Avery Walking.

Przesuń duszka dziewczynki na lewą stronę sceny – pomostu.

Ćwiczenie 3

Usuń niepotrzebnego duszka - kotka.

Budujemy skrypty dla duszka

Zbudujemy skrypty określające zachowanie duszka- dziewczynki. Niech po kliknięciu w zieloną flagę wyświetli on informację, że zaraz rozpocznie spacer i zacznie samodzielnie chodzić aż do momentu, w którym naciśniesz przycisk stop na pasku narzędziowym. Po dojściu do krawędzi sceny dziewczynka powinna się obrócić i pójść w przeciwną stronę. Wykorzystamy do tego blok  jeżeli na brzegu, odbij się.

Ćwiczenie 4

Przygotuj skrypt dla dziewczynki realizujący samodzielny spacer nad jeziorem.

Ćwiczenie 5

Zapewne podczas testowania skryptu, wykonanego w poprzednim zadaniu, zwrócił twoją uwagę fakt, że dziewczynka 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. Znajdź  i dodaj do skryptu odpowiedni blok, który spowoduje, że duszek będzie obracał się tylko w prawą lub w lewą stronę. Wstaw ten blok do skryptu, który już istnieje.

Duszek - dziewczynka porusza się już samodzielnie na scenie; możesz dodać jeszcze do projektu animację. Spacerując, dziewczynka powinna 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ąca dziewczynka w tym projekcie ma cztery kostiumy, które możesz cyklicznie zmieniać (następnym kostiumem po ostatnim jest ponownie pierwszy).

R1QfdIn537Bz5
Kostiumy animowanego duszka.
Źródło: GroMar, licencja: CC BY 3.0.

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.

Ćwiczenie 6

Przygotuj skrypt animujący duszka w taki sposób, że zmieniając swoje położenie (tak jak w poprzednim skrypcie), będzie sprawiał wrażenie poruszania nogami. Uwzględnij blok czekaj przy zmianie kostiumu oraz zmień liczbę kroków na 6, aby animacja przebiegała płynniej. W tym celu utwórz nowy projekt w Scratch i nazwij go „Spacer nad jeziorem”.

Ważne!

Pamiętaj o zapisaniu programu.

ma7b4c8881bf1197c_d532e201
ma7b4c8881bf1197c_d532e211
ma7b4c8881bf1197c_d532e220
ma7b4c8881bf1197c_d532e229
ma7b4c8881bf1197c_d532e238
ma7b4c8881bf1197c_d532e253
ma7b4c8881bf1197c_d532e418
ma7b4c8881bf1197c_d532e307
Ćwiczenie 7

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

Zadania uzupełniające

Ćwiczenie 8

Stwórz nowy projekt pt. „Pływająca rybka w akwarium”, w którym rybka będzie poruszać się we wszystkich kierunkach na tle podwodnej scenerii. Ustaw tło sceny na jedno z dostępnych opcji Underwaterma7b4c8881bf1197c_d532e311Underwater oraz użyj duszka Fishma7b4c8881bf1197c_d532e312Fish z wybranym przez ciebie kostiumem. W przykładzie został użyty domyślny kostium dla rybki. Stwórz skrypty w których:

  • Rybka będzie się poruszać o 3 kroki i odbijać od brzegu.

  • Kliknięcie na rybkę spowoduje zmianę jej kierunku na przeciwny.

  • Wciśnięcie klawisza o na klawiaturze spowoduje obrót rybki w prawo o losowy kąt z zakresu od 1 do 350 stopni.

  • Projekt zakończy się po naciśnięciu klawisza s.

Obejrzyj film pokazujący działanie projektu.

R1DnlFktmDvaN
Film przedstawia aplikację programu Scratch z podwodną scenerią i duszkiem rybką poruszającą się wewnątrz obszaru.
Ćwiczenie 9

Przygotuj nowy projekt w Scratch w celu stworzenia własnej animacji. Samodzielnie przygotuj duszka oraz tło. Aby stworzyć duszka, wybierz opcję Maluj podczas wyboru nowego duszka, a następnie użyj edytora, aby zaprojektować swoją postać. Postępuj podobnie, wybierając opcję Maluj przy tworzeniu nowej sceny, aby zaprojektować swoje własne tło. Zasada działania programu może być podobna do poprzedniego ćwiczenia, gdzie duszek zmienia kierunek po dotknięciu krawędzi okna.

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

ma7b4c8881bf1197c_d532e298
ma7b4c8881bf1197c_d532e338
ma7b4c8881bf1197c_d532e299
ma7b4c8881bf1197c_d532e200
ma7b4c8881bf1197c_d532e311
ma7b4c8881bf1197c_d532e312

Poniżej znajduje się pole tekstowe przeznaczone do zapisywania notatek. Możesz w nim zapisać wszystkie informacje, które uważasz za potrzebne.

R1dkv003VjBZi
Źródło: GroMar, licencja: CC BY 3.0.