Programozóként / IT-sként talán természetes, ha azt szeretném, ha a gyerekeim is megismerkednének a programozással. Természetesen kényszer nélkül, én sem vagyok a híve, hogy megmondjam nekik, milyen szakmát válasszanak. De egy kis nudge szerintem nem elítélendő. 🙂 Úgy gondolom, manapság már szinte bármilyen (fehér galléros) munkában hasznos skill lehet a programozás (illetve az algoritmikus gondolkodás). Persze manapság a csapból is az folyik, hogy az MI a programozók munkáját is veszélyezteti, és néhány éven belül a programozók töredékére lesz szükség. Hosszabb távon szinte biztosan így lesz, jelentősen átalakul a szakma, de ettől még nem gondolom, hogy csak emiatt felesleges dolog programozást tanulni.

Van egy 8 éves fiam és 10 éves lányom. Mostanában első sorban a lányomat próbálnám okítani programozásra. A fiam egyelőre nem vevő ezekre, úgy általában a “gépezésre” sem, de ez abszolút rendben van. Idővel majd kiderül, hogy érdeklik-e ezek a dolgok vagy sem. A lányomat viszont úgy tűnik, igen…

A bejegyzés apropóját az adta, hogy pár napja ráleltem a MakeCode Arcade-ra, segítségével videojátékokat tudnak a (fiatalabb, 10-18 éves) gyerekek a lehető legegyszerűbben, mégis programozva létrehozni.

Mit próbáltam eddig?

Bevallom, elég sok dolgot kipróbáltam (egyúttal elég sok dologra költöttem kisebb-nagyobb összegeket – utólag belegondolva talán fölöslegesen). De ha valami nem működik, nem “kattan be”, akkor nem kell erőltetni annyira, meg kell próbálni valami mást. Szerencsére továbbra is látom a lányomon, hogy van kedve ilyeneket kipróbálni, nem érzi nyűgnek. Amíg ez a helyzet, nem adom fel, hogy legalább alapszinten megtanítsam neki (és talán később a fiamnak is) a programozás alapjait. A következő dolgokkal próbálkoztam az évek során:

Cubetto “padlórobot”

Programozható, irányítható robot játék, ~3-5 éves gyermekek számára. Bevezeti a gyerekeket a programozás világába, képernyő nélkül. Minden blokk (kis műanyag elem, amit egy fa táblára kell felhelyezni) egy cselekvést jelent. Kombinálva alkotnak egy programot. Elemek: előre, balra, jobbra, hátra, negálás, véletlenszerű, funkció hívás.

Egész jól eljátszottunk vele egy darabig, sokszor ők kérték, hogy vegyük elő. Vannak különböző küldetés / történet “szőnyegek” hozzá, tehát nem csak egy dolgot lehet vele végigvezetni. Összességében nem rossz, de nem hiszem, hogy túlságosan elültette volna a lányomban a programozás csíráit. Bár ezt ugye “mérni” nehéz. Ez már nem nekik való elég régóta, a padlásra került. Ha valaki kipróbálná, szívesen kölcsönadom. Bemutató videó: CUBETTO PLAYSET by Primo Toys. Quick Overview

Lego Wedo 2.0 építőkészlet

A LEGO Mindstorms “kicsiknek” készült változata, ami grafikus módon programozható (van hozzá egy motor, és néhány szenzor, ezek Bluetoothon keresztül csatlakoznak a PC-re vagy tabletre). Egész jópofa cuccokat lehet benne megcsinálni, itt is vannak tematikus építések.

Ami jó még ebben a készletben illetve a hozzá tartozó “ökoszisztémában”, hogy a LEGO minden évben szervez versenyeket, különböző korosztályoknak (FIRST LEGO League, stb.), ami nagyon jó élmény nekik. Nálunk elsősként vett részt ebben a lányom és néhány osztálytársa. Pár hónap alatt, hétről hétre kellett különböző feladatokat elkészíteniük és felkészülniük a végén egy prezentációval és egy épített dologgal, amit egy zsűrinek mutathattak meg a szezon végén. Amennyiben valaki érez ehhez erőt és türelmet, annak jó lehet, de kell egy elkötelezettség a “coach” és a gyerekek részéről is. Persze maga a készlet önmagában is használható, elég sok ötlet van fenn a neten is hozzá.

Az “Aranycsapat”, FIRST LEGO League Jr. 2019

Scratch

Szerintem nem kell bemutatnom a Scratchet, ez talán a legismertebb programozást oktató platform kicsinek, ahol szintén grafikus módon lehet programokat létrehozni.

