Die Arbeit in XD beginnt für gewöhnlich in der Übersicht aller Dokumente. Hier ist es zwar möglich Ordner anzulegen um Dokumente zu strukturieren, die Miniaturansicht von XD ist in vielen Fällen allerdings suboptimal. Mit einem eigenen Cover könnt ihr die Übersicht ansehnlicher und benutzerfreundlicher gestalten.

Zeichenfläche als Cover definieren

Es gibt in XD zum Zeitpunkt der Veröffentlichung dieses Beitrags kein explizites Feature, dass das Cover steuert. Das Cover-Bild wird indirekt festgelegt, durch die Zeichenfläche, die sich am weitesten oben links im Dokument befindet.

Übersicht eines XD Dokuments mit einer hervorgehobenen Zeichenfläche oben links, die für als Cover des Dokuments vorgesehen ist.
XD Dokument mit Cover-Zeichenfläche ganz links oben

Flows berücksichtigen

Wenn im Dokument Flows enthalten sind, reicht es nicht mehr die Zeichenfläche einfach nur oben links zu platzieren. Es wird dann die Start-Zeichenfläche des Flows verwendet, der sich am weitesten oben links im Dokument befindet.

Wir wandeln daher immer die für das Cover vorgesehene Zeichenfläche in einem Flow um und platzieren sie oben links. Damit ist das Cover gut steuerbar.

Zwei Zeichenflächen, die links ist in einen Flow umgewandelt
In einen Flow umgewandelte Zeichenfläche

Endergebnis

Im Ergebnis hübscht ihr die Übersichten in XD deutlich auf und sorgt gleichzeitig für mehr Komfort bei der Benutzung. Wir verwenden i.d.R. das Logo eines Projekts als Cover. Bei mehreren Dokumenten pro Projekt, gestalten wir ein eigenes Cover mit Text – ähnlich den Covern von YouTube-Videos.

XD Dialog mit Dateiübersicht. Das Dokument hat ein Coverbild zugewiesen.
Zuletzt verwendete XD-Datei mit festgelegtem Cover-Bild

Geschrieben von Jonas

Benutzerbild

Jonas ist Gründer der Agentur kulturbanause und des kulturbanause Blogs. Er arbeitet an der Schnittstelle zwischen UX/UI Design, Frontend und Redaktion und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Jonas Hellwig ist regelmäßig als Sprecher auf Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Agenturen und Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Web-Projekten.

Jonas Hellwig bei Xing

Feedback & Ergänzungen – Schreibe einen Kommentar

Kommentar zu dieser Seite

Wir freuen uns über Anregungen, Ergänzungen oder Hinweise zu Fehlern. Wir lesen jeden Eintrag, veröffentlichen aber nur, was den Inhalt sinnvoll ergänzt.

Website-Projekte mit kulturbanause

Wir wissen wovon wir reden. Wir realisieren komplette Projekte oder unterstützen punktuell in den Bereichen Design, Development, Strategy und Content.

Übersicht Kompetenzen →

Schulungen von kulturbanause

Wir bieten Seminare und Workshops zu den Themen Konzept, Design und Development. Immer up-to-date, praxisnah, kurzweilig und mit dem notwendigen Blick über den Tellerrand.

Übersicht Schulungsthemen →