Learningapss: Apps überarbeiten

Für meinen Unterricht nutze ich immer wieder auch einmal Learningapps. Bisher habe ich die dort angebotenen App-Vorlagen immer mit den dort angebotenen Hausmitteln verändert. Doch heute kam ich an einen Punkt, an dem mich dies nicht mehr weiter gebracht hat. Ich wollte eine App zur phonologischen Bewusstheit erstellen: Wörter auf bestimmte Laute abhören und entsprechend zuordnen. Dazu sollte ein Bild angezeigt und durch die Kinder in der passenden Kategorie abgelegt werden. Als Unterstützung wollte ich die Text-to-Speech-Funktion von Learningapps nutzen, über die man das zum Bild gehörende Wort vorlesen lassen kann. Dazu zeigt Learningapps in der Ecke der Bildkarte ein Icon an. Fährt man mit dem Finger über das Icon, dann wird das Wort vorgelesen. Leider wird dabei aber auch das Wort selbst angezeigt. Pfiffige Kinder sehen dann den Buchstaben und müssen gar nicht mehr genau hinhören, ob und an welcher Stelle der Laut vorkommt.

Das wollte ich gerne ändern. Martina Grosty (@mgrosty) hat mir den entscheidenen Tipp gegeben. Unter jeder (fertigen) Learningapp wird der Link „Developer Source“ angeboten, mit dem man den Quellcode der App herunterladen kann. Dieser besteht im wesentlich aus einer Javascript-Datei und einem Stylesheet. Meine Programmierkenntnisse sind wirklich nur rudimentär, aber sie haben gereicht, um im Quellcode die Stelle zu finden, an der das Wort in der Hinweisbubble erzeugt wird:

(card.parameter.hint !== „“ ?
‚<span class=“hintbtn hintbtn_’+card.parameter.media+‘ popovers“‚+
‚ data-container=“#cardsOverlay“ data-toggle=“popover“ data-placement=“auto“‚+
‚ data-content=“‚+AppClient.linkifyText(card.parameter.hint).replace(/“/g,’&quot;‘)+'“>’+
‚<span class=“glyphicon glyphicon-info-sign infoicon“></span></span>‘
: “)+

Hieraus habe ich dann einfach folgendes gemacht:

card.parameter.hint !== „“ ?
‚<span class=“hintbtn hintbtn_’+card.parameter.media+‘ popovers“‚+
‚ data-container=“#cardsOverlay“ data-toggle=“popover“ data-placement=“auto“‚+
‚ data-content=“Höre genau“>’+
‚<span class=“glyphicon glyphicon-info-sign infoicon“></span></span>‘
: “)+
card.innerHTML+'</div>‘);

Und schon hatte ich die App, die ich haben wollte. Den fertigen Code haben ich dann über die Entwickler-Tools (https://learningapps.org/develop) in ein neues Projekt importiert, so dass ich danach auf Grundlage dieses Codes neue Apps erstellen kann.
Hier zeigt sich, welche große Stärke die Offenheit von Learningapps ist. Ich kann nicht nur jede App inhaltlich an meinen Unterricht anpassen, sondern auch (mit ein paar Programmierkenntnissen) funktionale Veränderungen vornehmen. Ich bin begeistert!

Anmerkungen: Die Bilder aus den Apps sind von Frau Locke. Hier können die Lizenzbedingungen zur Verwendung der Bilder nachgelesen werden!

Kommentare (2) Schreibe einen Kommentar

  1. Hallo Florian,

    ich bin auch begeistert darüber, wie sich die LearningApps immer wieder und Immer mehr als vielseitige Tools erweisen, was ja ganz eng damit verbunden sind, dass dies offen und frei zu nutzende Tools sind, so wie die Entwickler dies ja wünschen und vorgegeben haben.

    Ich vermute, dass die von Dir erwünschte Änderung tatsächlich gelungen ist. Ich sehe aber im Moment auch in der unten angezeigten LearningApp noch das jeweilige Wort angezeigt.

    Antworten

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.