In dieser Lektion werdet ihr…
- mehr über verschiedene App-Builder und Programmiersprachen erfahren.
- das Tool kennenlernen, das ihr zur Programmierung eurer App nutzt.
Schlüsselbegriffe
- App-Builder (z. B. Thunkable oder App Inventor): Programme, mit denen ihr Anwendungen (z. B. eine App) erstellen könnt, ohne Code eingeben zu müssen. Normalerweise haben sie eine „Drag and Drop“-Schnittstelle, mit der ihr vorgefertigte Code-Blöcke auf eure Arbeitsfläche ziehen könnt
- Drag and Drop: eine Funktion, mit der ihr etwas anklicken und mit gedrückter Maustaste an eine andere Stelle bewegen könnt
- App Live-Test: eine App auf dem Computer bearbeiten und die Änderungen direkt auf dem Smartphone sehen
- Programmiersprache: ein Weg, mit einem Computer oder Smartphone zu sprechen und ihnen zu sagen, was sie tun sollen
App-Builder und Programmiersprachen
Für euer Technovation-Projekt könnt ihr wählen, ob ihr eine eigene App programmieren möchtet, ein KI-Modell (KI steht für Künstliche Intelligenz) entwickeln oder sogar beides machen möchtet. Wir empfehlen, dass ihr erstmal mit dem Thema Appentwicklung startet. So könnt ihr herausfinden, ob euch das Spaß macht, oder ob ihr lieber etwas mit KI machen möchtet.
Und jetzt: seid ihr bereit, ins Coden einzusteigen und eure eigene App zu programmieren? In dieser Lektion lernt ihr App-Builder und Programmiersprachen kennen, die oft von Technovation-Teilnehmerinnen verwendet werden. Das Technovation-Curriculum enthält Beispielcode sowohl für App Inventor als auch für Thunkable, aber ihr könnt Apps in jeder dieser Sprachen einreichen: Thunkable oder Thunkable Classic, App Inventor, Swift oder Java. Wenn ihr zum ersten Mal programmiert, empfehlen wir euch, App Inventor oder Thunkable zu verwenden, damit ihr auf unsere Ressourcen zugreifen könnt. In Deutschland programmieren die meisten Technovation-Teams mit Thunkable.
Schlagt alle Wörter in dieser Lektion nach, die ihr nicht kennt. Falls Programmierer:innen nicht wissen, was etwas bedeutet, schlagen sie es ebenfalls nach. Als angehende Programmiererin ist es gut, Fragen zu stellen und sich mit neuen Wörtern vertraut zu machen.
App-Builder
App-Builder verfügen in der Regel über eine „Drag and Drop“-Schnittstelle, mit der ihr Apps erstellen könnt, ohne dass ihr Code eingeben müsst. Auch wenn der Code in App-Buildern einfacher aussieht, werdet ihr trotzdem wertvolle Coding-Grundlagen lernen. Hier sind zwei App-Builder, die im Technovation-Curriculum benutzt werden.
App Inventor |
Thunkable |
|
| Android | x | x |
| iOS | x | x |
| Open Source* | x | |
| Kostenlos | x | x (Kostenlos für öffentliche Apps, die jede:r sehen oder nutzen kann, maximal 10 Apps) |
| In vielen Sprachen verfügbar (neben Englisch) | x |
|
| Galerie mit Beispielprojekten | x | x |
| Prüfung in Echtzeit | Emulator oder mit Smartphone über Wifi | Eingebaute Vorschau im Browserfenster (sehr einfach) |
| User interface (Benutzeroberfläche) | Grundlegende Elemente | Mehr Optionen und Kontrolle |
| Maps | Mehr Optionen und Kontrolle | Grundlegende Elemente |
| Animationen für Spiele | Relativ einfache Nutzung | Funktioniert, ist aber komplizierter |
| Lokale Speicherung auf dem Gerät | TinyDB (Tag, Wert-Paare) | Local_Storage (Schlüssel-Werte-Paare) Local_DB (tabellenartige Speicherung) |
| Daten in der Cloud speichern und teilen | CloudDB (Tag, Wertepaare) | Airtable, Firebase, Google Sheets, Media DB (viele weitere Optionen) |
| Eingebaute KI-Komponente | Personal Image Classifier, Personal Audio Classifier, Posenet, Face Mesh (viele weitere Optionen) | Image Recognizer (vorgefertigter Microsoft Bildklassifikator) |
* Open Source bedeutet, dass der gesamte Code, der zur Erstellung des App-Builders verwendet wird, kostenlos und offen für die Verwendung im Internet ist. Das heißt, dass auch andere den Code nutzen können. Das kann wichtig sein, wenn man befürchtet, seine Arbeit zu verlieren, falls ein App-Builder nicht mehr unterstützt wird oder vom Markt verschwindet. Es kann aber auch wichtig sein, wenn man nach einer Möglichkeit sucht, einen App-Builder offline zu verwenden. Weitere Informationen findet ihr unter „Zusatzmaterial“.
Andere Programmiersprachen, die ihr nutzen könnt
Programmiersprachen geben euch die Möglichkeit, mit einem Computer zu sprechen und ihm zu sagen, was er tun soll. Neben App Inventor und Thunkable gibt es viele Programmiersprachen, die ihr zum Erstellen von Apps verwenden könnt. Zum Beispiel:
| Programmiersprache | Genutzt zum Erstellen von Apps für | Ihr benötigt außerdem |
| Java | Android | Android Studio
Android Studio ist das Programm, das man zum Erstellen und Testen des Java-Codes verwendet. |
| Swift | iOS | XCode
XCode ist das Programm, das man zum Erstellen und Testen des Swift-Codes verwendet. |
Was ihr zur Teilnahme an Technovation benötigt
- Computer
- Internetzugang
- Gmail-Konto: Ihr braucht ein Gmail-Konto (früher: Google Mail), um euch bei App Inventor oder Thunkable anzumelden. Um ein Gmail-Konto einzurichten, klickt hier.
- Ein mobiles Gerät ist optional, wird aber dringend empfohlen: Ihr könnt ein Android-Smartphone oder -Tablet oder ein iPhone oder iPad nutzen.
Nun solltet ihr alles einrichten, um mit dem Programmieren eurer App beginnen zu können. Die nächsten beiden Aktivitäten enthalten Anleitungen, wie ihr App Inventor oder Thunkable einrichtet. Ihr müsst nur eine dieser Aktivitäten durchführen. Das heißt: Entscheidet euch, ob ihr App Inventor oder Thunkable verwenden möchtet. Es kann hilfreich sein, mit euren Mentor:innen zu besprechen, was für euer Team besser ist. Wenn ihr euch nicht entscheiden könnt, nehmt Thunkable – das nutzen die meisten.
Wenn euer Team weder App Inventor noch Thunkable verwendet, solltet ihr die Zeit nutzen, um euch mit eurem App-Builder oder eurer Programmiersprache vertraut zu machen und eure Geräte einzurichten.
Aktivität: App Inventor einrichten
Führt diese Aktivität aus, wenn ihr App Inventor nutzen möchtet
Teil 1: Anmelden
- Geht zu http://appinventor.mit.edu/explore/ und klickt auf „Create Apps“ (Apps erstellen).
- Meldet euch mit eurem Gmail-Konto an. Wenn ihr noch keins habt, solltet ihr jetzt eins erstellen.
- Nehmt euch einen Moment Zeit und erkundet die Plattform. Oben rechts könnt ihr die Sprache auf Deutsch wechseln. Die nächsten Schritte führen euch durch die Einrichtung eures Smartphones oder Emulators für Live-Tests.
Teil 2: Anschließen eures Smartphones oder Emulators
Ihr könnt ein Smartphone oder einen Emulator anschließen, um Live-Tests durchführen. D. h. ihr könnt eure App im App Inventor auf dem Computer bearbeiten und seht sofort, wie diese Änderungen auf dem Smartphone oder Emulator angezeigt werden. Es gibt drei Arten, um eure App zu testen:
-
- Das ist der einfachste Weg, App Inventor zu verwenden und wird vom Technovation-Team empfohlen.
- Wählt diese Methode, wenn ihr ein Smartphone oder Tablet und Zugang zu WLAN habt.
- Damit diese Methode funktioniert, müsst ihr euren Computer und euer Smartphone an dasselbe WLAN-Netzwerk anschließen.
Bei der WLAN-Methode erstellt ihr Apps auf eurem Computer und testet sie auf eurem Smartphone mit der App Inventor Companion App, genannt „MIT AI2 Companion“ (Android) oder „MIT App Inventor“ (iOS). Klickt hier, um zu sehen, wie ihr euer Smartphone oder Tablet mit eurem Computer verbindet.
Tipps zur Fehlerbehebung
- Vergewissert euch, dass euer Computer und euer Smartphone sich im selben WLAN-Netzwerk befinden.
- Stellt sicher, dass ihr die richtige „MIT AI2 Companion“-App auf deinem Smartphone installiert habt: Android oder iOS.
- Wenn ein Fehler auftritt, klickt oben auf „Verbinden“ und dann auf „Refresh Companion Screen“.
- Falls ihr immer noch feststeckt, kann euch dieses (englische) Video vielleicht helfen: PhilsComputerLab: Verbindung mit Wi-Fi herstellen
- Dies ist die technisch schwierigste Methode und erfordert, dass ihr die Software auf eurem Computer installiert.
- Wählt diese Methode, wenn ihr ein Smartphone oder Tablet aber kein WLAN habt.
Mit dieser Methode erstellt ihr mit App Inventor eine App auf dem Computer und testet sie auf dem Smartphone, indem ihr es mit einem USB-Kabel anschließt. Ihr müsst die Software auf euren Computer und die dazugehörige App auf euer Smartphone herunterladen. Wenn ihr einen Windows-Computer nutzt, müsst ihr möglicherweise auch einen USB-Treiber für euer Smartphone installieren. Bei einem Mac braucht ihr euch nicht um USB-Treiber zu kümmern. Klickt unten, um die Anweisungen des MIT für die USB-Methode anzuzeigen. Klickt hier, um zu lesen, wie ihr euren Computer mit einem Smartphone oder Tablet über ein USB-Kabel verbindet.
Tipps zur Fehlerbehebung
- Vergewissert euch, dass ihr die richtige „MIT AI2 Companion“-App auf eurem Smartphone installiert habt: Android oder iOS.
- Wenn ein Fehler auftritt, klickt oben auf „Verbinden“ und dann auf „Refresh Companion Screen“.
- Möglicherweise müsst ihr die Entwickleroptionen aktivieren, bevor sie in den Einstellungen angezeigt werden. Hier ist ein guter Artikel, der euch zeigt, wie ihr Entwickleroptionen und USB-Debugging auf den meisten Android-Telefonen aktivieren könnt: howtogeek.
- Möglicherweise müsst ihr eurem Smartphone erlauben, dass es sich mit eurem Computer verbinden darf.
Mac
- Ihr erhaltet eine Warnmeldung, die besagt, dass „MITAppInventorSetup.pkg“ nicht geöffnet werden kann, weil es von einem „nicht identifizierten Entwickler“ stammt? Dann müsst ihr eure Standard-Sicherheitseinstellungen ändern, öffnet dazu „Sicherheit und Datenschutz“ in euren Einstellungen und klickt auf „trotzdem öffnen“. Oder ändert eure Einstellungen so, dass Apps von überall heruntergeladen werden können
Windows
- Stellt sicher, dass aiStarter läuft. Möglicherweise müsst ihr danach suchen und das Programm selbst starten.
- Wahrscheinlich benötigt ihr einen Treiber, damit euer Smartphone mit eurem PC funktioniert. Hier ist die MIT- Dokumentation zur Installation eines Treibers.
- Ihr solltet nachschlagen, welcher der richtige Treiber für euer Telefon ist. Bei einem Google-Smartphone wird euch die MIT-Dokumentation helfen.
- Möglicherweise müsst ihr den Treiber aktualisieren, den der Computer für euer Telefon nutzt (auch nachdem ihr einen neuen Treiber installiert habt). Hier findet ihr Anweisungen, wie dies funktioniert: Anweisungen zum Aktualisieren des Treibers
- Diese Methode kann sehr knifflig sein – insbesondere unter Windows – und wird vom Technovation-Team nicht empfohlen.
- Ihr solltet diese Methode verwenden, wenn ihr kein Android-Smartphone oder -Tablet besitzt.
Ein Emulator ist eine Software, die es euch ermöglicht, ein virtuelles Smartphone auf eurem Computer zu betreiben. Mit dieser Methode könnt ihr Apps auf dem Computer erstellen und sie mit einem Emulator auf dem Computer testen. Klickt hier, um eine Anleitung für die Emulator-Methode zu erhalten.
Tipps zur Fehlerbehebung
- Falls ihr Windows nutzt: Stellt sicher, dass aiStarter ausgeführt wird. Möglicherweise müsst ihr danach suchen und das Programm selbst starten. Der Emulator startet möglicherweise nur langsam.
- Klickt oben auf „Verbinden“ und dann auf „Refresh Companion Screen“, wenn ein Fehler aufgetreten ist oder der Emulator nicht antwortet.
Hier ist ein Video, das euch hilft, eine Verbindung mit dem Emulator herzustellen: Verwendung des Emulators
Aktivität: Thunkable einrichten
Hier findet ihr ein Video, das euch bei der Einrichtung von Thunkable hilft:
Erstellt jetzt ein Konto bei https://thunkable.com/#/ und richtet euer Gerät mit den folgenden Schritten ein:
Klickt auf die Fläche „Start Building“.
Benennt euer Projekt und stellt es auf „Privat“ oder „Öffentlich“. Öffentliche Projekte sind für alle sichtbar. Private Projekte sind nur für ihre Ersteller:innen sichtbar. Diese Option ist jedoch mit Kosten verbunden.
Auf der linken Seite seht ihr das Tutorial-Panel. Wenn ihr es nicht seht, klickt auf das Fragezeichen. Klickt auf das Tutorial „Getting started in a few minutes“ und folgt den Anweisungen.
Falls ihr kein mobiles Gerät (Android oder iOS) nutzt, könnt ihr eure App trotzdem mit der eingebauten Vorschau (preview) im Browser testen.
Reflexion
Nun solltet ihr einen App-Builder oder eine Programmiersprache gewählt und euren Computer so eingerichtet haben, dass ihr bereit seid, programmieren zu lernen!
Welchen App-Builder oder welche Programmiersprache verwendet ihr? Warum habt ihr euch dafür entschieden?
Technovation Challenge
Die beliebtesten App-Builder und Programmiersprachen beim Technovation-Wettbewerb
Hier findet ihr weitere Informationen darüber, welche Arten von App-Buildern und Programmiersprachen die Technovation-Teilnehmerinnen verwenden können. Bitte denkt daran, dass die Mehrheit der Halbfinalistinnen und Finalistinnen des World Summit App Inventor verwenden. In Deutschland nutzen jedoch die meisten Teams Thunkable. Es gibt keine Extrapunkte, wenn man eine andere Programmiersprache nutzt. Ihr könnt bei Technovation jede Programmiersprache nutzen, die ihr möchtet und mit der ihr euch wohl fühlt. Ihr müsst nur die Quellcodedateien mit der App einreichen.
| Programmiersprachen / App-Builder | Beliebtheit |
| App Inventor | 46 % |
| Thunkable | 44 % |
| Java | 7 % |
| Swift | 3 % |
Sneak Peek!
Hier sind zwei (englische) Videos vom App Inventor Team. Sie zeigen, wie man ein Problem auswählt, ein Design entwirft und eine App programmiert – also genau das, was ihr bei Technovation Girls lernen werdet! Macht euch aber keine Sorgen, wenn ihr noch nicht den ganzen Prozess versteht. Es ist nur ein kleiner Ausblick auf das, was kommt:
technovationgirls@dkjs.de