Projektportfolio

KI als Werkzeug –
Konzeption als Kompetenz

Eine Auswahl von Anwendungen und Tools, die im iterativen Zusammenspiel mit KI entstanden sind. Jedes Projekt verbindet fachliche Konzeption und inhaltliche Steuerung mit KI-gestützter Umsetzung.

40+ Anwendungen & Tools
14 Vorgestellte Projekte
5+ Technologie-Stacks

Die inhaltliche Konzeption, fachliche Steuerung und Qualitätssicherung lagen durchgehend bei mir. Die KI übernahm die technische Codierung auf Basis meiner Vorgaben und meines Feedbacks.

Kernkompetenzen

Was mich zum KI-Partner macht

Mehr als Prompts schreiben: Ich bringe fachliche Tiefe, Architekturdenken und Qualitätsbewusstsein in die Zusammenarbeit mit KI.

🏗

Konzeption & Architektur

Fachliche Anforderungen in skalierbare, wartbare Software-Strukturen übersetzen – von Einzelanwendungen bis zu vernetzten Suites.

⚖️

KI-Regulierung & Compliance

Tiefe Auseinandersetzung mit dem EU AI Act, DSGVO-konformen KI-Workflows und Governance-Strukturen für Unternehmen.

🔄

Iterative Entwicklung

Produkte über mehrere Versionen hinweg weiterentwickeln – mit automatischer Datenmigration, Refactoring und durchdachtem Versionierungskonzept.

🛡

Datenschutz by Design

Privacy-Entscheidungen als Designprinzip: lokale Verarbeitung, Self-Hosting, Anonymisierung vor der KI-Übergabe, eigene Backend-Dienste.

Ausgewählte Arbeiten

14 Projekte. Ein Muster.

Von KI-nativen Anwendungen über Agile-Suites bis zu Infrastruktur-Tools – entstanden im Dialog zwischen menschlicher Konzeption und KI-Umsetzung.

KI-native HTML · JS · Multi-API

Extraktor – KI-Dokumentenanalyse

Wenn KI lesen lernt: Ein Tool, das Dokumente versteht

Browser-Tool zur KI-gestützten Analyse hochgeladener Dokumente. Unterstützt Claude, GPT, Gemini und Mistral – direkt im Browser, ohne Backend-Mittelsmann. Multi-Provider-Architektur ermöglicht den direkten Modellvergleich an derselben Aufgabe.

Was es zeigt

Hands-on-Erfahrung mit mehreren KI-APIs und deren Stärken. Die Fähigkeit, einen Multi-Provider-Ansatz zu konzipieren, der Vendor-Lock-in vermeidet – ein zentrales Thema für KI-Strategie in Unternehmen.

Idee

Unstrukturierte Dokumente enthalten wertvolle Informationen, die manuell mühsam zu extrahieren sind. Extraktor macht diese Inhalte durch gezielte KI-Analyse zugänglich – anbieterunabhängig und ohne Daten an einen Mittelsmann zu senden.

Umsetzung

Inhaltliche Konzeption – Auswahl der KI-Anbieter, Definition der Analyse-Workflows, UX-Design – von mir. Technische Umsetzung iterativ mit KI-Unterstützung als Single-File HTML/JavaScript-Anwendung mit direkten API-Aufrufen. Kein Backend, kein Build-Prozess.

KI-Regulierung HTML · CSS · JS

EU AI Act Dashboard

Regulierung greifbar machen

Interaktives Dashboard zu Risikokategorien, Compliance-Anforderungen und Zeitplänen des EU AI Act. Bewusst ohne Framework – Inhalte im Vordergrund. Ergänzt durch einen praktischen KI-Compliance-Guide.

Was es zeigt

Tiefe Auseinandersetzung mit KI-Regulierung. Die Fähigkeit, komplexe juristische Inhalte für Entscheidungsträger nutzbar zu machen – Kernkompetenz für KI-Beauftragte.

Idee

Der EU AI Act ist komplex und für viele Unternehmen schwer greifbar. Statt eines weiteren PDF entstand ein interaktives Dashboard, das regulatorisches Wissen zugänglich und durchsuchbar macht.

Umsetzung

Strukturierung des Rechtstextes, Priorisierung der Kernaussagen und didaktischer Aufbau von mir. Technische Umsetzung als Standalone-HTML-Dateien mit interaktiven Elementen KI-gestützt. Mehrere Iterationen dokumentieren die Weiterentwicklung.

Lerntool HTML · JS · PHP

KI-Beauftragter Quiz

Prüfungswissen aktiv trainieren

Quiz-Anwendung zur Vorbereitung auf die DEKRA-Zertifizierung als KI-Beauftragter. Multiple-Choice, Lernkartenmodus, Lesezeichen, Suchfunktion und serverbasiertes Fortschritts-Tracking. Architektur wurde für Scrum- und PAL-Quizze wiederverwendet.

