t19 (1)

Processing – ćwiczenia #1

Wczoraj już wspomniałam o programie Processing, a dziś kilka ćwiczeń na początek.

Dlaczego warto uczyć programowania? Dlaczego w szkole uczymy naszych uczniów programowania?

Nie dlatego, że chcemy aby wszyscy zostali programistami lub informatykami.
Dlatego ponieważ, poprzez naukę programowania nasi uczniowie uczą się 3 bardzo ważnych rzeczy:

  • porządku,
  • hierarchii,
  • szukania (i poprawiania) błędów.

Processing to bardzo fajne środowisko, w którym uczniowie nie muszą czekać długo na efekty swojej pracy, co daje im dużą motywację do odkrywania i tworzenia.
W czasie pracy w programie warto korzystać z zakładki Reference na stronie internetowej programu, gdzie można znaleść informację o składni naszego języka wraz z przykładowymi zastosowaniami.

Ćwiczenia

1. Na początek zacznijmy od ustalenia rozmiaru naszego okna.
size(100,100);

Screen Shot 07-26-17 at 01.33 PM
Zmieńmy rozmiar naszego okna na 800 px na 600 px.

Screen Shot 07-26-17 at 01.35 PM

2. Spróbujmy utworzyć w lewym górnym rogu prostokąt o wymiarach 100 na 80.

rect(0,0,100, 50);

Screen Shot 07-26-17 at 01.39 PM

3. Zmieńmy punkt zaczepienia tego prostokąta, tak aby znalazł się on na środku naszego okna.

Screen Shot 07-26-17 at 01.43 PM

4. Zmieńmy prostokąt na kwadrat o boku 300px, który również będzie się znajdował na środku.

Screen Shot 07-26-17 at 01.47 PM

5. Spróbujmy wpisać w ten kwadrat koło.

ellipse(400, 300, 300, 300);

Screen Shot 07-26-17 at 01.50 PM

6. Narysujmy teraz 4 koła o średnicy 50 px. Niech środkami tych kół będą wierzchołki kwadratu.

Screen Shot 07-26-17 at 01.55 PM

7. Wpiszmy w nasze duże koło dwa trójkąty.

Jeden z nich można wpisać tak: triangle(400, 150, 250, 300, 550, 300);

Screen Shot 07-26-17 at 02.02 PM

8. Dodajmy kolor do naszego rysunku.

Zacznijmy od kwadratu – na czerwono, wpisując polecenie fill(255, 0, 0); przed poleceniem o kwadracie.

W efekcie wszystkie nasze figury, które znajdują się pod tym poleceniem są pokolorowane na czerwono.

Screen Shot 07-26-17 at 02.08 PM

9. Pokolorujmy rysunek:

duże koło – na żółto,
małe koła – na niebiesko,
trójkąty na zielono.

Screen Shot 07-26-17 at 02.16 PM

Dodajmy jeszcze pomarańczowe tło dopisując polecenie background() z odpowiednimi parametrami zaraz po wymiarach naszego okna.

Screen Shot 07-26-17 at 02.17 PM

10. Zmieńmy kolory na własne i zapiszmy nasz projekt.

Czy zauważyliście, że program chce zapisać pliki w domyślnym katalogu o nazwie sketch_rrmmdda?
W moim przypadku jest to Screen Shot 07-26-17 at 02.29 PM

Ten sposób zapisywania jest fajny, bo dzięki temu wiem w jakim dniu powstał plik. Literka a na końcu oznacza, że jest to pierwszy projekt w tym dniu. Następny projekt w tym dniu będzie zapisany z tą samą datą, ale z kolejną literą.