Design
Die Kategorie Design deckt die visuelle Seite ab: Logos und Markenidentität, Typografie, Farbsysteme und Figma-Workflows. Design aus der Perspektive von jemandem zu betrachten, der auch den Code schreibt, ergibt einen eigenen Blickwinkel — ein Logo muss nicht nur schön sein, es muss auch als 16-Pixel-Favicon lesbar bleiben und im einfarbigen Druck bestehen. Die Beiträge hier befassen sich mit genau diesen praktischen Zwängen: wie man eine Markenpalette aufbaut, die zugängliche Kontrastverhältnisse einhält, woran sich eine typografische Skala wirklich orientieren sollte und welche fehlende Information die Arbeit verdoppelt, wenn ein Entwurf an die Entwicklung übergeben wird. Ich versuche, die Begründung hinter ästhetischen Entscheidungen ebenso zu erklären wie die Entscheidungen selbst.
UI/UX Unterschied: klare Erklärung für Designer
Was ist der UI/UX Unterschied genau? Wir erklären die Grenzen, Aufgaben und das Zusammenspiel beider Disziplinen klar.
HEX, RGB, CMYK: konsistente Markenfarben
Verstehe HEX, RGB und CMYK, den Unterschied zwischen Bildschirm und Druck und halte deine Markenfarbe überall gleich.
Grid-System im Design: Spalten und Baseline
Lerne Grid-System-Design über Spalten, Stege und Baseline-Grid für saubere, ausgewogene Kompositionen.
Illustrator-Logo erstellen: Zeichenstift- und Pathfinder-Guide
Die Grundlagen eines Illustrator-Logos: saubere Pfade mit dem Zeichenstift, Formen kombinieren mit Pathfinder und skalierbare Vektoren.
Vektor- vs. Rastergrafik: Wann Welches Format
Ist der Vektor- vs. Raster-Unterschied klar, fällt die Formatwahl leicht: vom Logo bis zum Foto, wo welcher Typ funktioniert und warum.
Logo-Designfehler: 10 Patzer, Die Amateure Verraten
Die häufigsten Logo-Designfehler und wie Sie jeden vermeiden: Typografie, Farbe, Skalierbarkeit und mehr.
Visuelle Hierarchie: Aufmerksamkeit gezielt lenken
Was ist visuelle Hierarchie und wie baut man sie auf? Praktische Regeln mit Größe, Kontrast, Position und Weißraum.
UI White Space: Lesbarkeit und Hierarchie durch Leerraum
Wie stärkt UI White Space mit bewusstem Leerraum Lesbarkeit und visuelle Hierarchie? Ein praktischer Leitfaden mit Beispielen.
Figma Component und Variant: wiederverwendbare UI
Lerne Schritt für Schritt, eine wiederverwendbare UI-Bibliothek mit Zustandsvarianten über Figma Component und Variant aufzubauen.
Figma Auto Layout für flexibles, responsives Design
Lerne Figma Auto Layout Schritt für Schritt: responsive Komponenten, Padding, Gap und Resizing, mit echtem Button- und Karten-Beispiel.
Figma verwenden: Dein erstes Design
Wie verwendet man Figma? Lerne Schritt für Schritt, dein erstes Design mit Oberfläche, Frames und Werkzeugen zu erstellen.
Farbpalette erstellen: Balance mit der 60-30-10-Regel
Mit der Farbpalette erstellen ein ausgewogenes Design dank 60-30-10-Regel, passenden Tools und barrierefreiem Kontrast.
Logo-Arten: Wortmarke, Icon und Kombination
Welche Logo-Arten gibt es? Ich erkläre Wortmarke, Lettermark, Icon und Kombination mit Beispielen und wann man sie nutzt.
Schriftpaarung: Typografie-Grundlagen und Balance
Die Regeln der Schriftpaarung: Serif/Sans-Kombinationen, Kontrast, Hierarchie und Lesbarkeit für starke Typografie.
Markenidentität aufbauen: ein praktischer Leitfaden
Markenidentität aufbauen: Logo, Farbpalette, Typografie und Tonalität in einem konsistenten System vereinen.
Leitfaden zur Farbpsychologie im Logodesign
Wie prägt Farbpsychologie die Markenwahrnehmung im Logo? Ein ausgewogener Leitfaden zu Farbe-Emotion, Branche, Kontrast, Barrierefreiheit und Kultur.
Professionelles Logo-Design: 7 Schritte von der Idee zur Marke
Briefing, Recherche, Skizze, Vektor und Varianten: der 7-Schritte-Prozess, der ein einprägsames, skalierbares Logo von der Idee zur Lieferung führt.