Von WordPress zum Liquid Glass Redesign — in einem Tag.
Im April 2026 wurde die Website leadnet.de komplett neu entwickelt — nicht von einem Team, sondern im Dialog zwischen Frank Bormann (Entwickler und Lösung für alles) und Kiro (Hero für fast alles), einer KI-gestützten IDE von Amazon. Kiro kombiniert einen Code-Editor mit einem KI-Assistenten, der Code schreibt, Dateien erstellt, Git-Commits macht und direkt auf AWS-Services zugreift.
Die Aufgabe: Eine bestehende WordPress-Seite durch eine schnelle, sichere, zweisprachige statische Website ersetzen — mit Blog-System, WYSIWYG-Editor, AWS Translate, Text-to-Speech und einem modernen Liquid Glass Design. Alles ohne externe Frameworks, ohne Lizenzen, 100% eigener Code.
Frank Bormann setzt sich derzeit intensiv mit Kiro auseinander — unter anderem für eine spezielle Schulung, in der Kunden lernen, KI-gestützte Entwicklungstools effektiv in ihren Projekten einzusetzen. Dabei sind bereits mehrere kleine Projekte entstanden: ein serverloser URL-Shortener, eine Quiz-Plattform und diese Website.
Im Mai 1999 ging leadnet.de erstmals online. Frank Bormann startete mit Hosting- und IT-Dienstleistungen — in einer Zeit, als das Internet in Deutschland gerade erst Fahrt aufnahm. Die erste Website ist leider nicht mehr erhalten, aber der Grundstein für über 25 Jahre IT-Kompetenz war gelegt.
🌐
Kein Screenshot verfügbar
Die erste Website von 1999 ist nicht mehr erhalten.
leadnet.de — Mai 1999 (nicht mehr verfügbar)
Leadnet war bereits etabliert — Hosting und IT-Dienstleistungen standen im Fokus, lange bevor Cloud-Computing ein Thema wurde. Die Website spiegelte den Zeitgeist wider: funktional, informativ, ohne Schnörkel.
leadnet.de — 2003
Die Seite wurde überarbeitet und an die wachsenden Anforderungen angepasst. Das Angebot erweiterte sich in Richtung Cloud-Beratung. Ein zeitgemäßeres Design, aber noch auf klassischer Basis.
leadnet.de — April 2016
Der Umstieg auf WordPress brachte ein moderneres Design und einfachere Content-Verwaltung. Aber auch die typischen WordPress-Probleme: langsame Ladezeiten, Sicherheits-Updates, Plugin-Abhängigkeiten und unnötiger Overhead für eine im Kern statische Unternehmensseite.
Problem Performance, Sicherheit, Wartungsaufwand
WordPress-Version — Dezember 2023
Feature Migration von WordPress zu statischem HTML
6 Seiten, sauberes semantisches HTML5, lokale Fonts, Kontaktformular mit CSRF-Schutz, Honeypot, Mathe-Captcha und Rate-Limiting. Kein WordPress, kein jQuery, kein Framework.
Version 1 — Erster HTML-Prototyp
Design Logo, Header-Bilder, Footer-Hintergrund
Die Seite bekommt ihr Branding: Leadnet-Logo im Header, seitenspezifische Hero-Banner mit Hintergrundbildern und Text-Overlay, Footer mit Hintergrundbild.
Version 2 — Logo und Hero-Banner
Feature 10 englische Seiten, Sprachumschalter, hreflang
Die Website wird zweisprachig. 10 neue englische Seiten unter /en/, DE/EN-Umschalter im Header, hreflang-Tags für Google, sprachbewusstes Kontaktformular und JavaScript.
Fix SEO: og:url Mismatch, meta keywords entfernt, JSON-LD Schema mit areaServed
Version 5 — Zweisprachig mit Sprachumschalter
Design Erster Entwurf mit modernem Glass-Effekt
Glassmorphism-Header mit backdrop-filter: blur(), halbtransparente Cards, weichere Schatten, CSS Custom Properties. Der Body-Hintergrund wechselt zu hellem Grau-Blau.
Feedback: „Die Veränderung ist mir zu schwach." → Führte direkt zu Version 8.
Version 7 — Light Glassmorphism (zu dezent)
Design Aggressiver Glassmorphism auf dunklem Hintergrund
Komplett dunkles Farbschema für maximalen Glass-Kontrast. Animierter Gradient-Border-Glow auf dem Hero-Overlay, pulsierende Licht-Orbs im CTA-Banner, innerer Radial-Glow auf Cards bei Hover, Icons mit Drop-Shadow-Glow.
Version 8 — Dark Liquid Glass
Feature Nutzer wählen selbst: Hell oder Dunkel
Sonne/Mond-Toggle im Header auf allen 25 Seiten. System-Preference als Default, Nutzerwahl in localStorage gespeichert. Zwei komplett durchgestaltete Themes.
Security HSTS, Content-Security-Policy, Permissions-Policy Header
Fix „IT-Kompetenz seit 1999" war im Light Mode kaum lesbar → Hero-Overlay kontrastreicher, Subtitle-Klasse vereinheitlicht
Version 9 — Dark Mode
Version 9 — Light Mode
Feature Vorlese-Button mit AWS Polly Neural
14 Inhaltsseiten bekommen einen „Vorlesen"-Button. Deutsche Stimme (Vicki) und englische Stimme (Joanna). MP3s werden per Content-Hash gecacht — ändert sich der Text, wird automatisch neu generiert.
Accessibility prefers-reduced-motion deaktiviert alle Animationen. prefers-contrast ersetzt Glass-Effekte durch solide Hintergründe. Focus-Visible auf allen interaktiven Elementen.
Security API Rate-Limiting, XSS-Schutz (HTML Sanitizing), Referer-Check, Page-Whitelist, exec() entfernt
Version 10 — Vorlese-Button + Accessibility
Neben leadnet.de sind im Rahmen der Kiro-Evaluierung weitere Projekte entstanden — alle serverlos, alle auf AWS, alle im Dialog mit der KI entwickelt.
Ein serverloser URL-Shortener mit QR-Code-Generierung, Custom Short-IDs und automatischer Ablaufzeit (7 Tage TTL). Das Projekt war der Startpunkt der Kiro-Evaluierung — komplett mit Infrastructure as Code (OpenTofu), Custom Domain und Rate-Limiting. Kosten: ca. 1 USD/Monat.
Eine Echtzeit-Quiz-Plattform für Schulungen und Workshops. Teilnehmer treten per QR-Code bei, Antworten werden in Echtzeit über AWS IoT Core (MQTT) synchronisiert. Admin-Portal mit Rollen (SuperAdmin/Admin), Fragen-Pool mit Tags, CSV-Import/Export, konfigurierbaren Timern und Live-Leaderboard.
Zweisprachige statische Website mit Blog-System, eigenem WYSIWYG-Editor, AWS Translate für automatische DE↔EN Übersetzung, AWS Polly Neural für Text-to-Speech, Liquid Glass Design mit Light/Dark Toggle. Komplett ohne Frameworks.
leadnet.de →Obwohl diese Projekte auf AWS aufgebaut sind, ist Kiro eine universelle IDE — sie funktioniert genauso effektiv mit Google Cloud Platform (GCP), Microsoft Azure, oder jeder anderen Infrastruktur. Kiro schreibt Code, nicht Cloud-spezifische Konfigurationen. Terraform für GCP, Azure CLI Befehle, Kubernetes Manifeste — alles ist möglich. Die KI passt sich dem Projekt an, nicht umgekehrt.