Ideen sammeln

Am Anfang ist eine Anwendung nichts weiter als ein Haufen von guten und weniger guten Ideen. Wir setzen uns mit unserem Kunden zusammen und schreiben alles auf, was uns zu dieser Anwendung Cooles, Wichtiges und Interessantes einfällt. Machbarkeit spielt zu diesem Zeitpunkt noch nicht wirklich eine Rolle.

Danach organisieren wir die gesammelten Gedanken, zum Beispiel in einer Mind Map. Wir müssen jetzt festlegen, was genau die zukünftige Anwendung kann, und an welche Zielgruppe sie gerichtet ist; am besten in einem Satz. Das kann sich dann zum Beispiel so anhören: “Flickr ist eine Webseite, mit der Hobbyfotografen ihre Bilder anderen zeigen und neue Fotos entdecken können.”. Diese Aussage sollte so genau wie möglich sein!

Wenn wir eine Definition gefunden haben, die passt, und die auch angenehm kurz ist, gehen wir die gesammelten Ideen noch einmal durch. Passen die Ideen? Was fällt uns noch ein, jetzt wo wir die Definition haben? Am Schluss haben wir eine gute Idee für eine schlanke, gut definierte Anwendung.

Prototyp

Wir wissen jetzt, was wir wollen; als nächsten Schritt überlegen wir uns, das Wie. Und zwar nicht das Wie aus der Sicht eines Programmierers, sonderen aus der Sicht eines Anwenders, denn die sollen das fertige Produkt schließlich einmal benutzen.

Dazu erstellen wir einen Prototypen, eine Repräsentation wie sich die Seite später für den Benutzer anfühlen wird und wie sie aufgebaut ist. Meistens arbeiten wir dabei mit Papier: Ein A4-Blatt für eine Unterseite und Post-Its oder kleine Zettel für Elemente, die sich ändern können, oder die wir probeweise an verschiedene Stellen setzen. Bei besonders interaktiven Webseiten setzen wir auch Prototypen aus HTML und JavaScript ein.

In dieser Phase arbeiten wir besonders eng mit dem Kunden zusammen, denn hier entscheidet sich, wie sich seine Webseite verhalten wird. Der tatsächliche Code dahinter ist schließlich für jemanden, der die Seite benutzt, meistens weniger wichtig.

Architektur und Code

Basierend auf den Entscheidungen, die wir bisher über Features, Aussehen und Verhalten der Webseite getroffen haben, entscheiden wir uns jetzt, auf welche Art wir genau die Webseite programmieren. Manchmal können wir eine fast fertige Open-Source-Lösung, z.B. ein CMS benutzen und müssen es nur noch anpassen. Manchmal ist eine Seite aber auch so neuartig und anders, oder hat so besondere Anforderungen, dass wir uns dafür entscheiden, sie von Grund auf neu zu schreiben. Dann sind jetzt zu klären, welche Programmiersprache, Datenbank und Server wir benutzen, und wie wir den programmatischen Teil der Webseite aufbauen.

Ach, und, programmieren sollten wir das Ganze dann auch noch. Dazu konzentrieren wir uns typischerweise auf den wichtigsten Teil der Seite — welcher Teil das ist, wissen wir aus unserer Arbeit mit Prototypen — und entwickeln diesen. Danach sehen wir nach, ob das bisher Geschriebene den Kundenwünschen entspricht und ob sich durch die Entwicklung neue Erkenntnisse ergeben haben, die sich auf die anderen Teile auswirken. In diesem Fall passen wir die entsprechenden Prototypen und Designs an und beginnen dann die Arbeit am nächst-wichtigeren Teil. Und so weiter.

Usability Testing

Jedes Mal, wenn ein Teil der neuen Webseite fertig gestellt ist, arbeiten wir an den anderen Teilen weiter, aber wir testen gleichzeitig den fertigen Teil auf seine Benutzerfreundlichkeit. Das haben wir zwar schon zum Teil an den Prototypen gemacht, aber das ist kein Grund, einen tatsächlichen Usability-Test wegzulassen.

