Inspiration
Smarte Buttons, coole Animationen und Styles, die du dir direkt für dein Projekt klauen kannst.
1 Grundlagen des guten Geschmacks
Warum KI-Design schablonenhaft aussieht und wie du das behebst
Warum KI-generierte Websites alle gleich und billig aussehen: Default-Verlauf, gesichtslose Schrift, zentrierter Text, Emojis. Und 4 Geschmacksprinzipien, die das beheben.
Farbe und Kontrast im Interface: Palette und Dark Mode
Eine Interface-Palette ohne Schmerzen: ein bis zwei Akzente plus Neutraltöne, Textkontrast 4,5 zu 1, und warum Dark Mode ein warmes Grau ist und kein schwarzer Hintergrund.
Schriftpaare und Raster: Typografie für Einsteiger
Wie du eine Schrift auswählst, ein funktionierendes Schriftpaar zusammenstellst, eine Größentreppe und eine Überschriften-Hierarchie aufbaust und alles auf ein Raster mit einheitlichem Abstands-Schritt setzt. Ganz einfach erklärt, für Einsteiger.
2 Details, die den Unterschied machen
Schöne Buttons und der Glas-Effekt: So baust du ein Interface, das teuer aussieht
Wie du einen schönen Button und den Liquid-Glass-Effekt baust: Form, weicher Schatten, Kontur, Hover- und Active-Zustände, Hintergrund-Blur. Plus fertige Briefings für die KI.
Mikroanimationen und Übergänge im Interface: Timing, Easing, Amplitude
Mikroanimationen und Übergänge im UI: Wie Timing, Geschmeidigkeit (Easing) und Amplitude ein Interface lebendig machen. Wir nehmen Feedback, das Erscheinen von Elementen und Barrierefreiheit auseinander.
Lebendige Hintergründe und Verläufe: So bringst du deinen Seitenhintergrund zum Atmen
Lebendige Hintergründe und Verläufe für deine Website: radiales Leuchten, Mesh-Verlauf, langsame Bewegung und Korn. So belebst du den Hintergrund, ohne es mit Effekten zu übertreiben.