ki.pilot
← Alle Anleitungen
Anleitung · kostenlos

5 Design-Skills für Websites, die teuer aussehen

Three.js, Scroll-Animationen, Micro-Interactions — die Prompts für Claude Code.

  • 5 Design-Skills, die Websites teuer aussehen lassen
  • Fertige Prompts für Claude Code
  • Three.js, Scroll-Animationen, Micro-Interactions
Kostenlos, ohne Konto.
19. Juli 2026 · ki.pilot

Die 5 Sätze zum Abtippen

  1. 3D: „Füge eine dezente Three.js-3D-Szene in den Hero-Bereich ein, die auf Mausbewegung reagiert"
  2. Scroll: „Animiere die Sektionen mit GSAP ScrollTrigger: Elemente faden beim Scrollen ein, gestaffelt"
  3. Micro: „Füge Micro-Interactions hinzu: Hover-Effekte auf Buttons, sanfte Page-Transitions, Skeleton-Loading"
  4. Look: „Gestalte die Karten im Glassmorphism-Stil: Milchglas, feiner Rand, dezenter Glow auf dunklem Hintergrund"
  5. CSS: „Ergänze reine CSS-Animationen für Logo und Icons — ohne JavaScript, performance-schonend"

Lern-Reihenfolge

3 → 4 → 5 → 2 → 1 (von leicht nach anspruchsvoll). Micro-Interactions machen optisch sofort am meisten her.

Das war komplett kostenlos, und davon gibt es mehr.

Alle Anleitungen bleiben gratis: kein Konto, kein Haken. Wenn dir das geholfen hat, folge @ki.pilot auf TikTok & Instagram. Dort erscheint zu jeder neuen Anleitung der passende Post.

Newsletter

Neue Anleitungen ins Postfach.

Jede neue Anleitung bekommst du als Erster: kurz, verständlich, ohne Hype. Kein Spam, Abmeldung mit einem Klick.

Mit dem Eintragen stimmst du zu, dass wir dir per E-Mail Hinweise auf neue Anleitungen schicken (Double-Opt-in, Versand über Brevo). Abmeldung jederzeit mit einem Klick. Details in der Datenschutzerklärung.