5WorX <Webconstruction />

Wenn man gerade mit der Webentwicklung anfängt, steht man einer Menge Fragen gegenüber, von denen man nicht mal weiß, das man sie stellen muss. Auch ist es schwierig abzuschätzen, was andere Teammitglieder machen und wie schnell.

Wir wollen uns mal Gedanken über die grundsätzlichen Aufgaben machen und wie man sie strukturieren kann. Sie werden sehen, so kompliziert ist das garnicht, wenn man es auf seine Essenz runterbricht.

Jedes Webprojekt läuft in einem Hypermedia Client ¹ und diese können nur HTML, CSS und JS. Darüberhinaus unterstützen sie Medientypen wie Bilder, Videos, Text, Schriftarten usw. Der Browser unterstützt nativ auch nur POST und GET². Und dafür existieren nur wenige native HTML-Elemente: <a></a>, <form></form>.
Alles darüberhinaus muss extra implementiert bzw den Elementen extra ³ beigebracht werden!

Aus diesen Tatsachen lassen zwei Aufgaben ableiten: Medien müssen irgendwo hergeholt und auf eine bestimmte Weise dargestellt werden, Formulare und deren Daten empfangen, verarbeitet und weggeschickt: Das E.V.A ⁴-Prinzip.

Priorisieren

Als Erstes funtioniert der Job, dann sehen wir gut aus und dann haben wir Spaß!

Diesem Grundsatz liegt meiner Zeit im Veranstaltungsschutz zugrunde ⁵. Zum Wesen von Veranstaltungen wie bspw Konzerten gehört es, dass sie nur an diesem einen Tag an diesem Ort stattfinden. Zwar laufen diese meist gleich ab ⁶, sodass man einem Handlungsstrang folgen kann, aber man hat eben auch nur diesen einen Versuch. Klappt der Einlass nicht reibungslos, kann man die Gäste nicht wieder nach draussen bringen und von vorn anfangen. Dazu kommt, dass die KollegInnen in einer Veranstaltungshalle weit verstreut sind. Damit jeder seinen eigenen Bereich unter Kontrolle kriegt, haben wir die og Prioliste ⁷ erfunden. Für den Einlass bedeutete dies:

• Als Erstes funktioniert der Job - Kann jeder Kartenabreißen bzw scannen? Hat die Person ausreichend Platz und Licht dafür? Ist klar, wie der Besucherstrom laufen soll?
• dann sehen wir gut aus - Sitzt die Kleidung? Kann der Besucher den Dienstleister von anderen Besuchern unterscheiden? Ist der unmittelbare Bereich von störenden Hindernissen befreit?
• und dann haben wir Spaß - Dazu gehört die Pausenregelung, Ablösung und auch Sitzmöglichkeiten bei langen Veranstaltungen aber auch das gelegentliche Rumalbern mit Besuchern ⁸.

Vor diesem Hintergrund kann ich jede mir gestellte Aufgabe beleuchten. Muss ich eine Bilderslideshow implementieren, muss ich wissen, wo die Bilder herkommen, wieviele angezeigt werden müssen usw. Habe ich Fließtext und Bilder, muss ich sie einander ausrichten und auch erstmal wissen, wo ich beides herbekomme. Das gilt auch für Formulare. Wo sollen die Daten hingeschickt werden und wie sieht deren Datenstruktur aus? Welche Struktur haben die Daten, die ich empfange und wo kann ich sie beziehen?
Wenn das geklärt ist, müssen die Daten/Medien auf der richtigen Seite an der richtigen Stelle angezeigt werden. Habe ich das, muss die Darstellung nur noch der Designanforderung entsprechen. Fertig.

Als Erstes funktioniert der Job - Als Frontender muss ich die ensprechenden Formularfelder haben und das Senden muss die Formularauswertung an die richtige URL schicken. Es ist überhaupt nicht erforderlich an dieser Stelle, das jedes Feld validiert oder irgendwie grafisch aufgemotzt sein müsste, um zu funktionieren.

dann sehen wir gut aus - Jetzt kann ich die Formularfelder anordnen und mit Fehlermeldungen, Hinweisen etc versehen. Halt alles, was dem Benutzer kommuniziert, was er als Nächstes tun soll.

und dann haben wir Spaß - HTML-Elemente aus ihrem langweiligem statischen Dasein zu befreien, macht Spaß. Vielleicht bietet sich auch der ein oder andere grafische Effekt an? Das alles passiert jetzt.

Wir dürfen einen sehr wichtigen Aspekt nicht vergessen: Wir sind nicht alleine im Projekt und auf allem was wir tun, wird jemand anderes aufbauen. Stellen Sie sich vor, Sie arbeiten an der Schnittstelle zur Datenbank. Es geht darum eine Liste mit registrierten Usern anzulegen. Das Frontend wird über ein Formular die Userdaten schicken. Für Sie beide ist es entscheidend, welche Daten für eine Registrierung erforderlich sind und welche optional und Sie sollten sich darüber im Klaren sein, dass die Felder gleich heißen sollten. Wenn Sie beide als erstes den Job zum funktionieren bringen wollen, einigen sie sich auf die Datenstruktur und die erforderlichen Felder. Sie können jetzt die Spaltennamen bestimmen und das Frontend Ihnen die erste Formularauswertung mit den entsprechenden Keys schicken. Und das kann parallel passieren. Wenn das FE erstmal warten muss, bis es die Datenstruktur erhält oder umgekehrt, werden Sie viel Zeit verschenken.

Es geht bei jeder Aufgabe darum, den Kern zu erfassen und als erstes diesen umzusetzen. Das hat auch den Nebeneffekt, dass man in einem Bestandteil der Agilen Entwicklung denkt: dem MVP, dem Minimum Viable Product oder einfach: ein “minimal brauchbares oder existenzfähiges Produkt”. Ersetzen wir in diesem Kontext “Produkt” mit “Anwendungs-Bestandteil” passt alles wieder schön zusammen.

Funfact: Es ist mir tatsächlich sehr häufig passiert, dass ein fertig geplanter und durchgestylter Baustein am Ende dann doch nicht mehr so durchgestylt sein musste, sondern die einfachste Form von erst funktioniert der Job vollkommen ausreichte. Das freut dann alle, denn es spart Zeit, Geld und Nerven ⁹.

Vergessen Sie nie, dass die Motivation und die Blickwinkel hinter jedem Handelnden unterschiedlich ist. Das gilt es bei jedem Projekt zu beachten, denn Projekte bestehen in erster Linie aus Menschen und nicht aus Computerprogrammen. Auch nach erfolgreichem Launch bleiben die Menschen, die Ihre Anwendung benutzen.

Klären Sie Begriffe, die Sie nicht verstehen bzw versichern Sie sich, dass alle das gleiche darunter verstehen. Und was mir besonders am Herzen liegt: Verstecken Sie sich nicht hinter Ihrer Tastatur oder den eingesetzten Frameworks. ¹⁰