Spelprogrammering av www.spelprogrammering.nu

Programmering ska vara roligt

Lärarna Mikael Tylmad och Pontus Walck på Södertörns friskola har skrivit ett gästinlägg om hur de arbetar kreativt med programmeringsundervisningen på Internet för att väcka elevernas intressen.

Programmeringsundervisningen i Sverige har inte förändrats mycket de senaste 15 åren. Det handlar ofta om att först lära sig en tung programmeringsmiljö, som inte är lätt att köra hemma, där eleven sedan ska sitta och programmera "Hej världen" och trycka på kompileringsknappar. Därefter går man vidare och lär sig att hantera de olika huvudbegreppen inom programmering, såsom variabler, tester och funktioner. I värsta fall blandar man också in objektorientering ända från början. Ofta jobbar man med delämnen i steg, och går först vidare när man gjort alla uppgifter för just det ämnet. Det kan handla om veckor då man jobbar med att försöka förstå ett begrepp. Detta sätt att arbeta påminner mycket om traditionell matematikundervisning och är ett logiskt sätt att sakta men säkert närma sig avancerad programmering. Men det kan lätt bli väldigt tråkigt...

 

Exempel inom programmering är ofta verklighetsfrånvända och helt oanvändbara. De handlar om att man ska lära sig hantera ett visst begrepp, men eftersom man är nybörjare kan man inte använda begreppet i ett verkligt exempel. Det skulle bli för svårt och avancerat. Därför sparar man på text i variabler och skriver program som visar innehållet på skärmen, kanske skapar man en textbaserad telefonbok. Dessa program är ingen egentligen särskilt intresserad av i verkligheten. Vi tror att programmering automatiskt blir tråkigt om man skapar värdelösa saker.

 

Vårt mål är att helt ändra på hur man ser på programmeringsundervisning och göra så att programmering direkt blir roligt och känns användbart för eleverna. Vi vill att de ska programmera på riktigt och åstadkomma saker som de är stolta över.

Kunskaperna ska de också kunna ta med sig till en framtida vidareutbildning och arbetsplats. Vi frågade oss själva: Hur svårt kan det vara att göra programmeringsundervisning roligt?

 

När vi funderade på hur man kunde lösa problemet kom vi fram till att lösningen måste följa dessa regler:

 

  • Programmeringen ska vara "på riktigt", det vill säga verktygen måste vara populära bland programmerare.
  • Resultat från programmeringen ska vara roliga och tillgängliga på Internet. De ska dessutom fungera på moderna enheter som surfplattor och mobiler, så att eleverna lätt kan visa upp vad de åstadkommit.
  • Det ska gå snabbt att komma igång och inte kräva någon krånglig mjukvara.
  • Elever ska kunna jobba var som helst, det ska fungera på vilken dator och vilket operativsystem som helst.
  • All inblandad mjukvara måste vara gratis.

 

Kraven pekar tydligt på webben, och vi valde att bygga en utbildningsmiljö med programmeringsspråket JavaScript och moderna webbtekniker i HTML5. Alla kan då jobba i enkla texteditorer på valfritt operativsystem. Som infallsvinkel till programmeringen valde vi att programmera spel, men vi har också experimenterat med matematik och fysik.

 

Alla våra elever börjar med att skapa en enkel hemsida som innehåller dessa nio rader HTML-kod:

 

<html>

<head>

<title>Programmering!</title>

<script src="http://spelprogrammering.nu/library.js"></script>

<script src="kod.js"></script>

</head>

<body>

<canvas id="canvas" width="800" height="400"></canvas>

</body>

</html>

 

Denna HTML kan man hyfsat enkelt förklara och eleverna kan jobba vidare med den för att göra sina sidor snyggare. Men den innehåller redan allt vi behöver för att komma igång. Det finns två script-taggar som är essentiella. Den första pekar på ett litet bibliotek som vi byggt för att göra det lättare att komma igång. Den andra script-taggen pekar på en fil som heter "kod.js". Denna ska eleven själv skapa. Om eleven skriver in följande i sin kod.js:

 

function start()

{

circle(200, 150, 70, "red");

}

 

får man om man surfar in på elevens hemsida se en röd cirkel på skärmen. Cirkeln kommer att befinna sig på X-koordinat 200, Y-koordinat 150 och ha en radie på 70 pixlar.

 

Internetåtkomst behövs för att komma åt vårt bibliotek, men om man laddar hem det och lägger tillsammans med HTML-koden och sin "kod.js" kan man jobba helt lokalt. Det finns också applikationer på exempelvis iPad som gör det möjligt att helt jobba där (givetvis skönast med externt tangentbord i det fallet, men visst går det med skärmtangentbordet också). Om man vill jobba direkt på en androidplatta är det ännu lättare.

 

Vad har vi hittills åstadkommit? Vi har visat eleverna en enkel HTML-fil och skrivit tre rader JavaScript. Detta motsvarar att man i traditionell programmeringsundervisning kommit igång med sin laborationsmiljö och gjort ett "Hej världen"-program. Skillnaden är att vi nu har ett resultat som dels är grafiskt och därmed automatiskt roligare, dels kan visas för andra på Internet.

 

Steget till att skapa något som är ännu roligare kan vara så här kort:

 

function update()

{

circle(mouseX, mouseY, 70, "red");

}

 

Nu har vi nästan samma kod som tidigare, men istället för att skriva en "start"-funktion så har vi skrivit en "update"-funktion, och cirkeln har inte längre en fast position utan ritas där musen är. Rör man runt musen följer bollen efter så att man får ett streck. Hur kul som helst!

 

Vi har prövat upplägget på högstadiet och gymnasiet och det fungerar jättebra! De som är helt nya för programmering tycker att det är roligt och kommer snabbt igång och ritar enkla figurer och lär sig att hantera interaktion med användaren. De elever som redan kan programmering, eller kanske till och med redan är duktiga, sätter genast igång med avancerade spel och andra projekt som blir väldigt spexiga! Sen visar de varandra vad de gjort, och spelar varandras spel på nätet.

 

Vårt lilla bibliotek förenklar för nybörjare genom att göra de vanligaste sakerna lättare, men det är bara JavaScript och inget är i vägen och gömmer koden. Vi lägger vi ut information och exempel på vår nya hemsida, www.spelprogrammering.nu. Denna är givetvis med och tävlar i webbstjärnan, om specialpriset för lärare!

Kommenteringen är stängd för denna artikel.

Kommentarer

  • Ralf Eriksson 3 april 2012, kl 08.37

    Kul att någon tar tag i det här problemet. Som det är idag så är det många elever som vill lära sig programmera men de tycker att det tar för lång tid att komma in i ämnet så de hinner tröttna. Hoppas det här upplägget ändra på det. Ska testa så får vi se.