Lizenzen
Welche Lizenz passt zu dir?
Gilt für alle Lizenzen: Du kaufst Nutzungsrechte, nicht das Eigentum. Rohdateien nicht weiterverkaufen, öffentlich teilen oder als eigenes Produkt anbieten · keine Nutzung als Trainingsmaterial für KI-Modelle.
Vereinfachte Übersicht — rechtlich verbindlich sind die vollständigen Lizenzbedingungen, die im Checkout akzeptiert werden. Vollständige Lizenzbedingungen
UI — User Interface Design
UI die du in zehn Sekunden bedienst — und in zehn Jahren nicht hasst.
Was die Leistung umfasst
Was UI Design für dein Produkt leistet
UI ist die Oberfläche, an der Nutzer das Produkt tatsächlich anfassen. Sie entscheidet in den ersten Sekunden über Vertrauen — und im täglichen Gebrauch über Effizienz. Schlechte UI ist nicht „hässlich", schlechte UI ist „ich finde den Knopf nicht". Gute UI muss heute drei Dinge gleichzeitig leisten: in 10 Sekunden bedienbar sein (für Neunutzer), in 10 Wochen ohne Aha-Verluste arbeitbar (für Bestandsnutzer) und in 10 Jahren nicht aussehen wie aus der Zeit gefallen.
Ich gestalte Interfaces mit klarer visueller Hierarchie, konsequenter Komponentenlogik und einem Designsystem, das mit dem Produkt wächst. Konkret: Designsystem (Komponenten-Bibliothek mit States, Varianten, Tokens), visuelle Sprache (Typografie, Farbe, Spacing, Schatten, Bewegung), Interaktions-Muster (Hover, Focus, Loading, Error, Empty States) und konkrete Screen-Designs für die wichtigsten Use Cases. Vom Style-Guide bis zur Pixel-Ready-Übergabe an Entwicklung.
Dein Produkt sieht aus wie ein durchdachtes Werkzeug, nicht wie zusammengewürfelte Screens. Nutzer finden sich in zehn Sekunden zurecht. Bestandsnutzer mögen es auch nach zehn Monaten. Und du kannst neue Features ergänzen, ohne dass die UI auseinanderfällt — weil das Designsystem die Erweiterung trägt.
So gehe ich an UI Design
- Designsystem-Grundlagen
Typo-System, Farbsystem, Spacing-System, Komponentenarchitektur — auf Markenstrategie und UX-Vorgaben aufgesetzt. Tokens statt Hardcoded-Werte, sodass Anpassungen einfach bleiben.
- Komponenten-Bibliothek
Die zwölf bis zwanzig häufigsten UI-Komponenten produzieren (Buttons, Inputs, Cards, Navigation, Modals, etc.) — pro Komponente alle Zustände (Default, Hover, Focus, Disabled, Error). Anwendungsregeln dokumentiert.
- Screen-Designs
Die wichtigsten Bildschirme im Detail entwerfen — mit echtem Content, nicht „Lorem ipsum". Edge Cases mitgedacht (lange Texte, leere Listen, Fehler-Zustände). Responsive-Verhalten definiert.
- Übergabe & Dev-Begleitung
Designs in Figma sauber strukturiert, Komponenten mit Variablen verbunden, Übergabe-Doku für Entwicklung. Optional: Sprint-Begleitung, sodass die Design-Implementation nicht im Code abdriftet.
Häufig gestellte Fragen
Webdesign ist meistens marketing-orientiert: ein Auftritt, der Aufmerksamkeit erzeugt und Conversion bringt. UI ist produkt-orientiert: eine Oberfläche, die im täglichen Gebrauch funktioniert. Webdesign wird einmal angeschaut, UI wird täglich bedient. Das verändert die Anforderung deutlich — UI muss in zehn Sekunden klar UND in zehn Wochen effizient sein.
Wenn das System bewährt ist und Komponenten sauber dokumentiert sind, reicht oft Erweiterung statt Neubau. Wenn das System aber nur eine Komponenten-Sammlung ohne klare Tokens ist, oder wenn jede neue Feature-Page neu interpretiert wird, fehlt eine UI-Sprache mit Regeln. Im Audit klären wir, was tragfähig ist und was nicht — bevor neu produziert wird.
Mit klarer Komponenten-Bibliothek in Figma, Variablen für Tokens, allen relevanten Zuständen (Hover, Focus, Loading, Error, Empty) und Edge-Cases dokumentiert. Plus Übergabe-Workshop, wo Designer und Entwicklung gemeinsam die Komponenten durchgehen. Optional: Sprint-Begleitung in den ersten Wochen, damit Design-Implementation nicht im Code abdriftet.
Idealerweise ein verantwortlicher Designer oder Frontend-Entwickler in eurem Team. Bei kleineren Teams oft die gleiche Person, die UX/UI macht. Das System muss nicht ständig aktualisiert werden, aber Änderungen müssen koordiniert ablaufen — sonst entstehen Forks und das System fällt auseinander. Klare Verantwortung statt großer Frequenz.
Webdesign & Development
Was im Feld „Webdesign & Development“ noch dazugehört.
Lass uns reden.
Strategiegespräch direkt im Kalender — such dir einen Termin aus.