Wir lassen also (je nach Größe des Projekts) Freunde, Kollegen oder Beta-Tester (und natürlich auch unsere Kunden) die Seite benutzen und beobachten sie dabei, wie sie verschiedene Aufgaben à la “Bestelle ein Ticket über das Ticketsystem” oder “Finde heraus, wann die Veranstaltung statt findet” lösen. Mit diesen Beobachtungen verfeinern wir die Benutzeroberfläche so lange, bis sie für möglichst alle User intuitiv, elegant und schnell zu bedienen ist. Wenn es nicht Spaß macht, sich auf der Seite zu bewegen, sind wir noch nicht fertig. :)

Auslieferung

Irgendwann haben wir den Punkt erreicht, wo wir die Webseite für auslieferungsreif halten. Manchmal ist dann die gesamte Seite fertig, aber oft auch nur die Kernfunktionalität, und wir arbeiten an der Seite weiter, während sie schon an Bekanntheit gewinnt. Das hilft uns noch zusätzlich, den Ablauf der Aktionen auf der Seite weiter zu optimieren, weil wir genau beobachten können, was echte Benutzer — keine Betatester — tatsächlich tun.

Sei es nur ein Teil oder sei es das Ganze, die Seite muss online. Wir kümmern uns um den Server und um die Domain, und darum, dass von Tag Eins ab der Webauftritt glatt läuft. Unsere Kunden bekommen sogar die Handy-Nummern der beteiligten Mitarbeiter, so dass sie sofort einen Kontakt haben, falls etwas schief geht.

Mehr

So entsteht bei uns eine Webseite. Vielleicht auch Ihre? Unterhalten Sie sich doch einfach mit uns über Ihre Idee! Unsere Kontakt-Seite zeigt, wie Sie uns erreichen.

Mit dem Erschaffen ist es übrigens noch lange nicht vorbei. Eine gute Web-Präsenz wird immer weiter entwickelt, analysiert und gepflegt, und darum kümmern wir uns auch. Aber das ist ein Thema für einen späteren Blogpost.

Bilder: Zevotron, someToast, mccready, breakthesystem, re-ality, Don Solo

Nur so nebenbei: Ich persönlich finde übrigens schrecklich, dass man im Deutschen immer zwischen “Du” und “Sie” hin- und hergerissen ist. Wir haben uns jetzt für das “Sie” entschieden… was meinen unsere Leser? — Was meinen … Sie?

Ein Wort zur technischen Seite: Nach langer Überlegung haben wir uns dazu entschieden, diese Seite weiterhin auf Wordpress basieren zu lassen. Eigentlich wollten wir komplett von PHP weg, aber wir konnten einfach kein so fortgeschrittenes Blog und CMS da draußen finden. Wordpress ist einfach gut :)

Die Vorlage für unser Design lieferte das Wordpress Theme Magazeen des talentierten Designstudius function.

Ach, und wenn Sie irgendwelche noch nicht ins Deutsche übersetzten Stellen auf dieser Webseite finden: Wir würden uns über einen Kommentar deswegen sehr freuen ;)

And, before you laugh… yes, I kinda get Twitter now. And I like it.

PS: I couldn’t find a better picture for this post, so I used my new favourite image.

Bild von FelipeArte

Hello and welcome to breakthesystem.org. I’m your host, Daniel Jilg aka Winsmith. Today, yet another seemingly random, ranting, raving blog appears in the ’sphere: Mine.

Here, you can expect to be treated with a very high dose of code, especially in Python and Ruby, a generous amount of profanity, especially directed at any form of stupidity, and a fair number of posts concerning tech-related politics. The latter two might very well occur together a lot.

So don’t say you haven’t been warned.

Topics I plan to cover in the near future include interesting yet useless Python and Django code snippets, the new German Bundestrojaner state-controlled trojan horse and maybe I’ll rant about Apple Inc. a little. Maybe.

Enjoy your time,

Daniel