Responsive Webdesign: Workflow

Weshalb wird ein neuer Workflow benötigt?

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Traditionelles Wasserfall-Modell, Freiheitsgrade und Anforderungen: Anhand einer Grafik wird schnell klar, weshalb ein neuer Workflow her muss.

Transkript

Warum aber wird ein neuer Workflow benötigt? Schauen wir uns einmal den klassischen Workflow an. Er beginnt meist mit einem Lastenheft. Dies ist meistens nur eine Mail von Kunden, indem er sagt: Bitte, machen Sie mir eine neue Webseite. Anbei ein erster Entwurf und natürlich Responsive. Bitte um eine Preisabgabe. Danach setzen wir uns als Agentur hin und entwickeln meist ein Pflichtenheft, indem alles haargenau drin steht, was später realisiert werden soll. Danach beginnt der Design-Prozess. Der Designer macht ganz viele Photoshop-Dokumente und diese Photoshop-Dokumente werden an den Kunden geschickt zur Freigabe. Sobald der Kunde die PSDs, also die Photoshop-Dokumente, freigegeben hat, geht das Ganze in die Entwicklung und es wird implementiert. Danach wird es nochmal überprüft, noch getestet und am Schluss erfolgt immer eine Endabnahme mit dem PSD. Das heißt, der Kunde erhält ein ausgedrucktes Photoshop-Dokument sprichwörtlich Neverend Screen und schaut sich an, ob all das genau so realisiert worden ist, wie er es haben möchte. Danach, Sie kennen das, ist alles fertig. Kein Problem. Das Ganze basiert auf den sogenannten Wasserfallmodell, welches, und das könnte einen schon stutzig machen, aus dem Jahr 1956 ist, welches grundsätzlich Anforderungsanalyse und -spezifikation als Prozessschritt hat. Dann Systemdesign und -spezifikation. Programmierung und Modultest. Dann Integrations- und Systemtests. Danach Auslieferung, Einsatz und Wartung. Was ist aber nun verkehrt an diesem Workflow? Das hat doch schon seit Jahren funktioniert! Schauen wir uns einmal die sogenannte Stacey-Matrix an. Die Stacey-Matrix hat grundsätzlich zwei Achsen. Auf der X-Achse sind die Freiheitsgrade, also das Wie, aufgezeichnet und zwar von wenig bis viel. Auf der Y-Achse haben wir die Anforderungen, also das Was. Und dort von bekannt bis unbekannt. Das Was bezeichnet das System mit dem ich interagiere, also die Webseite. Während das Wie die Klarheit und Einigkeit bezüglich der Ziele ist, also der Anforderungen. Das heißt, die Anforderungen selbst auf der Y-Achse und wie sehr ich sie kenne, und wie sie jetzt umsetzen kann im Sinne der Freiheitsgrade auf der X-Achse. Sind die Anforderungen bekannt, und es gibt wenige Freiheitsgrade, habe ich ein einfaches Projekt vor mir. Das ist schnell umzusetzen. Beispielsweise ein Onepager ohne größere Grafik. Sobald allerdings die Anforderung sowohl die Freiheitsgrade in den mittleren Bereich rutschen, bin ich bereits bei einem komplizierten Projekt. Schlimm ist es wenn beide Parameter sehr hoch sind, also Anforderungen unbekannt und Freiheitsgrade hoch, denn dann bin ich in einem chaotischen Projekt. Was aber nun ist genau dazwischen? Das heißt, ich habe entweder sehr viele Freiheitsgrade und nun denken wir einfach mal zurück an die Displaygrößen: Zwischen 100 Pixel und 5.000 Pixel. Wir werden feststellen: Wir haben sehr viele Freiheitsgrade. Und gleichzeitig wissen wir aber nicht genau, wie sieht jede Webseite aus, die wir mit 100 und 101 Pixel, 105, 115 und 130 und so weiter. Wir können überhaupt nicht alle Anforderungen kennen. Daher sind diese unbekannt. In diesem Feld bewegt sich das sogenannte komplexe Projekt. Bestens geeignet für Scrum beispielsweise. Allerdings nicht für klassisches Webdesign. Dieses befindet sich im komplizierten Bereich. Aber Responsive benötigt genau den komplexen, denn genauso wie Scrum ist ständigen Änderungen unterworfen, ich kann es nicht planen. Ich weiß, dass es ein komplexes interaktives System ist. Genau darum müssen wir unseren Responsives-Webdesign-Prozess verändern. Um dies etwas besser zu illustrieren, wollen wir einmal beide Geräteklassen, eine sehr kleine und eine sehr große, gegenüberstellen. Beispielsweise eine Smartwatch, ein Smartphone, ein kleines Tablet gegenüber ein Tablet oder Desktop. Um das besser zu illustrieren gehen wir zurück in die Studentenzeit. Dort hatte jeder Student eine ganz kleine 1-Zimmer-Studentenwohnung. In dieser Wohnung gab es alles. In dieser Wohnung gab es ein Bett, eine Couch, ein Tisch, ein Regal, ein Arbeitsbereich, eine Küche, alles auf kleinstem Raum. Es gab keinen Luxus, aber den benötigten wir auch nicht. Aber alle Sachen, die man brauchte, waren erhältlich. Später wenn man ganz viel Geld verdient hat, mit Responsive Webdesign Projekten beispielsweise, konnte man sich eine größere 3-Zimmer-Wohnung leisten. Und dort natürlich den ganz großen Fernseher, den Flat-Screen. Oder noch ein zusätzliches Bett oder eine Couch. Oder ein zusätzliches Arbeitszimmer. All das hat man natürlich im kleinen nicht gehabt, aber man benötigte es auch nicht. Man nennt diese Transformation das sogenannte Progressive Enhancement, das heißt, von klein nach groß wird schrittweise erweitert. Das Gegenteil davon, ist Graceful Degeration. Und auch hier sieht man schon, der einzig sinnvolle Weg um diese Transformation zu machen, ist von klein zu groß. Daher gilt im Responsive Webdesign stets Mobil First. Und sogar noch die härtere Anforderung Content First. Denn wir machen das Responsive Webdesign ausschließlich wegen des Contents.

Responsive Webdesign: Workflow

Machen Sie sich die Prozesse, die hinter Responsive Webdesign stehen, zu Eigen und werden Sie zum erfolgreichen Projektleiter, Kunden oder Auftraggeber.

1 Std. 34 min (19 Videos)
Derzeit sind keine Feedbacks vorhanden...

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!