Pár alkalommal használtuk (kb. 8 éves korában), tetszett is a lányomnak. A következő történetet hoztuk létre közösen, de jó részét ő “programozta”, és ebbe még a kisöccsét is be tudtuk vonni (ő adta a hangját pár karakternek): https://scratch.mit.edu/projects/403029315. A Scratch továbbra is jó platformnak tűnik programozói szemlélet elsajátítására, és mivel már régóta létezik, ezért magyar nyelven is számtalan leírás és videó van róla.

Gépregény társasjáték

Ezt inkább csak röviden említem, hogy beszereztem egy társasjátékot is, ami “programozós szemléletű”: https://tarsasjatekok.com/tarsasjatek/gepregeny-2019

Még nem játszottunk vele sokat, de majd elő fogjuk venni később is, unalmas téli estéken. 🙂

AiNova programozható robot

Ezt pár hónapja rendeltem: AiNova programozható robot, ahol a robotot is nekik (a lányomnak és 2 osztálytársának) kellett összeállítani. Ez a rész tetszett nekik. Elkezdtük csinálni a feladatokat is, játszadoztak vele, de nem annyira kattantak rá, bár az is lehet, hogy én nem tartottam jól az alkalmakat. Illetve ez már a nyári szünet előtti néhány héten volt. Egyelőre visszakerült a dobozba, de később még előveszem majd, mert látok benne fantáziát (van benne némi AI, kép és tárgy felismerés, szenzorok, stb.)

Minecraft

Kicsit kakkuktojás, de a Minecratot is ebbe a felsorolásba venném, mivel még ha csak szórakozásból is építget dolgokat, és kombinál ezt-azt, akkor is valamennyire elsajátít egyfajta gondolkodásmódot, térlátást, tervezési képességet, ami hasznos tud lenni. Nálunk amúgy a Minecraft korlátozva van, hogy max. 1 órát nyektetheti naponta. Jóból is megárt a sok. 🙂

Amit még nem próbáltam: algoritmikus gondolkodás “offline” eszközökkel

Ismerősöktől kaptam pár tippet, hogyan lehetne játékosan a programozást és algoritmikus gondolkodást “tanítani”. Ezek közül 3, amit szeretnék majd kipróbálni:

  • Exact Instructions Challenge: : Egy vicces videó két gyerekről, akik megpróbálnak pontos utasításokat írni az apjuknak a mogyoróvajas szendvics elkészítéséhez, több, de inkább kevesebb sikerrel. Johnna és Evan felváltva próbálnak segíteni apjuknak. Josh azonban szó szerint követi az utasításokat, ami mókás fail-ekhez vezet. Ez a gyakorlat nagyban hasonlít a programozáshoz. 🙂
  • Introducing Kids to Coding: egy otthon is elkészíthető eszköztár, a papír alapú programozáshoz, játékosan.
  • Coding a Lego Maze: hasonló az előzőhöz, csak LEGO segítségével

MakeCode Arcade

Végül elérkeztünk a bejegyzésem fő témájához: a MakeCode Arcade-hoz. Nemrég bukkantam rá teljesen véletlenül, de nagyon megtetszett.

A MakeCode Arcade egy ingyenes, a Microsoft kutatói által fejlesztett oktatási platform. Célja, hogy a gyerekek programozást, problémamegoldást sajátítsanak el, videojátékok fejlesztésen keresztül. Relatíve könnyen, semennyi vagy  kevés programozási ismeret birtokában is készíthetünk interaktív 2D játékokat (arcade jellegűeket, pl. platformert vagy ugrálóst, 2D versenyzőst, stb.). A kódokat vizuális blokkokból álló szerkesztőben lehet összeállítani, de van lehetőség JavaScript és Python nyelven történő kódolásra is.

A felület (IDE)

A felület a következő részekből áll:

  • Felső menüsor: itt tudjuk megosztani a játékot, illetve itt tudunk váltani a Blokk nézet és az egyes programnyelvek között (pl. Python)
  • Szimulátor és irányítógombok: a készülő játékokat folyamatosan láthatjuk egy játékgép szimulátorban.
  • Download gomb: ha rá akarjuk tölteni az elkészült játékot egy kis konzol gépre (lásd később), akkor ezzel a gombbal lehet
  • Toolbox: itt vannak az egyes, program létrehozásához használható blokkok (lásd később).
  • Workspace: itt hozzuk létre a programot

Programozás vizuális programozással

Alapvetően vizuális programozásra van kihegyezve a MakeCode. Ez az IDE nem csak videojáték programozásra alkalmas, hanem egyéb dolgokhoz is biztosít a Microsoft hasonló felületet (Microbit, Minecraft).

