CodeGym-App für Mobilgeräte

1. Das Problem bei allen mobilen Apps

CodeGym-Studenten haben schon lange nach einer mobilen App gefragt. Und wir verstehen, warum – in der heutigen Welt ist ein Telefon leichter verfügbar als ein Desktop-Computer, auf dem IntelliJ IDEA installiert ist. Es ist viel einfacher, sich mehrmals am Tag 15 Minuten Zeit zu nehmen, als sich 1-2 Stunden am Stück zum Lernen hinzusetzen.

Das Lernen auf CodeGym wäre viel effektiver, wenn wir herausfinden würden, wie wir jede Gelegenheit, die sich uns bietet, voll ausnutzen können. Aber wie installiert man eine IDE auf seinem Telefon?

Lange Zeit hielten wir das für nicht möglich. Dies wurde von unseren Mitbewerbern immer wieder bestätigt: Alle Apps zum Erlernen des Programmierens verzichteten auf das Schreiben von Code und ersetzten ihn durch Tests.

Doch dann, zu Beginn des Jahres 2019, gelang uns der Durchbruch. Anstatt riesige IDEs zu replizieren, haben wir uns entschieden, uns auf die Herausforderungen zu konzentrieren, denen Benutzer beim Schreiben von Code gegenüberstehen. Unsere Lösung basierte auf ein paar einfachen Prinzipien:

• Das Lesen von Code ist wichtiger als das Schreiben von Code
• Der von Ihnen eingegebene Code ist wichtiger als die Art und Weise, wie Sie ihn eingeben
• Die Verwaltung des Cursors muss einfach und intuitiv sein
• Es gibt nicht den einen und einzigen Weg, eine Aufgabe richtig zu lösen.

2. Unsere Lösung

Es ist uns gelungen, eine ziemlich schöne Lösung zu schaffen , die all diesen Prinzipien entspricht.

Code anzeigen

Zunächst haben wir beschlossen, separate Modi zum Anzeigen und Bearbeiten von Code zu erstellen. Im Code-Anzeigemodus wird durch Wischen der Text gescrollt, anstatt den Cursor zu bewegen. Außerdem ist es bequemer, Code anzuzeigen, wenn die Tastatur nicht die Hälfte des Bildschirms einnimmt.

Hinweise (vorgeschlagene Wörter)

Für jede Aufgabe haben wir eine Reihe von Schlüsselwörtern vorbereitet, mit denen der Benutzer eine Lösung schreiben kann. Jetzt müssen Sie Wörter nicht mehr Buchstabe für Buchstabe eingeben. Klicken Sie einfach auf die vorgeschlagenen Wörter in der richtigen Reihenfolge und schon sind Sie fertig. Sie können jedoch jederzeit zur üblichen Art der Codeeingabe wechseln, indem Sie Buchstabe für Buchstabe auf der Tastatur eingeben.

Es sollten genügend Vorschläge vorhanden sein, damit der Benutzer seine eigene Version einer Lösung schreiben kann. Aber nicht so viele, dass unnötige Worte einfach in die Quere kommen. Wenn es viele vorgeschlagene Wörter gibt, sollten es Gruppen sein; Wenn es nur wenige gibt, sollten sie zusammen angezeigt werden.

Und natürlich müssen die vorgeschlagenen Wörter für jede Aufgabe eindeutig sein . Für jede der 1500 Aufgaben, die es auf CodeGym gibt. Wir haben zwei Monate damit verbracht, den Algorithmus zur Generierung von Hinweisen zu verfeinern. Auch damals mussten wir die Vorschläge für jede Aufgabe noch manuell bearbeiten.

Das Ergebnis ist beeindruckend, aber ich denke, wir werden es weiter verbessern.

Mauszeiger

Die Verwaltung des Cursors verdient eine eigene Geschichte. Es ist äußerst umständlich, den Cursor mit dem Finger zu bewegen. Zuerst verdeckt Ihr Finger den Code. Zweitens besteht die häufigste Aktion mit dem Cursor darin, ihn ein bis zwei Zeichen vorwärts oder rückwärts zu bewegen.

Wir haben eine spezielle Joystick-Schnittstelle entwickelt , mit der Sie den Cursor steuern können, ohne den Code zu verdecken. Wir haben außerdem spezielle Schaltflächen zum Bewegen des Cursors um jeweils ein Zeichen hinzugefügt . Und das alles, damit Sie über den Code nachdenken können, den Sie eingeben, und nicht über den Vorgang der Eingabe dieses Codes!

3. Übersicht über die mobile App

Heute besteht die mobile App aus 4 Abschnitten:

• Java-Kurs
• Aufgaben
• Hilfe
• Gruppen

Und hier sind noch ein paar Details zu jedem von ihnen.

Java-Kurs

Im Abschnitt „Java-Kurs“ wird eine Liste aller CodeGym-Levels angezeigt, die in Quests gruppiert sind. Auf jeder Ebene werden die entsprechenden Lektionen angezeigt. Über die Schaltfläche „Start/Weiter“ gelangen Sie ganz einfach zur aktuellsten Lektion.

Aufgaben

In diesem Abschnitt werden alle für den Benutzer verfügbaren Aufgaben angezeigt. Sie sind in drei Listen unterteilt: „Neue Aufgaben“, „Aufgaben in Bearbeitung“ und „Erledigte Aufgaben“.

Nach einem Klick auf eine bestimmte Aufgabe öffnet sich MobileIDE . Hier können Sie die Aufgabenbedingungen, Anforderungen und den Code einsehen und auch Ihre Lösung verfassen. Sie können eine Aufgabe auch mit nur einem Klick zur Überprüfung einreichen.

Hilfe

In diesem Abschnitt werden Fragen zu Aufgaben angezeigt. Sie können die von anderen Benutzern gestellten Fragen einsehen, deren Code untersuchen und ihnen Ratschläge und Empfehlungen geben. Das geht hier fast genauso einfach wie auf der Website.

Sie können auch eigene Fragen zu Aufgaben stellen. Ihr Code wird Ihrer Frage automatisch hinzugefügt – Sie müssen nichts kopieren.

Gruppen

Im Bereich „Gruppen“ können Sie Gruppen zu bestimmten Themen beitreten sowie Artikel lesen und veröffentlichen. Das Tippen auf dem Telefon ist nicht wirklich praktisch, daher konzentriert sich dieser Abschnitt derzeit auf das Lesen von Materialien, die über die Webversion veröffentlicht werden.