queo blog

Idee wird Wirklichkeit: Jugendportal saxx-life.de

Im ersten Teil unserer regelmäßigen Serie, der euch einen Blick hinter die Kulissen unseres Projektgeschäftes geben soll, haben wir die Entstehungsgeschichte der Weihnachtsaktion für die Stadt Dresden vorgestellt. 2014 jedoch hatte noch einiges Mehr zu bieten und für den Moment möchte ich eure Aufmerksamkeit auf unseren Neukunden – die Ostsächsische Sparkasse Dresden (OSD) – lenken. Im Zuge eines Pitches haben wir den Betreuungsetat für das Erlebnisportal saxx-life.de sowie das Mandat für den kompletten Relaunch erhalten.

Strategie: Mutig und bestimmt.

Die Geschichte dieses Projektes beginnt im Spätherbst 2013. Die Anfrage zum Pitch kommt und kurz darauf arbeitet sich ein dreiköpfiges Team bei queo in Kunde, Portal und Zielgruppe ein. Im Laufe der Auseinandersetzung mit dem Status-Quo wurde uns bewusst, dass wir eine gemeinsame Vision entwickelt haben, die wir unbedingt bei der OSD vorstellen wollen. Auf Basis der strategischen Ausrichtung der OSD im Bereich der jungen Zielgruppe, sahen wir eine Chance, den Kontaktpunkt saxx-life.de nachhaltig zu stärken: Wir wollen Kunden und Nichtkunden einen Erlebnisfaktor „powered by OSD“ anbieten. Damit führen mir jungen Menschen näher an das Konto saxx life sowie die Sparkassen-Marke heran.

Pitch Konzeptscreen

Entwurf des neuen saxx-life.de für den Pitch

Die Vorstellung einer solchen Idee beim Kunden erfordert immer Mut. Kann der Kunde die Herleitung und Begründung der Idee nachvollziehen? Wie vermittelt man die Kritik am Status-Quo? Und kann der Kunde sich für die Vision genauso begeistern, wie wir es tun? Glücklicherweise traf unsere Idee den Nerv und wir verfolgten gemeinsam mit dem Kunden ein Ziel: Das neue saxx-life.de.

Konzept: Agil und testgetrieben.

Im Frühsommer 2014 begann die Arbeit am neuen saxx-life.de. Wir hatten die Freiheit (und die Aufgabe), das Portal auf dem weißen Papier neu zu entwickeln. Doch wurde im Pitch nicht schon die fertige Website präsentiert? 😉 Nein, denn auch wenn die Gestaltung für einen Pitch zwar ansprechend ist, besteht in der Regel nie die Zeit, ins Detail der Benutzbarkeit einzudringen. So nahm das Pitch-Team – bestehend aus Designer, Texter und Konzepter – nach einem initialen Kundenworkshop die Arbeit wieder auf und arbeitete zuerst an einem Paper-Prototyp.

Paper Prototyp

Auszug aus dem Papier-Prototypen – der ersten klickbaren Anwendung im Konzept

Es ist ein tolles Gefühl, nach einem halben Tag intensiven Arbeitens auf das Ergebnis sofort reales Feedback von Zielgruppenvertretern zu bekommen! Das gesammelte und bewertete Feedback wurde anschließend eingearbeitet und der Prototyp ins digitale überführt:

Wireframes

Einblick in den Wireframe, der komplett Mobile First entwickelt wurde

Dieses agile Konzeptionsvorgehen ist unserer Erfahrung nach in jeder Hinsicht besser als stundenlanges Schreiben von Konzeptpapieren (die trotzdem noch nötig sind, doch mehr aus Dokumentationsgründen): Alle beteiligten im Projektteam sind einbezogen: Der Designer entwirft Layout und Nutzerführung mit, der Entwickler wird frühzeitig in die Prozesse und das mobile Design einbezogen und der Texter kann seine Entwürfe durch die verschiedenen Prototypen mehrfach verbessern. Interdisziplinäre Arbeit von Anfang an zahlt sich aus.