Was es zeigt

Systematische Herangehensweise an Wissenserwerb im KI-Bereich. Die Fähigkeit, Lernwerkzeuge zu konzipieren, die über bloßes Nachschlagen hinausgehen.

Umsetzung

Fragen, deren fachliche Korrektheit und die didaktische Struktur von mir. Frontend als Single-File-Anwendung und PHP-Backend für Datenpersistenz im iterativen Dialog entwickelt. Gleiches Architekturprinzip für zwei weitere Zertifizierungs-Quizze (Scrum, PAL) wiederverwendet.

Datenschutz HTML · Tailwind · JS

Text-Anonymisierung

Sensible Daten erkennen, bevor sie das Haus verlassen

Browser-Tool zur interaktiven Anonymisierung von Texten: visuelles Hervorheben, kategoriebasierte Klassifizierung (Namen, Orte, Organisationen, Assets) und Live-Vorschau des anonymisierten Textes. Version 4 (Alpha).

Was es zeigt

Datenschutz als integralen Bestandteil von KI-Workflows. Das Verständnis, dass KI-Einsatz in Unternehmen erst mit Anonymisierung und Datenklassifizierung verantwortungsvoll wird.

Umsetzung

Konzept – Kategorien, Workflow, UX mit contenteditable-Editor und Popup-Kategorisierung – von mir. Umsetzung als Tailwind-CSS-basierte Single-File-Anwendung iterativ mit KI-Unterstützung. Aktuell Version 4 (Alpha).

Agile Suite HTML · JS (vanilla) · PHP-Sync

Scrumban – Agile Projektmanagement-Suite

Sieben Apps, ein Workflow: Agiles Projektmanagement im Browser

Vollständige Suite aus sieben vernetzten Einzelanwendungen: Product Backlog, Sprint Planning, Sprint Backlog, Kanban-Board, Sprint Review, Sprint Retro und Release Notes. Datenaustausch über localStorage, optionale PHP-Team-Synchronisation. Zusätzliche Variante (Scrumban-Spree) für ein Agile-Transformation-Beratungsszenario.

Was es zeigt

Tiefes Verständnis agiler Prozesse, umgesetzt in funktionsfähige Software. Die Entscheidung für vernetzte Einzelanwendungen statt Monolith zeigt konzeptionelle Reife und Architekturdenken.

Architekturentscheidung

Die Prozessarchitektur – welche Daten wo entstehen, wie sie zwischen den Phasen fließen, welche Ansichten welchen Zweck erfüllen – von mir. Sieben HTML-Anwendungen KI-gestützt als Vanilla JavaScript ohne Framework entwickelt.

PM-Tool React 18 · Tailwind · CDN

Projekt-Dashboard

Projekte steuern auf einen Blick

React-basiertes Projektmanagement-Dashboard mit integriertem Notizen-System. Status, Fortschritt und kontextbezogene Notizen in einer Anwendung – kein Tool-Wechsel. Single-File HTML, kein Build-Prozess.

Was es zeigt

Pragmatismus bei der Technologiewahl: moderne Frameworks nutzen, ohne unnötige Komplexität einzuführen. React 18 und Tailwind via CDN – leistungsfähig ohne Toolchain-Overhead.

Infrastruktur PHP · Apache · .htaccess

SecuritySuite

Webseiten absichern ohne Informatikstudium

PHP-basiertes Zugangsschutzsystem mit Admin-Dashboard. Drei Versionen: Standard, Single-File Light und v4 mit bcrypt-Hashing und integriertem Dateibrowser. Automatische Apache-.htaccess-Generierung.

Was es zeigt

Sicherheitsbewusstsein und iterative Verbesserung über mehrere Versionen – von Klartext-Passwörtern über bcrypt bis zur Single-File-Architektur. Dasselbe Muster gilt für KI-Governance-Rollouts.

Plattform PHP · Bootstrap · JS

Textkonfetti

Zehn Tools, ein Portal

Konfigurierbares Web-Portal für Text-Tools mit Admin-Panel: Wortzähler, Diff-Checker, JSON-Formatter, Regex-Tester und mehr. Zweisprachig (DE/EN), Drag-and-Drop-Sortierung, passwortgeschützte Verwaltung.

Was es zeigt

Plattformdenken: nicht nur einzelne Lösungen bauen, sondern eine skalierbare Struktur schaffen, in die weitere Tools integriert werden können. Genau dieses Denken braucht es beim Aufbau von KI-Tool-Landschaften.

Persönliches Tool HTML · JS · ~4200 Zeilen

PlansteDenksteFühlste

Das eigene Denken sortieren

Umfangreiche Single-File-Anwendung mit fünf Perspektiven auf persönliche Themen: Überblick, Reflexion, Horizont, Stellschrauben und unveränderlicher Gedanken-Stream. Automatische Datenmigration über sechs Versionen.

