Portfolio & Projekte
Scrollt nach unten für einige meine Apps, Games, Webdesign-Experimente und CodePen-Spielereien.
ROTA Consulting
Corporate Website für ROTA Consulting, eine Beratung für Digitalisierung und KI. Das Design wurde von Grund auf entwickelt, kein Template, kein KI-generierter Einheitsbrei. Es ist eigenständig, lebendig und passt zur Marke. Der Hero arbeitet mit einem Videohintergrund, der beim Scrollen langsamer wird, und einer Headline, die Zeile für Zeile einblendet. Dahinter steckt ein vollständiges Karriereportal, selbst gehostet, ohne externe Plattform. Das Ergebnis ist ein Markenauftritt, der ROTA Consulting sofort als kompetenten Digitalisierungs- und KI-Partner positioniert, mit einem selbst gehosteten Karriereportal, das Bewerbungen direkt und ohne Umweg über externe Plattformen einsammelt.
Weitere Projekte
DERPart Unternehmernetzwerk
Enterprise WordPress-Lösung für das DERPart Unternehmernetzwerk, entwickelt mit einem eigenen Design-System-Framework. Die Website präsentiert ein genossenschaftliches Franchise-Modell für unabhängige Reisebüros und verzichtet komplett auf WordPress-Plugins und Page-Builder. Stattdessen setzt sie auf ein maßgeschneidertes Tailwind CSS Framework, das für maximale Performance und Sicherheit optimiert wurde. Die Entwicklung erfolgte mit DDev in einer lokalen Docker-Umgebung. Features umfassen ein integriertes Cal.com Terminbuchungssystem, AJAX-basierte Formularverarbeitung und eine responsive Video-Hero-Sektion mit intelligenter Preload-Strategie. Der komplette Verzicht auf WordPress-Plugins und Page-Builder bedeutet für DERPart spürbar schnellere Ladezeiten, deutlich weniger Angriffsfläche für Sicherheitslücken und einen geringeren Wartungsaufwand im laufenden Betrieb, ganz ohne die typischen WordPress-Kompromisse.
The Moon Records
The Moon Records ist mein eigenes Ambient-Label, und ein Referenzprojekt. Kein Template, kein Page-Builder. Sondern von Grund auf neu entwickelt: eine eigenständige Datenschicht, ein CSS-Token-Design-System, ein selbst gehostetes PocketBase-Backend, Admin-Dashboard, Newsletter mit Double Opt-in, personalisiertes Promo-System mit Download-Tracking und eine vollautomatische Deployment-Pipeline via GitHub Actions, ArgoCD und Kubernetes. Alles aus einem Guss.
Gartenkultur
Enterprise Angular-Lösung für die Schweizer Gartenbau-Manufaktur Gartenkultur AG. Die Website präsentiert professionelle Gartengestaltung mit über 60 Referenzprojekten und kombiniert modernes Frontend-Design mit einem hochperformanten Backend-System. Entwickelt mit Angular und TypeScript, basiert die technische Architektur auf einem eigenen Framework mit Redis als Datenbankschicht und einem Vue.js-basierten Dashboard für Content-Management. Die Seite integriert Google Maps für zwei Standorte, ein vollständiges Kontaktformular und eine umfangreiche Referenz-Galerie. Das Design nutzt Tailwind CSS mit einer minimalistisch-modernen Ästhetik und großformatigen Hero-Images.
Logic Moon
Logic Moon ist mein Projekt und ein Showcase für das, was beim Webdesign wirklich möglich ist, wenn man es richtig angeht. Kein Template, kein Baukastensystem. Sondern eine Website, die sich wie ein Kurzfilm anfühlt: cineastischer Videohintergrund, ein Glitch-Effekt auf dem Titel und Animationen, die Inhalte sanft ins Bild fließen lassen.
Rosenberg Ayurveda
Für Rosenberg Ayurveda wurde ein vom Kunden beauftragtes Figma-Design pixelgenau in einen vollständigen E-Commerce-Shop überführt. Jede Linie, jeder Abstand, jede Farbnuance aus dem Design wurde 1:1 in sauberem HTML5 und SCSS umgesetzt, kein Page-Builder, kein Kompromiss.
Kitz Concierge
Kitz Concierge wurde mit höchsten Ansprüchen an Design und Funktionalität in Figma entworfen und anschließend in HTML und Tailwind CSS umgesetzt und mit dem Sitegenerator Astro in seine Form gegossen. Die Anspruch war es, eine Webseite zu erstellen, die sowohl optisch als auch funktional auf höchstem Niveau ist und einen sehr hochwertigen Eindruck vermittelt, der Kunden aus dem Hochpreis-Umfang ansprechen soll. Dies ist mit Bravour gelungen. Als Hosting wurde Google Cloud verwendet.
6 von 18 Projekten
UI/UX und Microfrontends
Einige meiner UI/UX und Micro-Frontend Projekte mit Fokus auf der Umsetzung von Benutzererfahrung und modernes Design und Barrierefreiheit.
Hamburger Volksbank, Jahresrückblick 2025
Vollständige Landingpage für den Jahresrückblick 2025 der Hamburger Volksbank, entwickelt im Auftrag der Agentur MMM. Die Seite ist als Microfrontend in Vue.js und TypeScript umgesetzt und läuft im Atruvia Content Manager. Das Herzstück: durchgängig scrollbasierte Animationen, die Inhalte lebendig machen, kombiniert mit Vollbild-Slidern, kompakten Mini-Slidern und einem durchdachten Responsive-Verhalten über alle Breakpoints.
Hausbank München, imveon.de
Landingpage für die Hausbank München, umgesetzt als isolierte Vue Web Component im Atruvia Content Manager. Die Komponente läuft vollständig entkoppelt in einem Angular-Host-Umfeld und liefert eine moderne, markenkonforme Präsenz, responsive über alle Breakpoints und barrierefrei nach WCAG 2.1.
VB Lüneburg-Heide, Maßgeschneiderter Header
Individuelles Header-Microfrontend für die Volksbank Lüneburg-Heide, entwickelt im Auftrag der Agentur MMM. Der Baustein läuft als isolierte Web Component im Atruvia Content Manager und ersetzt den Standard-Header durch eine maßgeschneiderte Lösung mit drei Navigationsebenen, integrierter Suche mit Verlauf, Schnelleinstiegen und Echtzeit-Vorschlägen sowie vollständig responsivem Verhalten für Mobile, Tablet und Desktop, barrierefrei nach WCAG 2.1.
VB Mittlere Oberpfalz, Employer Branding Header
Header-Komponente für die Volksbank Mittlere Oberpfalz, entwickelt im Auftrag der Agentur MMM. Der komplexe Baustein läuft im Atruvia Content Manager, der zentralen Banking-Plattform für Volksbanken und Raiffeisenbanken, und ist in einem Angular-Umfeld mit Vue.js und Tailwind CSS umgesetzt. Der Fokus lag auf einer modernen Employer-Branding-Präsenz, die sich nahtlos in das strikt regulierte Ökosystem der Banken-IT integriert, mit vollständiger WCAG 2.1-konformer Barrierefreiheit.
Screeny -
Perfekte Mockups in Sekunden.
Ich enwickele gerade eine neue App und du kannst live dabei sein:
URL eingeben, generieren, fertig. Echte Screenshots oder KI-generierte Device-Mockups für Mobile, Tablet und Desktop. Direkt zum Download oder Uploaden auf Google-Drive.
Schau in der offenen Dev-Phase vorbei. Es wird später ein SaaS.
Noch in der Alpha-Phase, Feedback willkommen.
hi@tobeworks.de
Code Invaders
Weil ein Portfolio ohne Easter Egg keines ist: Ich habe ein kleines Space-Invaders-Klon direkt in die Seite eingebaut. Entwickelt in Vanilla JavaScript, vollständig im Browserl lauffähig. Kein Plugin, kein Framework.
Normalerweise versteckt hinter dem Konami-Code ↑ ↑ ↓ ↓ ← → ← → B A oder einfach hier:
Das Spiel ist nur in der Desktop-Version verfügbar. Auf einem Computer geht's los.
Nach dem Spiel kannst du deinen Score in der Hall of Fame eintragen, anonym, kein Account nötig.
Schaffst du es in die Topliste?
GitHub & Mini-Projekte
Bandcamp Cover Designer
Bandcamp-Artist eingeben, Cover-Collage in Sekunden generieren, 8 Layouts, Bento-Mode, PNG-Export 1080×1080. No account required.
Codebase-RAG
Code-Retrieval-Augmented-Generation System mit Chroma und Anything LLM für intelligente Codebase-Analyse. Ermöglicht semantische Code-Suche und KI-gestützte Dokumentation.
Freelancermap Match Crawler
Python-Crawler für Freelancermap zur automatischen Projekt-Analyse. Filtert und analysiert passende Freelance-Projekte.
llm-code-streamer
Python-Tool zum Sammeln von Code-Dateien in eine einzelne Textdatei, optimiert für die Nutzung mit Large Language Models (LLMs).
Hey, ich bin Tobias!
Seit über zwei Jahrzehnten verwandle ich Kaffee in Code, von meinem Hauptquartier in der Mainzer Altstadt aus. In der Zeit hat sich viel geändert, WordPress kam und ich bin fast wieder raus, jetzt kommt KI dazu, der Kern bleibt aber: Systeme, die schnell laden, gefunden werden und Besucher wirklich in Kunden verwandeln.
Was das heute alles umfasst, ist breiter geworden. Klassische Websites und Landingpages, klar. Aber auch mal KI-generierten Code auf Sicherheit und DSGVO checken, Barrierefreiheit nach WCAG 2.1 (Bankensektor lässt grüßen), und SEO, das inzwischen genauso für ChatGPT und Perplexity funktionieren muss wie für Google.
Aber genug von mir: Du willst mehr Anfragen über deine Website, einen KI-gebauten Prototypen absichern lassen, oder einfach wissen, wo du stehst? Sag Bescheid. Du redest dabei immer mit mir, nicht mit einem Account Manager, nicht mit einem Junior-Team.
Webdesign Experimente
Hier experimentiere ich mit verschiedenen Hero-Designs und modernen Webdesign-Konzepten.
