Learnling
Een huiswerkplanner voor middelbare scholieren, met een pixelart-studiemaatje, zes thema's en een koppeling met Magister.
Learnling is een huiswerkplanner voor middelbare scholieren, als desktop-app voor Windows. Het idee is simpel: je ziet altijd twee weken tegelijk, deze week en de volgende, en vanaf zaterdag schuift het boek alvast door naar de twee weken die komen. Huiswerk is een taak die je afvinkt of naar een andere dag sleept. Staat er in de agenda wel dát er huiswerk is maar niet wát, dan wordt het een mysterie dat je zelf ontcijfert. Voor toetsen en SO's plant de app vanzelf trainingsrondes in de dagen ervoor.
Het gezicht van de app is een studiemaatje: een kat, hond, papegaai, walvis of robot met een eigen naam, die meldingen geeft, af en toe een tip deelt en blij wordt als je iets afvinkt. Ik ben begonnen met 3D-dieren in three.js en heb daarna renders in Blender geprobeerd, maar uiteindelijk werd het pixelart. De sprites zijn getekend als tekstrasters met een kleurenpalet in TypeScript, opgebouwd uit lagen voor ogen, mond, staart en hoofddeksel. Zo is een nieuw dier toevoegen vooral tekenwerk. Zes stemmingen en kleine effecten, zoals zzz en sterretjes, worden op een canvas geanimeerd.
Er zijn zes thema's: een toverboek, een moestuin, een oceaanduik, een ruimtemissie, een questlog en een gewoon notitieboek. Elk thema verandert niet alleen de kleuren en letters, maar ook de woorden: in de moestuin plant je een nieuw zaadje, onder water maak je een nieuwe duik. Het maatje krijgt er een passend hoofddeksel bij, van tovenaarshoed tot duikbril. Hoe speels een thema ook is, de tekst moet altijd goed leesbaar blijven; een test controleert dat elke tekstkleur minstens 4,5:1 contrast haalt.
Learnling kan lessen, huiswerk en toetsen ophalen uit Magister. Daar is geen officiële API voor, dus je logt in op de echte Magister-loginpagina in een Electron-venster en daarna leest de app op de achtergrond mee. Learnling leest alleen en schrijft nooit iets terug, en wat je zelf hebt aangevuld of afgevinkt wordt bij een sync nooit overschreven.
De app is gebouwd met Electron, React, TypeScript en Tailwind CSS 4. Alles wordt lokaal bewaard, de app werkt met touch en is in het Nederlands en Engels te gebruiken. Nieuwe versies worden via GitHub Actions gebouwd en de app werkt zichzelf automatisch bij. De productpagina staat op GitHub Pages, met dezelfde pixelmaatjes en een themakiezer.
Bekijk Learnling en download de app