Was es zeigt

Die Fähigkeit, ein komplexes Datenmodell mit Migration über sechs Versionen zu konzipieren. Produktdenken – kein Prototyp, sondern ein über Monate gewachsenes Tool mit echtem Nutzwert.

Besonderheit

Automatische Datenmigration von Version 1 bis 6: Daten aus alten Versionen werden beim ersten Start automatisch in das neue Schema überführt. Alles lokal im Browser via localStorage. Optional mit Team-Sync-Modus.

Typografie-Tool HTML · JS · Single-File

Cnvrtr

Von »Gänsefüßchen« zu echten Anführungszeichen

Mehrsprachiger Typografie-Konverter für Deutsch, Englisch, Französisch und Schweizerdeutsch. Ersetzt gerade Anführungszeichen, Bindestriche und Auslassungszeichen durch typografisch korrekte Varianten. Mit Diff-Ansicht und Export.

Was es zeigt

Detailgenauigkeit bei Inhalten: sprachliches Fachwissen trifft technische Umsetzung – direkt einsetzbar bei der Qualitätssicherung von KI-generierten Texten.

Lerntool HTML · CSS · JS

Einmaleins-Trainer

Mathe üben mit Spaß

Interaktiver Multiplikationstrainer für Kinder: farbenfrohe Oberfläche, sofortiges Feedback, Fortschritts-Tracking. Browserbasiert, keine Installation, keine Anmeldung. Entstand auf Anfrage für die eigene Familie.

Was es zeigt

Die Fähigkeit, Zielgruppen zu verstehen und passende Lösungen zu konzipieren. Auch ein KI-Manager muss komplexe Themen zielgruppengerecht aufbereiten können – ob für Kinder oder ein Führungsteam.

Generator HTML · JS · marked.js

ResumeGEN

Den eigenen Lebenslauf in Markdown schreiben

Browser-basierter Lebenslauf-Generator mit erweiterter Markdown-Syntax. Unterstützt Zwei-Spalten-Layouts, Kopf-/Fußzeilen, farbige Boxen und Seitenumbrüche. PDF-Export via Browser-Druck. Alle Daten bleiben lokal.

Was es zeigt

Pragmatische Problemlösung: Ein reales Bedürfnis in ein wiederverwendbares Tool überführt. Die Datenschutz-Entscheidung – alles lokal – zeigt Bewusstsein für den verantwortungsvollen Umgang mit persönlichen Daten.

Backend-Dienst PHP · PHPMailer · Apache

FormSubmitter

HTML-Formulare ohne Drittanbieter

Selbst gehosteter Backend-Dienst als DSGVO-konformer Ersatz für externe Formulardienste. Honeypot-Spam-Schutz, Rate-Limiting, Domain-Whitelist. Unterstützt klassische Form-Übermittlungen und JSON-Payloads.

Was es zeigt

Verständnis für Backend-Infrastruktur und Datensouveränität. Datenschutz als Designprinzip statt als Hindernis – ein Muster, das bei der KI-Einführung in Unternehmen direkt übertragbar ist.

Kommunikation HTML · CSS · System-Fonts

Vibecoding-Tutorial

Komplexes verständlich machen

Illustrierte Schritt-für-Schritt-Anleitung zu FTP für Einsteiger: drei Schritte, klare Typografie, Dark-Mode-Support. Entstand als Demonstrationsprojekt für KI-gestützte Web-Content-Erstellung.

Was es zeigt

Erklär- und Vermittlungskompetenz: Komplexe technische Sachverhalte zielgruppengerecht aufbereiten – zentral für einen KI-Manager, der KI-Themen vom Vorstand bis zum Entwicklerteam kommunizieren muss.

Arbeitsweise

Wie Mensch und KI zusammenwirken

Jedes dieser Projekte folgt demselben Prinzip: Ich bringe das Fach, die KI bringt den Code.

Schritt 1

Fachliche Konzeption

Anforderungen analysieren, Architektur entwerfen, Inhalte strukturieren. Was soll das Tool tun? Für wen? Mit welchen Daten? Diese Fragen beantworte ich – nicht die KI.

Schritt 2

Iterativer Dialog

Die KI codiert auf Basis meiner Vorgaben. Ich reviewe, korrigiere, verfeinere. Runde für Runde nähern wir uns dem Ziel – präzise, gezielt, ohne Umwege.

Schritt 3

Qualitätssicherung

Technische Korrektheit, UX-Qualität, Datenschutz-Konformität, Mobile-Tauglichkeit – die Verantwortung für das Endergebnis liegt durchgehend bei mir.

KI ist das leistungsfähigste Werkzeug, das ich je in der Hand hatte. Aber ein Werkzeug braucht jemanden, der weiß, was er damit bauen will.