Alapvető elem (blokk) típusok :

  • Sprites: Ez a kategória teszi lehetővé sprite-ok létrehozását és definiálását. A sprite-ok azok az objektumok, amelyeket a játékunkban irányítunk vagy mozognak. Ezek lehetnek játékosok, ellenségek, ételek, lövedékek és még sok más!
  • Controller: Ezekkel a blokkokkal meghatározhatjuk, hogy mely gombok mit vezérelnek. Például ha azt szeretnénk, hogy a vezérlőnk A gombjával nyilakat lőjünk ki, innen tudunk erre egy eseménykezelőt létrehozni.
  • Game: Ezekkel határozzuk meg a játék “idővonalát” (mikor mi történik, időzített események, stb.), valamint azt, hogy a játékos mikor veszít vagy nyer.
  • Music: Zene és hangeffektek hozzáadása.
  • Scene: Szabályozza a játék hátterét és képernyőméreteit.
  • Info: Tartalmazza az olyan alapvető játékelemeket, mint a pontszám, az életek és az idő.
  • Loops: Bizonyos kódblokkok különböző feltételek mellett történő folyamatos vagy megadott számú ismétlésére.
  • Logic: Bizonyos kódblokkok végrehajtása egy feltétel alapján. (Elágazások)
  • Variables: Létrehozhatunk változókat, amelyek olyan adatok tárolására szolgálnak, mint például valaminek a sebessége vagy aktuális állapota, aminek függvényében más dolgokat hajtunk végre.
  • Math: Különböző matematikai függvényeket tartalmaz. Használható például változók módosítására vagy bonyolultabb feltételek kifejezésére, véletlenszerű értékek választására.
  • Advanced: Functions: Egyedi függvények létrehozása a programon belüli híváshoz. (A függvények újrafelhasználható kód blokkok, amelyek bizonyos műveletek sorozatát hajtják végre vagy pedig egy változó értékét módosítják, vagy azok függvényében adnak vissza egy választ).
  • Advanced: Arrays: Listák (tömbök) létrehozása. Pl. egy véletlenszerű elemválasztáshoz meghatározhatjuk a lehetséges elemeket.
  • Advanced: Console: Segítség a program hibáinak elhárításában vagy hibaelhárításában.
  • Advanced: Extensions: További blokk típusokhoz, például animációkhoz való hozzáférés, beépített vagy külső modulok segítségével. (Lásd később.)

Elsőre kevésnek tűnhetnek ezek a blokkok, de a legtöbb nyelvi elem, ami egy ilyen egyszerű videojátékhoz kellhet, megtalálható. Ezen kívül vannak Extension-ök (~pluginek), amik bizonyos gyakran ismétlődő dolgot tesznek egyszerűbbé. A funkcióhívással pedig megtaníthatjuk, hogy érdemes lehet nem ömlesztett spagetti “kódot” csinálni, különben nem lesz egyszerű utólag módosítani vagy átlátni a művünket.

Programozás szöveges programkóddal

Eredetileg csak Javascript nyelven, újabban Pythonban is meg tudjuk írni a játékot. Ami jópofa, hogy tudunk váltogatni a Blokk és a programkód nézetek között, tehát ide-oda konvertálódik a program. Ez mondjuk főleg akkor működik, ha a grafikus felületen hozzuk létre a játék logikáját, akkor abból simán tud Js vagy Python kódot generálni a szerkesztő. Így láthatjuk, hogy hogyan nézne ki, ha az adott programnyelvben írtuk volna meg a játékot. (Persze még a programkód nézetben is maga az engine belső működése rejtve marad.) Csodát, “clean kódot”, strukturált felépítést viszont ne várjunk. Programozás bevezetésnek jó lehet, ha már uncsi a blokk alapú programozás, és újabb kihívásokat keres a gyerek.

TinkerGen GameGo

A MakeCode Arcade már önmagában is jó móka, de léteznek hozzá fizikai hardverek (kis kézi konzol szerű kütyük), amire le lehet tölteni az elkészített játékot. Ki lehet rajtuk próbálni, és büszkén mutogatni másoknak, vendégségben vagy a suliban a szünetben. Szerintem ez egy elég jó motivációs “löket”, hogy a játék, amit a gyerek létrehoz, nem csak a számítógépen játszható, hanem úgy, mintha egy “gyári” játék lenne.

A TinkerGen GameGo nevű eszközt szereztem be, egyelőre nagyon tetszik, kicsi, de kényelmes a kézben, jól játszható. Egy hibája van, (bár lehet, hogy az összes ilyen Arcade kompatibilis konzolnál megvan): csak akkor lehet új programot rátölteni, ha a kütyüt újraindítod (és néha az Aracede editor weboldalt is újra kell tölteni).

Nem a GameGo az egyetlen opció, ha szeretnénk egy fizikai hardvert. A következő videó elég jól bemutat sokat azok közül, amik szóba jöhetnek. A videóban is a GameGo-t és egy másik eszközt (Meowbit) hoztak ki a legjobbnak. Akik pedig szeretnek barkácsolni, azok megépíthetik saját maguk is, de a GameGo nem igazán zsebbenyúlós történet (~17e külföldről rendelve).