Ein Konzept-Ergebnis, dass ich euch nicht vorenthalten möchte: Der Siteflow. Während eine Sitemap lediglich alle Seiten einer Website anzeigt, zeigt der Siteflow auch jeden Zustand, den eine Seite durch unterschiedliche Nutzergruppen und Vorbedingungen annehmen kann.

Siteflow

Der Siteflow – die Weiterentwicklung der Sitemap

Was fehlt? Richtig: Farbe: Nach dem Layout, Menüführung, und die Klickpfade erarbeitet wurden, kann Design das Website-Gerüst mit Emotion und Leben füllen. Nach der Festlegung der Designgrundlagen wird der Prototyp mit grafischen und fotografischen Elementen gefüllt und kann so dann auch beim Kunden präsentiert werden. Der Vorteil dieses Vorgehens: Zur Vorstellung hat man bereits eine klickbare Anwendung – fast so, als gäbe es die Website bereits. Doch nun genug des Wortes, hier ein paar Auszüge aus dem Designkonzept:

Designkonzept Grundlagen

Designkonzept Header

Designkonzept Event

Auch wenn ich nicht alle Facetten der Konzeption beleuchten konnte, so hoffe ich, wenigstens auf die Wichtigsten eingehen zu können, so dass ihr einen Einblick in das Vorgehen und die Zwischenergebnisse bekommen konntet. Was folgt? Die Entwicklung: Ausarbeiten des Screendesigns, Prozesse in Code überführen, Frontend entwicklen… um nur einige Aufgaben zu nennen.

Entwicklung: Akzeptanzschaffend.

Um euch nicht weiteren Details der Umsetzung zu langweilen, möchte ich auf eine andere wichtige Sache zu sprechen kommen: Wie entwickelt und kommuniziert man das Projekt so, dass die interne Akzeptanz beim Kunden und deren Mitarbeitern möglich hoch ist?

Richtig, man lässt die Mitarbeiter an der Entwicklung teilhaben – so gut es geht. Dazu nutzt man die Ergebnisse der einzelnen Sprints, nach denen jeweils eine funktionsfähige Website ausgeliefert werden kann.

  1. Alpha-Version: Vorstellung des neuen saxx-life.de auf einer internen Mitarbeiterveranstaltung der OSD auf einem großen Touch-Display sowie auf Smartphone und Tablet. Effekt: Wertvolles Feedback und Bekanntmachung des Relaunch-Projektes.
  2. Beta-Version: Auslieferung der Beta-Version des Portals an die Azubis der OSD, die freiwillig 2 Wochen das Portal testen können. Ihre Anmerkungen und Wertungen fließen ein in die Fertigstellung des Portals.
  3. Berateraktion zum Launch: Damit die für dieses Portal so wichtigen Berater der OSD über den Launch informiert und gleichzeitig motiviert werden, es bei Ihren Kunden zu bewerben, wurde eine Aktion entwickelt, die genau dieses Ziel verfolgt.

Zudem wurde parallel eine Launchkampagne umgesetzt, ein Film gedreht sowie Social Media Kanäle und Inhalte vorbereitet, die das Portal nach dem Launch bei der Zielgruppe bekannt machen sollen.

YouTube Preview Image

Projekt: Ganzheitlich und aus einer Hand.

Zum Schluss ein Wort in eigener Sache: Wir lieben Projekte dieser Art. 🙂 Hier können wir unsere ganzheitliche Arbeitsweise positiv einbringen, können für den Kunden alle Herausforderungen aus einer Hand liefern – von der Strategie, Idee, Beratung, über Gestaltung und Umsetzung bis hin zur Erfolgsmessung. Dabei standen dem Projekt insgesamt mehr als 20 queos  mit ihren unterschiedlichen Sichtweisen und Expertisen (Text, Grafik, SEO, Media, Design, Entwicklung, Social Media, Recht, Strategie…) zur Verfügung und helfen dabei, den Kunden damit ein Stück erfolgreicher zu machen…

Für alle, die es interessiert, hier eine Auflistung der eingesetzten Tools in diesem Projekt:


One thought on “Idee wird Wirklichkeit: Jugendportal saxx-life.de

  1. Pingback: Idee wird Wirklichkeit: Dynamo Web-App | queo blog

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.