Apps & Web
Twee sporen die elkaar versterken: het app-spoor bouwt in het gratis MIT App Inventor op van een dierengeluiden-soundboard naar een boerderijquiz, een digitale verzorgtracker met TinyDB en een GPS-speurtocht die kinderen zelf over het terrein uitzetten. Het web-spoor typt échte HTML en CSS via de gratis Neocities-tutorials en eindigt met een live, deelbare website. De jongsten starten zonder typen met Canva, de oudsten proeven met Glide hoe een spreadsheet zonder code een app wordt. Alle content — foto's, geluiden, dierdata — komt van de échte dieren op de kinderboerderij, en de software kost in elk spoor €0.
Het systeem: twee sporen, één boerderij
Geen enkel onderdeel is betaalde software. De opbouw klimt van slepen (Canva) naar blokken (App Inventor, met dezelfde logica als Scratch uit het Game-Kamp) naar échte code (HTML/CSS op Neocities), met Glide als no-code power-les voor wie liever met data werkt dan met schermpjes.
App Inventor: blokken zoals Scratch
MIT App Inventor is gratis en draait volledig in de browser (ai2.appinventor.mit.edu) — geen installatie nodig. De blokkentaal lijkt sterk op Scratch, dus wie dat al kent start met een voorsprong. Testen kan live op een Android-toestel via de gratis MIT AI2 Companion-app (zelfde wifi als de laptop) of via de ingebouwde emulator — al mist die camera, GPS en Bluetooth.
Neocities: échte HTML en CSS
Geen sleep-tool maar echte code, stap voor stap via gratis interactieve tutorials: eerst tekst en opmaak, dan afbeeldingen en links, dan CSS-styling, dan meerdere pagina's aan elkaar koppelen. Elk kind publiceert op gratis 1 GB-hosting (naam.neocities.org) — een echte, deelbare link die mee naar huis gaat.
No-code als instap en contrastles
Voor de jongsten: Canva for Education, volledig gratis voor jeugdwerk, drag-and-drop zonder één regel code. Voor de oudsten: Glide zet een Google Sheet zonder code om in een navigeerbare app — een verrassend snel contrast na de tragere blocks-projecten, en het laat zien dat data en app gescheiden kunnen zijn.
De dieren leveren de content
Geen verzonnen voorbeelddata: de foto's, geluiden en dierinfo in elke app en elke webpagina komen van een écht bezoek aan de kinderboerderij. Een kip opnemen voor het soundboard, de geit fotograferen voor het paspoort, het personeel interviewen voor de quizvragen — onderzoek en techniek lopen hand in hand.
De bouwstenen
Elf projecten door elkaar geweven tot twee opklimmende sporen. De badges tonen welke leeftijdsgroep het onderdeel trekt.
| Onderdeel | Wat | Groep | Duur | Kost |
|---|---|---|---|---|
| Canva-website | "Mijn lievelingsdier" — drag-and-drop, geen code | 6-8 | halve dag instap | €0 |
| Dierengeluiden-soundboard | knop → geluid, foto en naam, eigen opnames | 6-8 9-11 | halve dag | €0 |
| Scratch-verhaal → webpagina | kort minigame, embedden via iframe-code | 6-8 9-11 | 1 dag | €0 |
| Boerderijquiz-app | score-variabele, "volgende vraag"-procedure | 9-11 | 1 dag | €0 |
| Dierenpaspoort-pagina's | gedeelde CSS, eigen HTML-pagina per dier | 9-11 12-14 | halve dag | €0 |
| HTML/CSS vanaf nul | volledige Neocities-site, opbouw over 5 dagen | 9-11 12-14 | kern, meerdere dagen | €0 |
| GPS-speurtocht-app | LocationSensor, coördinaten inmeten en buiten testen | 9-11 12-14 | 1 dag | €0 |
| Digitale verzorgtracker | TinyDB, lijsten, opslag tussen sessies | 12-14 | 1-1,5 dag | €0 |
| Bezoekersgids (Glide) | Google Sheet wordt navigeerbare app, zoekfunctie | 12-14 | halve dag | €0 |
| Kampkrant-website | groepswerk: artikels, fotogalerij, taakverdeling | 9-11 12-14 | 1-2 dagen | €0 |
De drie leeftijdsversies
Klikken, slepen, meteen een eigen plekje online
Kuikens bouwen zonder te typen: eerst de Canva-website "Mijn lievelingsdier" (drag-and-drop, gepubliceerd via een link), en met wat hulp hun eerste Dierengeluiden-soundboard in App Inventor — knoppen die bij een tik het geluid van hun favoriete dier afspelen.
- Canva: sjabloon kiezen, foto en tekst slepen, geen code — resultaat binnen het half uur, direct deelbaar via een link.
- Soundboard: de begeleider zet de Button- en Sound-componenten al klaar; Kuikens kiezen kleur, foto en koppelen hun eigen geluidsopname.
- Opnames: elk Kuiken neemt zelf één dierengeluid op tijdens het boerderijbezoek — dat wordt letterlijk hun eigen knop.
- Korte blokken van 30-35 minuten, telkens een kant-en-klaar onderdeel af tegen het einde van het dagdeel.
- Testen gebeurt samen met de begeleider op één gedeeld toestel, geen individueel debuggen.
- Let op: geen zelfstandig App Inventor-canvas — te veel losse componenten om zelf te overzien.
De kern: eigen app van blokken tot werkend geheel
Veulens draaien de App Inventor-kern: van het soundboard (als opfrisser) naar de volledige Boerderijquiz-app met een score-variabele en een "volgende vraag"-procedure, plus een eerste kennismaking met de Neocities-webtutorial.
- Werken zelfstandig in vaste duo's, elk duo beheert één project op één laptop.
- Interviewen zelf boerderijpersoneel voor echte quizvragen over dieren, voeding en verzorging.
- Testen live via de gratis MIT AI2 Companion-app op een eigen of klas-Android- toestel, zelfde wifi als de laptop.
- Startdag Neocities: eerste HTML-pagina met tekst, foto en kleur — hun eigen Dierenpaspoort.
- Meetbaar doel per sessie: "werkt de score-teller? springt hij naar de volgende vraag?"
- Rollen wisselen binnen het duo: wie codeert, wie test, wie noteert bugs.
Eigenaarschap: echte data, echte code, werfleider
Alpaca's bouwen de Digitale verzorgtracker met TinyDB (data blijft bewaard tussen sessies), proberen Glide als no-code contrastles, en werken met échte HTML/CSS voor een meerpaginasite of de Kampkrant.
- Verzorgtracker: TinyDB.StoreValue/GetValue, lijsten per dier, vertaling van het echte (vaak papieren) verzorgschema van het personeel.
- Glide-namiddag: dezelfde dierdata in een Google Sheet, Glide bouwt er in enkele klikken een navigeerbare app van — contrastles "data en app gescheiden".
- GPS-speurtocht: coördinaten zelf inmeten op het terrein, de LocationSensor-app buiten bouwen én testen (binnen wijkt GPS tot 20 m af).
- Neocities-verdieping: meerdere pagina's aan elkaar koppelen, eigen CSS-stylesheet, optioneel een eigen domeinnaam.
- Werfleider-rol: een Alpaca die een Kuiken door Canva of het soundboard loodst leert méér over interactie-ontwerp dan bij zelf spelen alleen.
- Kampkrant als groepswerk: taakverdeling schrijven, fotograferen, coderen, opmaken.
Dagroosters per formaat
2 dagen — proeversie
1App-start
- VMKennismaking + boerderijbezoek voor foto's en geluiden, App Inventor-basis (knoppen, geluid)
- NMDierengeluiden-soundboard afwerken en testen via AI2 Companion
2Kiezen: quiz of paspoort
- VMBoerderijquiz-app (Veulens+) of Dierenpaspoort-webpagina (wie liever typt)
- NMAfwerken en testen, mini-expo voor de ouders
4-5 dagen — kernversie
1Kennismaking
- VMBoerderijbezoek: foto's en geluidsopnames verzamelen, interviewvragen voorbereiden
- NMDierengeluiden-soundboard-app bouwen en testen
2Quiz
- VMInterview boerderijpersoneel, quizvragen en structuur opzetten
- NMScore-variabele en "volgende vraag"-procedure bouwen, testen in duo's
3Data
- VMAlpaca's: verzorgtracker met TinyDB · Kuikens/Veulens: Canva-website en eerste Neocities-pagina
- NMGlide-gids uitproberen (wie klaar is), Dierenpaspoort verder afwerken
4Buiten
- VMGPS-coördinaten inmeten op het terrein, speurtocht-logica bouwen
- NMWandelend de eigen speurtocht live testen tussen de dierenweides
5Finale
- VMDierenpaspoort-pagina's afwerken met gedeelde CSS
- NMApp & Web Expo — demo voor ouders en boerderijpersoneel
10 dagen — het volledige App- & Web-parcours
W1Week 1: het app-spoor
- Dag 1-5 zoals de kernversie: soundboard → quiz → tracker/Glide → GPS-speurtocht → tussendemo
- Elke dag ook een kort boerderijmoment: content verzamelen voor de volgende stap
W2Week 2: het web-spoor
- Dag 6: HTML/CSS vanaf nul starten (Neocities: tekst, opmaak, afbeeldingen, links)
- Dag 7: CSS-styling + Dierenpaspoort-pagina's met gedeelde stylesheet
- Dag 8: meerdere pagina's koppelen, start Kampkrant-website (taakverdeling schrijven/fotograferen/coderen)
- Dag 9: koppeling — verzorgtracker-data als tabel tonen op de eigen website
- Dag 10: Kinderboerderij Tech Expo — apps én websites samen tonen aan ouders
Materiaal & budget
| Post | Inhoud | Richtprijs |
|---|---|---|
| Software kern | App Inventor, Neocities, Canva for Education, Glide, Thunkable — volledig gratis, browser volstaat | €0 |
| Testtoestellen | Android-smartphones/tablets voor AI2 Companion en GPS — BYOD volstaat meestal | €0 bij BYOD |
| Herbruikbare tabletset (optioneel) | 8 tweedehands/budget Android-tablets (±€50-110/stuk), voor wie niet op BYOD wil rekenen | €400-900 eenmalig |
| Opname-microfoontjes (optioneel) | 1-2 goedkope clip-microfoontjes voor scherpere dierengeluiden-opnames | €10-20 |
| Eigen domeinnaam (optioneel, oudste groep) | extraatje bovenop de gratis Neocities-hosting | €10-15/jaar |
| Verbruik per editie | USB-kabels, printjes interviewvragen/wireframes, klemborden | €20-40 |