További infók / leírások / eszközök

Az Arcade már önmagában is nagyon jól használható, de van pár dolog, amivel megkönnyíthetjük az életünket.

Extension-ök

Az Arcade IDE-ben (Extensions kategória a blokkok között), illetve itt is találunk Extension-öket: https://awesome-arcade-extensions.vercel.app/

Ezek közül én ezeket találtam hasznosnak, de majd idővel lehet hogy több is előkerül:

  • arcade-character-animations: ezzel az extension-nel sokkal könnywebben lehet animációkat társítani konkrét mozgásokhoz. Pl. ha balra megy a karakter, akkor játsza le a balra mozgás animációt, stb.
  • arcade-sprite-data: az egyes Sprite-okhoz társíthatunk property-ket
  • button-combos: billentyűkombók egyszerű leprogramozására
  • timers: időzítők és aszinkron hívások megvalósításához
  • arcade-story: szövegbuborékok és egyéb történetmeséléshez kapcsolódó blokkok

Külső képszerkesztő

Alapból a MakeCode Arcade Asset képszerkesztőjébe nem lehet sajnos feltölteni külső képeket. Így vagy a gyárilag elérhető sprite-okat és háttereket kell használnunk a játékban, vagy megrajzolhatjuk magunknak. De ez utóbbi elég körülményes. Ha más helyről szeretnénk meglévő asset-eket felasználni, akkor erre nyújt megoldást a következő oldal: https://shakao.github.io/arcade-sprite-pack/

Ezen az oldalon már tudunk a vágólapról bemásolni képet (meg kell nyomni a feltöltés gombot a jobb felső sarokban és itt Ctrl + V), illetve innen már lehet átmásolni a vágólapon keresztül képeket közvetlen az Arcade-be (ki kell jelölni az egész képet a szerkesztőben, majd Ctrl + C, és Ctrl + V az Arcade-ban).

Néhány további külső tool, egyéb megoldások pl. a kép bejuttatására az Arcade-ba: https://github.com/UnsignedArduino/Awesome-Arcade-Extensions#tools

Letölthető asset-ek

2 ingyenes letölthető asseteket tartalmazó oldal, ha nincs kedvünk a meglévőeket használni, vagy saját magunk megrajzolni:

  • https://www.spriters-resource.com/ – klasszikus játékokból rippelt sprite-ok (karakterek), sokszor animációs mozdulatokkal. A képeket még sajnos fel kell darabolni egy másik programban, és a fent említett asset kezelő weboldallal tudjuk bevarázsolni az Arcade-ba
  • https://opengameart.org/ – itt is számtalan különböző féle asset van (sprite-ok, hátterek, zenék, stb.)

Példajátékok

Az Arcade oldalán is nagyon sok példajátékot találunk (beépített és mások által készített Community Games), de van egy külső games gallery is: https://games-gallery.jacobcarpenter.com/all-time

A MakeCode programozás megtanulása

A legegyszerűbben a hivatalos MakeCode Arcade-es tanító példákkal (Skillmap-ekkel) lehet megtanulni az Arcade használatát, de számtalan tutorial videó van belinkelve a főoldalon. Azzal is sokat lehet tanulni, hogy megnézzük már kész játékok “forráskódját”, és ellesünk belőle ötleteket.

Egy dologtól mindenképpen óva intenék mindenkit, illetve ezt tudatosítsa a gyerekben is: “learn to walk before you run”. Elsőre könnyen elérhető célt tűzzünk ki. Még akkor is, hogy az összes tutorialt és leckét megcsináltuk és úgy gondoljuk, mindent tudunk már. Sokkal nagyobb motivációt fog adni a továbbiakban, ha elsőre egy könnyebb, de pár nap alatt elkészíthető játékot készítünk el. Erről is szól a következő videó: jótanácsok első videojáték készítés előtt. Mindenképpen érdemes ezeket megszívlelni.

Verdikt

Csak most fogom elkezdeni a lányommal a programozást az Arcade-dal, de amit eddig kipróbáltunk és megnéztünk, az nekem, és a lányomnak is nagyon tetszett. A kis “cuki” kütyü is sokat hozzáad a fun factorhoz. Remélem pár hét múlva majd büszkélkedhet az elkszült játékokkal, menet közben pedig sikerül pár programozási alaptechnikát és fogalmat elsajátítania.

A tervek szerint később beszámolok a fejleményekről, hogy vajon egy újabb befuccsolt kisérlet lett-e ebből is, vagy nem. Hamarosan kiderül. 🙂