Look ma, no Photoshop!

Jason von 37 Signals hat auf dem Firmenblog einen interessanten Beitrag veröffentlicht: “Why we skip Photoshop“.

Er beschreibt darin den Designprozess von 37 Signals für Webprojekte. Es gibt zunächst Zeichnungen auf Papier mit denen das grundlegende Layout erarbeitet wird. Wenn diese funktionieren, wird sofort im Frontendcode gearbeitet – ohne den üblichen Zwischenschritt in einem Photoshop-Dummy. Als Gründe werden angegeben, daß man Photoshopdateien nicht anklicken kann, obwohl man sie bereits auf dem Bildschirm hat, man leicht durch unwichtige Details abgelenkt wird, man kann nicht schnell mal den Text austauschen oder sehen, wie sich die Seite dynamisch verhält. Photoshop unterstützt generell den Workflow in Gruppen nicht sinnvoll und führt dazu, daß man länger braucht, weil man vieles doppelt macht.

Prinzipiell kann ich da nur zustimmen – ich arbeite seit Jahren ähnlich. Mir fällt auch gleich noch ein weiterer Punkt ein: Wenn man gleich im 2. Schritt den Code schreibt, erkennt man sofort, was in welchem Browser nicht so funktioniert, wie man es sich vorgestellt hat. Die Massen an nicht in sauberen Code umsetzbaren PSDs sind Legion. Dan Boland kommentiert noch:

“Also, type in Photoshop never seems to be the right size as type in HTML . It just never seems to feel the same. It doesn’t wrap the same, it doesn’t space out the same.“

Ein interessantes Gegenargument spricht dafür cubiclegrrl in den Kommentaren an:

Sie gibt ihren Kunden NIEMALS klickbare Dummies an die Hand, weil diese nicht verstehen, daß es sich um einen Klickdummy und nicht bereits um die fertige Anwendung handelt (“Wieso brauchen sie denn so lange? Sie waren doch vor vier Wochen schon fertig.“). Unwissende Kunden fühlen sich dann oft übertölpelt, weil sie nicht wissen, wieviel Arbeit “unter der Haube” nötig ist. Sie bevorzugt deshalb Storyboards und Scribbles, auch wenn diese letztlich mehr Zeit benötigen.

Das richtige Tool für die richtige Phase im jeweiligen Projekt.

Struktur
Ich glaube, daß Scribbles und abstrakte Storyboards (oder Wireframe) genau die richtige Herangehensweise sind, um gleichzeitig den Content zu strukturieren, das Grundlayout anzulegen und zu überprüfen, ob das Ergebnis bedienbar ist.

Aussehen
Photoshop ist ein wirklich erstklassiges Bildbearbeitungsprogramm, nur habe ich es nie für ein Tool gehalten, mit dem man gut Websites “entwerfen” kann. Dafür ist es einfach nicht gemacht. Aber um festzulegen, wie der Mood einer Website ist, halte ich es dennoch für sinnvoll. Um sich dem grundsätzlichen Styles einer Site zu erarbeiten, sind ein-, zwei Screens recht mit einigen typischen Seitenelementen gut geeignet. Man darf nur nicht versuchen, die Seiten möglichst pixelgenau nachbauen.

Verhalten
Und zur Beurteilung dynamischen Verhaltens, benötigt man leider letztendlich codierte Prototypen. Es ist halt ein Unterschied, ob man eine “Website” mit viel Eye-Candy baut, oder eine Webapplikation.

Nicht zu vergessen, spricht m.E. ein gewichtiges Argument gegen Photoshop: €1.000.