Topics

Claude × App-Entwicklung ohne Programmierkenntnisse ① - Entwickeln, testen, nachjustieren. Eine neue Art des Machens, bei der Apps wachsen

  • column

Dass man Apps mit KI entwickelt, ist inzwischen gar nicht mehr so ungewöhnlich.

Lange Zeit galt KI vor allem als "kompetenter Assistent", der bei Textzusammenfassungen oder Ideensammlungen hilft. Inzwischen entwickelt sie sich jedoch zunehmend zu einem "verlässlichen Partner", der die Entwicklung selbst vorantreibt.

Auch unsere Mitarbeitenden kommen immer häufiger mit KI in Berührung. Der Gedanke "Das probiere ich selbst auch mal aus" war der Ausgangspunkt für diese App-Entwicklung.

"Wenn schon, dann etwas, das im Arbeitsalltag hilft ..." – das war zunächst mein Plan. Doch als Erstes fiel mir kein Arbeitsthema ein, sondern ein Hobby.

Seit Kurzem bin ich dem Filmeschauen verfallen und sehe mir jede Woche einige Filme an. Meine Watchlist, geplante Filme und Titel, die mir gefallen haben, habe ich bisher alle in der Notizen-App auf meinem iPhone gesammelt.

Allerdings wuchs die Liste schnell, und viele Titel ähnelten sich, sodass ich öfter dachte: "Moment, habe ich den schon gesehen?" Schließlich war die Verwaltung in der Notizen-App nicht mehr praktikabel.

Also beschloss ich, mir ein eigenes Tool zu bauen. Daraus ist die "Filme-Watchlist" entstanden, die ich in diesem Beitrag vorstelle.

Auch mit einem groben Prompt lässt sich eine funktionierende App bauen

Wenn es um KI-gestützte Entwicklung geht, entsteht oft der Eindruck, dass man einen Prompt bis ins kleinste Detail ausformulieren muss.

Viele denken vermutlich auch, dass man Hintergrund und Spezifikationen sorgfältig ordnen und alle Anforderungen lückenlos mitteilen muss, bevor überhaupt etwas Brauchbares entsteht.

Natürlich ist es von Vorteil, wenn man Hintergrund und Spezifikationen gesammelt übergeben kann. Bei unserem Test hat sich jedoch gezeigt, dass die KI auch bei sehr groben Anweisungen die eigentliche Absicht versteht und entsprechend umsetzt.

Das mag daran liegen, dass es sich um eine einfache App handelte, doch der Prompt bestand lediglich aus allen gewünschten Funktionen in einem Zug, und dabei entstand eine App, die problemlos funktioniert. Der erste Prompt sah so aus:

Ich möchte eine Watchlist für Filme erstellen.
Da es sich zunächst um einen Prototyp handelt, soll alles in einer einzigen HTML-Datei umgesetzt werden, damit sie sich direkt im Browser öffnen lässt und sofort funktioniert.
Funktional soll man Filmtitel und die Plattform eingeben können, auf der der Film verfügbar ist (z. B. U-Next, Prime Video), und die gespeicherten Titel sollen in einer Liste angezeigt werden.
Außerdem soll man Filme als „gesehen“ markieren können.

Bei der klassischen Entwicklung ohne KI verbringt man selbst bei einfachen Projekten mühelos mehrere Stunden damit, „eine UI zu überlegen“, „die passenden Technologien auszuwählen“ und „den Code zu schreiben“. Claude hingegen verstand innerhalb weniger Minuten, was gewünscht war, und erledigte alles reibungslos – von der Auswahl der optimalen UI und Werkzeuge bis zur fertigen Umsetzung.

Das Tempo war so hoch, dass ich eher verblüfft als beeindruckt war und mich sogar ein leichtes Gefühl von Unbehagen beschlich.

Bei einem so schnellen Fortschritt wächst auch der Wunsch nach mehr. Sobald die Grundlage stand, habe ich unablässig alle Anforderungen geschickt, die mir einfielen. Die Prompts waren dabei alles andere als sauber formuliert: Ich habe auffällige Stellen als Aufzählung notiert und einfach geschrieben „Bitte hier ändern“. Bei einem menschlichen Entwickler wäre das vermutlich auf wenig Begeisterung gestoßen.

