Перейти к содержимому

DIESER Schritt verändert dein KI-Webdesign komplett

Tim Hildesheim

0:00 / 0:00

DIESER Schritt verändert dein KI-Webdesign komplett

4 887 просмотров · 16 часов назад
Tim Hildesheim
675 подписчиков
4 887 просмотров · 16 часов назад
Du willst lernen, wie du dir mit KI Skills & Online-Marketing ein ortsunabhängiges Freelancing Business aufbauen kannst? Dann sei bei unserem kostenlosen Live-Event am 29. & 30. September dabei: https://link.heyfreiheit.com/live-event1 Die Vorlage, die komplette Anleitung und alle Prompts aus dem Video bekommst du kostenlos in unserer Skool-Community: https://www.skool.com/heyfreiheit/about Deine KI-Webseiten sehen alle irgendwie gleich aus? Ich zeige dir, wie du mit einer eigenen Design Library konkrete Vorlagen für hochwertigere Webseiten sammelst und daraus direkt brauchbare Design-Briefings machst. Im Video baue ich meine Sammlung mit Website-Links und Screenshots aus. Die KI beschreibt den Stil und bereitet die Referenzen so auf, dass ich sie in Codex oder Claude Code für neue Projekte nutzen kann. An einem Restaurant-Beispiel zeige ich dir dann den Weg vom Design-Briefing zum ersten Website-Entwurf. Außerdem erfährst du, wie du zunächst mehrere Mockups als Bilder erstellen lässt, bevor du eine komplette Seite baust. Für eine fertige Kundenwebsite gehören anschließend echte Inhalte, passende Bilder und geprüfte Funktionen dazu. Der schnelle Entwurf im Video zeigt dir das Prinzip. Kapitel 00:00 Warum KI-Webseiten oft gleich aussehen 00:45 Meine persönliche Design Library 01:15 Gute Designreferenzen finden 03:25 Website hinzufügen und mit KI analysieren 04:53 Ganze Webseiten als Screenshot speichern 06:03 Designanalyse und Briefing kopieren 07:28 Eigene Design-DNA und unerwünschte Muster 08:45 Inspiration suchen und Screenshots importieren 11:28 Eigene Library mit der GitHub-Vorlage aufsetzen 12:57 Hosting mit Vercel 14:04 KI-Analyse, API-Key und Kosten 16:13 Praxisbeispiel: Restaurant-Website 18:03 Design-Briefing und Website-Prompt 20:19 Referenzbild direkt hochladen 20:55 Den neuen Website-Entwurf ansehen 21:58 Mehrere Mockups statt sofort alles programmieren 23:20 Als Freelancer damit arbeiten 24:39 Deine eigene Referenzsammlung aufbauen Inspiration aus dem Video Awwwards: https://www.awwwards.com/ Dribbble: https://dribbble.com/ Pinterest: https://www.pinterest.com/ Hilfreiche Tools FireShot für Website-Screenshots: https://getfireshot.com/ Vercel für das Hosting: https://vercel.com/ Wispr Flow zum Diktieren, Empfehlungslink: https://wisprflow.ai/r?FELIX1567 Die KI-Analyse per API verursacht separate Nutzungskosten. Prüfe beim Hosting den passenden Tarif für deinen Einsatzzweck. Die ursprüngliche Idee und Grundlage meiner Library stammen von Chase AI. Ich habe sie für meinen Workflow erweitert. Such dir eine Branche aus und sammle deine ersten passenden Referenzen. Die Anleitung dazu findest du in der Community. #KIWebdesign #Webdesign #Freelancing