Einheitsbrei im Screen-Design Warum Photoshop für User-Interfaces einfach immer aktuell bleiben muss!

Sebastian Bork | Sonntag, 06 September 2015. layout, photoshop, screen-design, ui-design

In den letzten Jahren hat sich - unbestritten auch durch die Triebfeder der Entwicklung vom mobilen Applikationen - ein merklicher Wandel im Designprozess für Userinterfaces von Software und Webseiten, also dem Bereich des Screen-Designs, vollzogen. Ein Wandel, welcher - vor allem in Hinsicht auf Effizienz, Kompatibilität (Stichwort "responsive Design") und Wiederverwendbarkeit - durchaus signifikante Vorteile aufweist. Ein Wandel jedoch, dessen heutige Ausprägungen aber durchaus auch Bedenkliches zu Tage bringen.

Was ist also geschehen.

Anfangs von dem Ziel geprägt, überhaupt die Komplexität von Userinterfaces - vorallem hier die von mobilen Plattformen, mit ihren ganzen systemspezifischen Besonderheiten - einer größeren Masse begreiflich zu machen und den Designern Werkzeuge für schnelle, systemnahe Skizzen an die Hand zu geben, entwickelten sich Tools für Mockups, Wireframing bzw. Prototyping; Tools, welche genau dadurch punkten, dass sie komplexe Anforderungen durch Vereinheitlichung (be-)greifbar machen.

Zeitgleich entwickelten sich CSS- bzw. Layout-Frameworks - vorallem für ihre große Hilfe bei responsive Designs bekannt und beliebt -, wie z.B. Foundation, Bootstrap oder YUI, mit einem ähnlichen Ziel. Nämlich: Die nun immer komplexer werdenden Verhältnisse zwischen UI-Designs und den verschiedenen Geräteklassen (Telefone, Tablets, variierende Desktop-Größen) zu kompensieren.

Sowohl die Design-Tools, als auch die Frameworks erfreuten sich an schnell wachsender Beliebtheit. Warum auch nicht; Konnte man doch Skizzen für den Kunden binnen weniger Stunden via Drag&Drop erstellen oder das Skripten der Templates auf Frameworks aufbauen, welche ohne weiteres verstanden, wie man sich auf unterschiedlichen Bildschirmgrößen zu verhalten hat.

Das klingt doch eigentlich sehr poistiv?!

Ja! Ohne Frage! Auch ich liebe Bootstrap und auch ich habe meine Favoriten unter den Mockup-Tools, um schnell Ideen zu skizzieren. Und die oben genannten Vorteile sind ja - besonders in Bezug auf die Frameworks - nur ein Bruchteil dessen was sie zu leisten vermögen. Navigationsleisten, Buttons, Formulare, Tabellen und etliches mehr; Für all das bringen diese Frameworks durchdachte und visuell ansprechende Ausgangssituationen mit.

So ist es auch für mich mittlerweile sehr oft so, dass ich nach ein paar kurzen Skizzen sofort das Screendesign in HTML, CSS und Javascript (eben mit Hilfe dieser Frameworks) umsetze - zu Gunsten der Effizienz hier und da ggf. noch ein bissel PHP - und zack präsentationsreif und vorallem interaktiv. Und nicht zu vergessen, die immense Zeitersparnis beim Adaptieren des Screen-Designs in ein feriges Template für ein CMS oder einen Shop - alles wichtige liegt ja schon als Quelltext+CSS vor.

Also haben wir doch gar kein Problem, oder?!

Doch! Denn wie mit jeder beliebten Technik, ist es letztlich der Anwender, welcher daraus früher oder später ein Problem macht. Bei den beiden oben genannten Strömungen (Mockup-Tools und Layout-Frameworks) ist dies für mich genau jetzt!

Denn, durch starke Überstrapazierung dieser Tools hat sich mittlerweile ein visuelles Grundrauschen eingestellt, was von vielen - fälschlicher Weise - als "Stil unserer Zeit" wahrgenommen wird. Schaut man sich jedoch genauer an, was diese Tools und Frameworks mitbringen, merkt man sehr schnell, dass augenscheinlich Heerscharen von Designern sich strikt auf diese Mitbringsel verlassen. Oftmals werden sogar die enthaltenen Farbschemata nichteinmal modifiziert.