Nach einigen solchen unkomplizierten Hin- und Her-Runden stand das grobe Gerüst der Watchlist schnell.
Einschließlich Feinabstimmung dauerte es rund eine Stunde, bis die erste Version der App fertig war.

Sofort umgesetzt, Schritt für Schritt weiterentwickelt

Einige Tage nach Fertigstellung des Grundgerüsts gab es eine Runde, in der jeder seine mit KI erstellte App vorstellte, sodass wir die Arbeiten der anderen Teammitglieder sehen konnten. Dabei war auch jemand, der eine App mit "Gemini Nano" entwickelt hatte.

Als ich das sah, dachte ich mir: "Stimmt, ich nutze auch Gemini, um Filme zu finden, die ich sehen möchte. Könnte ich das nicht in meine App integrieren und auf Basis meiner Watchlist nach Filmen suchen?" Nach Feierabend machte ich mich gleich wieder an die Entwicklung.

Bei einem menschlichen Entwickler würde so ein eigenmächtiges Erweitern der Spezifikation mitten in der Entwicklung sicher für Ärger sorgen, aber genau hier zeigt sich die Stärke von KI: Sie nimmt solche Änderungen ganz selbstverständlich auf. Auch diese Suchfunktion war in wenigen Minuten implementiert.

Damit funktionierte die Suche schließlich, doch als Nächstes beschäftigte mich die "Genauigkeit".

Anfangs hatte ich eine eher grobe Spezifikation: Auf Basis nur des Titels und des Genres der Filme in der Watchlist sollte die KI einige Empfehlungen ausgeben. Dadurch passte zwar das Genre, doch die vorgeschlagenen Filme entsprachen häufig nicht meinem Geschmack. Ich habe daraufhin unter anderem umgestellt, sodass auf Basis der als Favoriten markierten Titel ausgewählt wird, aber das Ergebnis blieb dasselbe.

Ich vermutete, dass Titel und Genre allein zu wenig Informationen liefern, und beschloss deshalb, die Handlungszusammenfassung jedes Films als zusätzliche Information zu hinterlegen. Allerdings wollte ich die Zusammenfassungen auf keinen Fall jedes Mal selbst eingeben, das wäre viel zu mühsam. Nach langem Überlegen entschied ich mich, auch hier die Hilfe von KI in Anspruch zu nehmen.

Ich habe die App so umgebaut, dass die Handlungszusammenfassungen automatisch anhand der eingegebenen Titel in der Liste registriert werden. Um die Genauigkeit der Zusammenfassungen sicherzustellen, ruft der Code über die Wikipedia-API die passenden Informationen zum jeweiligen Titel ab, und auf dieser Grundlage erstellt die KI die Zusammenfassung automatisch. Auch diesen Code ließ ich wieder von Claude schreiben.

Ehrlich gesagt sind die Ergebnisse immer noch nicht ganz präzise, und langfristig erwäge ich, auf eine Anbindung an die TMDB-API umzustellen. Trotzdem habe ich einen Punkt erreicht, an dem kleine Fehler verschmerzbar sind. Für diese Feinabstimmung habe ich etwa zwei bis drei Stunden gebraucht.

Nebenbei bemerkt: Als ich die App später auf einem echten Gerät einsetzen wollte, stellte sich heraus, dass Gemini Nano dort wohl nicht verfügbar war. Deshalb bin ich letztlich auf die Gemini API umgestiegen. Die kostenlose Variante hat zwar eine Begrenzung der Anfragen, aber man kann damit ein leistungsfähigeres Modell nutzen als mit Gemini Nano, und dadurch hat sich die Genauigkeit deutlich verbessert.

Eine kleine Vorstellung der fertigen App

Diese App wurde nach und nach während der Entwicklung erweitert und dabei ganz im Sinne von „Wachsen durch Nutzung“ gestaltet. Am Ende standen so viele Funktionen zur Verfügung.

Watchlist

  • Erfassung von Filmtitel, Genre, Streamingdienst und Inhaltsangabe
  • Automatische Generierung von Inhaltsangaben über verschiedene APIs
  • Umschaltung zwischen „Noch nicht gesehen“ und „Bereits gesehen“
  • Filterfunktion nach Genre, Favoriten sowie Status „Noch nicht gesehen“ / „Bereits gesehen“

