Digitale Design-Projekte sind modular aufgebaut, häufig sogar auf Grundlage eines Design Systems. Doch die starke Trennung der Bereiche Design und Development stellt nach wie vor ein Problem dar. Unternehmen und Agenturen propagieren zwar einen interdisziplinären Design/Development-Workflow, entwickeln dann aber doch zunächst im Design statische UI-Komponenten, die anschließend von Frontend-Teams im Code nachgebaut werden.
Beitrag zu Ende lesen
Sketch ist als UX/UI-Design-Tool u.a. auch deshalb so populär, da Sketch-Dokumente sich leicht im Frontend weiterverarbeiten lassen. Eine dieser Möglichkeiten ist das Auslesen von JSON aus Sketch. Im Kern ist jede Sketch-Datei ein gezippter Ordner mit enthaltenen JSON-Dateien. Im Umkehrschluss können aus Code auch neue Sketch-Dokumente erzeugt werden, wie Airbnb mit react-sketchapp beeindruckend vorgemacht hat.
Beitrag zu Ende lesen
Die typografischen Möglichkeiten von Sketch scheinen auf den ersten Blick überschaubar zu sein. Zwar stimmt es, dass in Layoutprogrammen wie InDesign die typografischen Möglichkeiten deutlich umfangreicher sind, aber auch in Sketch gibt es zahlreiche versteckte Optionen um Schrift und Text zu optimieren.
Beitrag zu Ende lesen
Bilder und Grafiken gehören zu den Schwergewichten, wenn es um die Optimierung der Website-Ladezeiten geht. Im Verhältnis zu anderen Bereichen einer Seite kann mit Bild-Optimierung überdurchschnittlich viel Last eingespart werden. Es lohnt also i.d.R. hier Aufwand zu betreiben. Das Bild-Dateiformat WebP existiert bereits seit geraumer Zeit, und rückt nun dank deutlich verbessertem Browser-Support wieder in den Fokus. Wir zeigen wie und in welchen Programmen WebP-Grafiken exportiert werden können.
Beitrag zu Ende lesen
Die mächtige Funktion der Overrides in Sketch-Symbolen kann mit Text- und Layer Styles nochmals erweitert werden. Wenn ein Symbol einen Ebenenstil (Layer Style) beinhaltet, steht dieser in den Overrides zur Verfügung. Der Stil kann dort gegen einen anderen Stil getauscht werden. Komplexe Design-Systeme oder Icons in verschiedenen Farben sind somit kein Hindernis mehr.
Beitrag zu Ende lesen
Mit den Prototyping-Funktionen von Sketch ist es möglich Artboards scrollbar zu gestalten, Verlinkungen einzufügen und Objekte beim Scrollen im Vordergrund zu fixieren. Somit ist es möglich den User-Flow – die Bewegung des Benutzers durch die Website oder App – zu visualisieren und zu testen.
Beitrag zu Ende lesen
Die mächtige Funktion der Symbole mit Overrides kann durch verschachtelte Symbole perfektioniert werden. Sobald Symbole verschachtelt werden, stehen die untergeordneten Symbole in den Overrides zur Verfügung. Verschachtelte Symbole können getauscht oder deaktiviert werden. Somit sind hochkomplexe Design-Systeme mit zahlreichen Varianten in Symbolen kein Problem mehr.
Beitrag zu Ende lesen