Prägt euch nur mal die Buttons oder ein paar typografische Ansätze von Bootstrap in Ihrer Rohform ein und surft danach mal ein paar moderne, hippe Seiten an ... ohne Worte!

Kurz um: Es ist eine Vereinheitlichung im Gange, welche weit über nützliche Paradigmen, wie bspw. anerkannte Bedienweisen, beim Nutzer verankertes Verhalten oder standardisierten Breakpoints im responsive Design (Festlegungen, ab welcher Bildschirmgröße auf welches Layout umgesprungen wird), hinaus gehen und weit in die visuelle Erscheinung hinein reichen!

Und das ist schlecht! Das ist ganz und gar schlecht. Das nimmt jeder Applikation, jeder Internetseite und jedem Online-Shop auf Dauer seine Individualität!

Ein Designer, welcher dies zu Gunsten von Effizienz und Vereinfachung in Kauf nimmt, riskiert den Verlust von Markenidentität seines Klienten in einem wichtigen Kommunikationsfeld. Und, falls dem Designer das egal ist- was augenscheinlich oft der Fall zu sein scheint -, sollte er vielleicht das Folgende bedenken: Er liefert Produkte von der Stange und das macht ihn und seine Arbeit im höchsten Maße austauschbar!

Was hat das nun mit Photoshop zu tun?

Nach all der langen Vorrede ist dieser Kern rechnt schnell benannt und so simpel, dass man es eigentlich nur erklären muss, da es immer mehr in Vergessenheit zu geraten scheint!

Photoshop - oder auch nahezu jedes andere, eigentlich zur Bildbearbeitung konzipierte, Programm - hat genau zwei Vorteile. (1) Es wurde nicht explizit für die Entwicklung von Interfaces geschaffen. Und (2) es kennt nahezu keinerlei Vereinheitlichung zu derartigen Design-Prozessen. Und daraus resultiert: Man ist als Designer eben an nahezu keinerlei Grundvoraussetzungen gebunden und hat alle kreative Freiheit der Welt!

Natürlich hat man bei der Entwicklung eines konkreten Screen-Designs - zumindest als erfahrener Designer - auch bei all diesen Freiräumen stets die Limitierung von HTML, CSS, Borwsern oder die Vorgaben der vorab ausgewählten Techniken, Skripten oder Frameworks im Blick. Und das ist auch gut so und sehr wichtig. Denn das ist der Erfahrungswert, welchen man sich über Jahre hinweg angearbeitet hat.

Der entscheidende Vorteil liegt darin, dass man nicht schon im Designprozess innerhalb fester und vor allem vereinheitlichter Regeln arbeitet. Anstatt also mit den Vorgaben "Was geht" und "Was bringt mein Framework / Mockup-Tool schon mit" zu beginnen, kann man sich wesentlich wchtigeren Fragen der Gestaltung widmen. Am Ende kann man so mit hoher Wahrscheinlichkeit mit einem Design aufwarten, was eben nicht von der Stange kommt und der Identität und Individualität seines Auftraggebers wesentlich gerechter wird.

Fazit

Ich weis, dass in der heutigen Zeit von HTML5, CSS3 und den ganzen damit einhergehenden Möglichkeiten und Vorteilen die direkte Verwendung von Dateien - png, jpeg, etc. - aus Photoshop und Co. mit Sicherheit nicht mehr zeitgemäß ist. Ich weis auch, dass es dadurch auf den ersten Blick ein ziemlich undankbarer Schritt zu sein scheint, trotzdem ein Screen-Design in einem Tool wie Photoshop zu beginnen.

Es geht aber schlicht um die Freiheit in der Kreativität. Und diese sollte es immer wert sein, eine Extrarunde einzulegen, um ggf. mit etwas ganz besonderem und zumindest individuellem aufwarten zu können!

Kommentare aktivieren?

Diese Seite verwendet das externe Kommentarsystem DISQUS. Da es durch die Nutzung externer Dienste zwangsläufig dazu kommt, dass Daten des Nutzers an die Server dieses Dienstes gesendet werden, möchte ich jedem Nutzer diese Entscheidung selbst überlassen!.
DISQUS aktivieren