Filmsuche

  • Auf Basis der Favoriten schlägt Gemini passende Filme vor
  • Genre und Anzahl der Vorschläge können festgelegt werden
  • Empfohlene Filme mit einem Tipp in die Watchlist aufnehmen
  • Bereits gesehene Filme lassen sich ebenfalls hinzufügen und mit einem Status „gesehen“ markieren

Bisher waren das Suchen nach Filmen und das Festhalten gesehener Filme getrennte Aufgaben. Diese App vereint beides in einem Werkzeug.
Früher musste ich der KI bei jeder Suche erklären, was ich mag. Diesen Aufwand gibt es nicht mehr, und ich kann jederzeit passende Filme finden.

Auch die Watchlist, der eigentliche Zweck der Anwendung, lässt sich nun nach Sehstatus, Favoriten und Genre filtern. Die Verwaltung ist dadurch deutlich komfortabler als in der Zeit mit der Notizliste.

Besonders praktisch finde ich, dass sich Filme, die in der Liste fehlen, direkt aus den Suchergebnissen mit einem Tipp hinzufügen lassen.
Das Eintippen des Titels entfällt damit ebenfalls.

Fazit

Wer bis hierhin gelesen hat, hat vielleicht schon bemerkt: Für die Entwicklung dieser App habe ich keine einzige Zeile Code geschrieben. Ich habe lediglich in Worten beschrieben, welche Funktionen ich mir wünsche, und Claude hat alles umgesetzt.

Die wichtigste Erkenntnis war, dass man das fertige Ergebnis nicht von Anfang an festlegen muss. Während der Nutzung fällt einem auf, „Das hätte ich auch gern“ oder „Das passt so nicht ganz“, und dies teile ich Claude dann jeweils mit. Eine App zu entwickeln fühlte sich daher eher nach Wachsenlassen als nach Bauen an.

Wer zögert, weil er glaubt, Prompts müssten besonders sorgfältig formuliert werden, kann einfach zunächst grob anfangen. Entspricht das Ergebnis nicht den Vorstellungen, lässt es sich Schritt für Schritt korrigieren. Echte Fehlschläge gibt es dabei kaum. Wer es einmal ausprobiert, merkt schnell, dass es erstaunlich gut funktioniert.

Probieren Sie es einfach unverbindlich aus.

Über den Autor

Als Neueinsteiger hat er sich zum Director hochgearbeitet und kämpft derzeit mit vollem Einsatz. Ob Design oder Werbeschaltung: Er strebt danach, in allen Bereichen zu Hause zu sein und ein wahrer Allrounder zu werden. Beruflich setzt er auf einen souveränen Projektauftritt, privat genießt er das Leben als Stubenhocker in seiner Festung namens Zuhause. Außerdem ist er ein Anime-Fan.

Handan-chan

Web Director / Eintritt 2022

Artikel dieses Teammitglieds ansehen

Verlässliches Team und schnelle Reaktionsfähigkeit sind unsere Stärken

Bei Liberogic werden wir von unseren Kunden hoch geschätzt, da unsere erfahrenen Mitarbeiter Projekte proaktiv vorantreiben.
Wir achten darauf, Projektmanager und Direktoren gezielt einzusetzen, damit das gesamte Projekt reibungslos verläuft. Um unnötige Kostensteigerungen durch Vollzeitbindung zu vermeiden, verteilen wir Ressourcen passgenau. Zudem sind wir für unsere Geschwindigkeit bekannt, vom Verständnis der Anforderungen bis zur Erstellung und Einreichung von Angeboten.

Hinweis: Wir bieten keine SES-typischen Vor-Ort-Einsätze an. Wir bitten um Ihr Verständnis.

Sie können nahezu alle gängigen Tools für Projektmanagement und Chat nutzen, darunter Slack, Teams, Redmine, Backlog, Asana, Jira, Notion, Google Workspace, Zoom, Webex und viele weitere.

Sprechen Sie uns gerne auf Ihre Herausforderungen im Web an.

Fallstudien