Tero Toivanen, @teromakotero Kilonpuiston koulu, Espoo Ville Ilkkala, @VilleIlkkala Valaa Technologies Oy

1. Oppilaat ohjelmoivat monialaisen
oppimiskokonaisuuden
web-sovellukseksi.
Tero Toivanen
@teromakotero
Kilonpuiston koulu, Espoo
Ville Ilkkala
@VilleIlkkala
Valaa Technologies Oy

2. Miksi?
Web-sovellus on visuaalinen, interaktiivinen, jaettava ja helposti
saavutettava artefakti, jolla voidaan ilmaista mitä tahansa.

4. Miksi ei?
Web-sovellusten toteuttaminen on erittäin monimutkaista. Yksinkertaisenkin
applikaation rakentaminen vaatii useita eri teknologioita ja työkaluja.

5. ValOS
Kokeilussa käytettiin avoimen lähdekoodin ValOS-arkkitehtuuria, joka pyrkii tekemään
web-applikaatioiden kehittämisestä helpompaa ja opittavampaa.
Kokeilu tehtiin osana EU:n CodeWeekiä ja monialaista oppimiskokonaisuutta.

6. Monialainen oppimiskokonaisuus
Lähde: https://www.oph.fi/english/curricula_and_qualifications/basic_education/curricula_2014

7. Oppilaiden koodaushistoria
ValOS-ympäristössä ennen kokeilua

8. Pelaajaoppiminen → Scratch-klubi
• Annetaan ongelma ilman ratkaisua
→ Scratch-haasteet
• Ratkaisu löydetään kokeilemalla ilman ohjeita
→ Haasteissa vihjeitä
• Virheet opettavat
→ Yrityksen ja erehdyksen kautta oivallukseen
• Virheistä opittaessa syntyy ratkaisumalleja
→ Ongelmanratkaisutaidot
• Avun pyytäminen online-foorumeista
→ scratch.mit.edu
• Ongelmatilanteissa pyydetään apua kavereilta
→ Kollegat ja oppilaat
• Ratkaisun jakaminen muille
→ scratch.mit.edu

9. Työnkulku
Ohjeiden valmistelu
Verkkopohjaiset,
interaktiiviset ohjeet
Päivän kurssi
Opettajan vetämänä
pienryhmässä
Arviointi
Etäpalaverina päivän
päätteeksi
Monialainen
Ville paikalla
ensimmäisenä päivänä
ValOS-alustan, HTML:n ja JavaScriptin alkeet
Aloitus
Osana EU:n
CodeWeekiä
Sisällön kehitys
Sovelluksen tekstisisältöjä
ja tyylejä kehitettiin
Viimeistely
Projekti viimeisteltiin
ja esiteltiin

13. Työnkulku
Ohjeiden valmistelu
Verkkopohjaiset,
interaktiiviset ohjeet
Päivän kurssi
Opettajan vetämänä
pienryhmässä
Arviointi
Etäpalaverina päivän
päätteeksi
Monialainen
Ville paikalla
ensimmäisenä päivänä
ValOS-alustan, HTML:n ja JavaScriptin alkeet
Aloitus
Osana EU:n
CodeWeekiä
Sisällön kehitys
Sovelluksen tekstisisältöjä
ja tyylejä kehitettiin
Viimeistely
Projekti viimeisteltiin
ja esiteltiin

14. Lopputulos
Kaksiosainen projekti, jossa toisella
puolella datavisualisointi ja toisella
puolella ilmastonmuutosta
käsittelevä tutkielma.
If video on the right doesn’t play, you can view it in YouTube.

15. Mikä toimi?
• Eritasoiset oppilaat pystyivät osallistumaan projektiin tasa-
arvoisesti
• Google Docs –tyyppinen editointi
• Kokoavaan projektiin tuotiin HTML-sivu ja interaktiivinen kuvaaja
• Lopputuotoksesta kaikki olivat ylpeitä ja se oli helppoa
näyttää muille

16. Tiedonhaku Ilmastonmuutos
Avoin dataOhjelmointi
KYKYHTML
Monialainen
oppimis-
kokonaisuus

17. Kipukohdat
• CSS (Cascading Style Sheets) ei motivoinut samalla tavalla,
kuin muu ohjelmointi → sen yksinkertaistamiseen ei ole
(vielä) tehty töitä
• Kehitysvaiheessa olevan alustan oikut
• Materiaalien puute ja alustan kielen nyanssierot HTML:n ja
JavaScriptin verkko-oppimateriaaleihin

18. ValOS
• Avoimen lähdekoodin sovelluskehitysarkkitehtuuri
• Tavoitteena tehdä web-applikaatioiden toteuttamisesta
opittavampaa ja yksinkertaisempaa ilman kompromisseja
• Perustuu HTML:ään ja omaan JavaScript-kielen murteeseen
• Kaksi kieltä (VSX ja VS) ja yksi selainpohjainen työkalu riittää
minkä tahansa sovelluksen toteuttamiseen alusta loppuun
• Expander-rajapintaintegraatiot

20. Vaihe 1
Aloita projekti
Vaihe 2
Lisää datalähde
Vaihe 3
Kirjoita koodia
Vaihe 4
Nää lopputulos

21. Kynnyskäsitteet
• Kynnyskäsitteet ovat oppimisen kannalta tärkeitä paalukiviä
• Portti uudenlaiseen kehittyneempään ajatteluun
• Alusta pyrkii vähentämään / yksinkertaistamaan
kynnyskäsitteitä, kuten
• Olio-ohjelmointi
• Versionhallinta
• Tietokannat
• Rajapinnat
• Web-ohjelmoinnissa useita muita (moduulien niputus, tilanhallinta,
tietoturva, palvelimet)

22. Tulevaisuus
• Mukautuva kehitysympäristö
• Editori rakennettu työkalulla itsellään
• Esim. Blockly (developers.google.com/blockly/) koodille
• Ohjelmoinnin oppimisanalytiikka
• Tapahtumapohjainen lähdekoodin tallennus
• Avoimien, toiminnallisten komponenttien ja sisältöjen jako

23. ValOS Lab -innovaatioympäristö
• 6 viikon projektioppimista hyödyntävä ohjelmointikurssi
• Projektit 1-2 viikon mittaisia (RIVERIA, Tampereen Kaupunki,
CSC – Tieteen Tietotekniikan keskus)
• Pilotoitu Tampereella TAKKin ja Tredun VALMA-
opiskelijoiden kanssa 7 kuukauden ajan
• Huhtikuussa CODEV-koulussa (Ensenada, Meksiko)

25. Miten käyttöön?
Kattavammat, interaktiiviset ohjeet
työn alla (huhtikuu). Tampereella
10:00-12:00 kaikille avointa
koulutusta joka arkipäivä.
Verkkosivut (avoin Beta-ympäristö):
valaa.com
GitHub (lokaali kehitysympäristö):
github.com/valaatech
Facebook (uutisia ja tietoa):
facebook.com/valaainspire
Yhteys:
ville@valaa.com