Vortrag: Softwarebasierte Barrieren im Designprozess einreissen

Am vergangenen Mittwoch hatten wir auf der UIG Frühjahrstagung einen Vortrag über ein Tool gehalten, welches unseren Designprozess erheblich vereinfacht hat: Sketch App.

Wir fragen uns – wie sicherlich ganz viele Projektteams – ständig, wo genau wir ansetzen können – bzw. was in unserer Macht steht, den Designprozess zu vereinfachen, zu beschleunigen und die Kommunikation mit dem Projektteam zu optimieren.

Oftmals arbeiten wir als Konzept / Design Team remote mit unseren Kunden zusammen – sitzen also nicht immer mit dem gesamten Projektteam an einem Ort. Dies klappt eigentlich erstaunlich gut, bringt aber auch nochmals ganz eigene Herausforderungen mit sich – vor allem in der Übergabe von Designdokumenten. Genau um diese Herausforderungen ging es in dem Vortrag.

Frankenstein lebt – oft im www

Im Endeffekt geht es um Kommunikation und Dokumentation – und wie es uns einfacher gemacht wird, ebendiese anzufertigen. Es gibt viele verschiedene Gründe dafür, dass sich digitale Produkte wie z.B. Webseiten, Online Shops oder Applikationen beim Launch oder Relaunch a) anders verhalten als gedacht/geplant und/oder b) anders aussehen, als es geplant wurde.

Wenn z.B von Beginn an die Tatsache ignoriert wird, dass ein digitales Produkt wächst, bzw. erweitert wird (und das tut es in 99%) – oder aber ein Konzept / Layout z.B. nicht gut dokumentiert ist – und auch noch Lücken aufgrund fehlender „Zwischenschritte“ oder nicht zu Ende gedachter und definierter Elemente aufweist – führt dies zu teils herrlichen Interpretationen dessen, was letztendlich umgesetzt wird. Jede*r macht dann ein bisschen das, was ihr/ihm so „passt“. Das Ergebnis sind: Inkonsistenz in Interaktions- oder UI Pattern (alles funktioniert anders) und im visuellen Design (alles schaut anders aus). Kurz: Congratulations, your product got „frankensteined“.

Inkonsistenz ist ein Usabilityproblem

Die Leidtragenden sind unsere Nutzer. Denn inkonsistente Verhaltensweisen von digitalen Produkten und ein vielfältiger Flickenteppich an UI Elementen sorgen für Verwirrung mit teils hohem kognitiven Aufwand. Sprich: Die Usability kann erheblich darunter leiden.

Gute Dokumentation ist die halbe Kommunikation

Diesen Interpretationsspielräumen und der darauf folgenden Inkonsistenz wollen wir entgegenwirken.
Uns z.B. macht die Software „sketch app“ unsere Designdokumentation und somit auch die Kommunikation erheblich leichter als die Software, die wir zuvor benutzt hatten.

Sprich: Wir haben festgestellt, dass es Software gibt, die einfach sehr gut geeignet ist, das Designkonzept eines digitalen Produktes schlüssig an das restliche Team zu kommunizieren und somit diese Prozesse erheblich vereinfacht – das ist zumindest unsere Erfahrung.

Denn: die „Hürden“ (Barrieren) sind oft im Informationsverlust zu finden, der stattfindet, wenn ein Projektteam (z.B. Konzept) an einer gewissen Stufe des Projektes das Designdokument an das „nächste“ Projektteam (z.B. visuelles Design) übergibt. Alleine zwischen diesen beiden Teams kann schon eine Anfälligkeit für Fehler und Irritationen überhand nehmen – ganz zu schweigen von der Übergabe an die technische Entwicklung, die sich oftmals mit einem Stapel jpgs zufriedengeben muss, die viele Status nicht abdecken oder sich gezwungen fühlt , sich durch zu viele Einzeldokumente zu kämpfen, um das Gesamtkonzept zu verstehen und “lesen” zu können. Dies alles ist sehr mühsam.

Natürlich es ist nicht nur die alleinige Aufgabe einer Software, Prozesse zu vereinfachen. Einen „magic Button“ den man drückt und alles wird super – den gibt es nicht. Der Faktor Mensch spielt hier die Hauptrolle.

Mit sketch ist es aber erheblich einfacher, eine Designdokumentation und auch Pattern Bibliotheken anzulegen als z.B. mit Photoshop – welches bis vor ca. zwei Jahren unser treuer Begleiter im Bereich visuelles Design war – für die Konzeption haben wir wieder auf andere Tools zurückgegriffen. Auch ist es somit nun um einiges einfacher z.B. UI Patterns oder Wireframes im konzeptuellen „Rohbau“ ohne Informationsverlust in ein visuelles Design zu „übertragen“ bzw. schrittweise zu verfeinern, da alles in einem einzigen Dokument geschieht.

Wie gesagt, spiegelt dieser Vortrag unsere eigenen Erfahrungen wieder und das Vorgehen ist auch nicht für jede Situation passend. Uns hat es jedenfalls sehr geholfen, gute und lückenlose Design Dokumente zu erzeugen – vor allem, wenn klar ist, dass zusätzlich zum Konzept noch ein visuelles Layout erfolgt und man somit unter anderem die Gefahr des Dokumenten Wirrwarrs und der Übertragungsfehler und den oftmals daraus resultierenden Missverständnissen etwas entgegenwirken kann.

Es bleibt spannend, denn die Web/ UX/ Design Industrie sehnt sich nach Produkten, die auf die speziellen Anforderungen des UI Designprozesses perfekt zugeschnitten sind. Sketch ist eins davon.

Links

https://www.sketchapp.com/
http://sketchtoolbox.com/
http://www.sketchappsources.com/