1. Joinbox
  2. Dienstleistungen

Konzeption und Strategie

Eine Web-Applikation, eine Website oder ein Online-Shop erfüllt keinen Selbstzweck. Sie sind alle dazu da, um Kunden zu gewinnen, Ihre Bekanntheit zu steigern, Ihr Geschäft zu fördern. Sie sind eine Investition, die sich langfristig auszahlen soll.

Wir unterstützen Sie dabei, indem wir:

  • zusammen mit Ihnen die strategischen Ziele des Projekts und die konkreten Massnahmen zu deren Verwirklichung festlegen
  • darauf fokussieren, mit dem sinnvollen Minimalumfang (Minimum Viable Product) zu starten und so Kosten- und Projektrisiken zu senken
  • die Interaktionen der Nutzer messen und so das Projekt nah am Markt weiterentwickeln
  • jedes Projekt in drei Phasen mit verbindlichem Budget und klarem Zeitplan unterteilen: Konzept, Gestaltung, Umsetzung.
Joinbox Lounge

User Experience und Design

Schönes Design ist schön – aber nicht mehr. Applikationen und Websites sind interaktiv. Erfolgsentscheidend ist nicht ihr Aussehen, sondern ihre Funktionsweise. Im Grossen wie im Detail. Wir strukturieren Ihr Projekt logisch und übersichtlich, gestalten es intuitiv. Die offensichtliche Lösung ist meistens die beste.

Und ja, natürlich lieben wir das Schöne, das Schlichte. Die Oberfläche, das Aussehen. Weil unsere Grafiker auch unsere Frontend-Programmierer sind, bleiben Kommunikationswege und Planungsphasen kurz. Gestaltung und Umsetzung gehen Hand in Hand. Dadurch sieht das Resultat nicht nur gut aus, es fühlt sich auch richtig an.

Wireframes
Fabian Jordi, Felix Steiner, Michael van der Weg

Umsetzung

Wenn Ihr Projekt online geht, soll es nicht von gestern, sondern Basis für die kommenden Jahre sein. Deswegen verwenden wir junge und erprobte Open-Source Technologien und setzen auf offene Schnittstellen. Sie sind erweiterbar, geniessen eine grosse Verbreitung und werden langfristig weiterentwickelt.

Diese Technologien setzen wir nachhaltig ein: Wir programmieren nach anerkannten Standards, unterteilen Anwendungen in kleine und wiederverwendbare Komponenten, testen automatisiert und planen langfristig. Wir bevorzugen die saubere Lösung gegenüber der schnellen, wenn wir Ihnen so mittelfristig Kosten ersparen können.

Komplexe Software entwickeln wir iterativ: in kleinen Schritten, die Sie regelmässig testen und abnehmen können. So senken wir gemeinsam Kostenrisiken, machen das Projekt und die Freude daran greifbar.

Michael van der Weg, Tobias Kneubühler, Michael Rüfenacht
Pflanze

Analyse

Eine Strategie zu haben, ist das eine. Ihren Erfolg zu messen das Entscheidende. Die in der Konzeptionsphase festgelegten Zielwerte analysieren wir nach der Umsetzung. Erkenntnisse fliessen in die Weiterentwicklung ein. Stärken des Produkts betonen, Schwächen beseitigen wir.

Anhand von A/B-Tests messen wir die Reaktion der Nutzer auf neue Features und Inhalte. So lernen und verbessern wir kontinuierlich. Eine zentrale Voraussetzung für den Erfolg jedes Projekts.

Joinbox Terrasse
Yoda

Weiterentwicklung und Unterhalt

Weiterentwicklung

Selten endet ein Projekt mit dessen Veröffentlichung. Besonders, wenn wir mit dem Minimalumfang starten, ist die analysegestützte Weiterentwicklung erfolgsentscheidend. Unsere Applikationen passen wir laufend an neue Erkenntnisse, Technologien und Entwicklungen an. Damit sie jahrelang aktuell bleiben.

Unterhalt

Software braucht Pflege. In regelmässigen Abständen spielen wir Security-Updates ein, aktualisieren Komponenten, beheben Mängel. Grundlage dieser Arbeiten bildet in der Regel ein Service Level Agreement (SLA), das Reaktionszeiten verbindlich festlegt und Kosten pauschalisiert.

Töggelichaschte

Wir sind Spezialisten für Web- und Mobile-Applikationen, Websites und Online-Shops.

Applikationen

Applikationen sind kundenspezifische Software-Entwicklungen, sind Königsdisziplin: Apps für iOS oder Android, Portale und Plattformen, Business Tools oder Software-Anwendungen. Sie decken Funktionen ab, welche über einen Online-Shop oder eine Website hinausgehen. Wir starten am liebsten mit dem Minimalumfang, einem «Minimum Viable Product». Wir messen seinen Erfolg, lernen daraus und bauen die Applikation gestützt auf diese Erkenntnisse laufend aus. Das minimiert Risiken.

Erfolgsentscheidend ist, dass wir Ihre Bedürfnisse, Ideen und Vorstellungen kennen oder gemeinsam erarbeiten. Darauf gestützt legen wir in einem ersten Schritt eine klare Strategie fest und dokumentieren diese. In einer zweiten Phase gestalten wir die Applikation, in einer dritten setzen wir sie um – jeweils mit Kostendach und verbindlichem Zeitplan.

Applikationen basieren häufig auf einem Framework; wir verwenden primär node.js mit Distributed und Related, Sails und Express oder PHP mit Symfony.

Referenzen: E-Learning, Corporate Website und Business-Lösungen, Online Kinokalender, Kunden-Plattform «Emotions».

Wolken

Websites

Websites können Corporate Websites, Blogs, Microsites oder Landing Pages sein. Eine Website verfolgt einen Geschäftszweck: Sie soll Produkte verkaufen, über Dienstleistungen informieren, Ihre Markenbekanntheit steigern. Diese Ziele stehen bei uns immer im Zentrum: während der Konzeption, der Gestaltung und der Umsetzung. Und nach der Umsetzung messen und rapportieren wir, ob sie erreicht werden. Damit Sie jederzeit wissen, welchen Nutzen Ihnen die Website bringt.

Zentral ist, die Inhalte einer Website sinnvoll zu strukturieren, ihr eine klare Informationsarchitektur zu Grunde zu legen – gerne beraten wir Sie diesbezüglich. Damit diese Inhalte möglichst einfach erstellt und verändert werden können, basieren Websites in der Regel auf einem Content Management System (CMS), wir setzen dabei auf Drupal.

Referenzen: Hauser & Partner, Saia-Burgess Controls, Naturhistorisches Museum Bern, Winconcept, Swisscom SmartLife, Microsite «Mission Raumfahrt», Microsite «Media World».

Michael Rüfenacht, Raphael Marti, Tobias Kneubühler
Joinbox' Büro

Online-Shops

Ein Online-Shop soll Conversions (Abschlüsse) generieren. Das bedingt primär eine klare Strategie und Positionierung – dabei unterstützen wir Sie gern. Wir empfehlen, mit einer minimalen Lösung zu starten und diese laufend zu optimieren und erweitern. So senken Sie Geschäfts- und Kostenrisiken. So bleiben Sie nahe an den Kunden.

Zu einem Abschluss führen verschiedenste Wege – meistens sind es Umwege. Nur selten kauft ein Kunde beim ersten Besuch. Nachhaltige Kundenpflege (Newsletters, Social Media, Mailings, Remarketing) ist erfolgsentscheidend. Kunden in diesen Kreislauf zu bringen ist unser erstes Ziel. Sie zu Käufern zu machen das zweite.

Wir fokussieren auf eine hervorragende User Experience – der Shop muss einfach, klar und übersichtlich sein; eine Bestellung soll Freude bereiten. Je nach Anforderungen setzen wir dabei auf die E-Commerce-Lösungen von Drupal Commerce, Shopify, Symfony, oder Node.js.

Referenzen: Swisscom SmartLife, Kundenplattform für Cornèrcard.

Paket
Blüemli
Polizei Kanton Solothurn

Interaktive Präventions-Kampagne für Messen

  • Umsetzung
  • Weiterentwicklung

«Wir hatten eine Idee für eine interaktive Station an Messen, wussten aber nicht, wie wir das umsetzen sollten. Joinbox verstand von Anfang an, was wir wollten, hat uns kompetent beraten und lieferte eine einwandfreie technische Umsetzung. Alles hat tadellos funktioniert.»

Andreas Mock Leiter Kommunikation und Mediendienst, Polizei Kanton Solothurn
Regio Energie Solothurn
  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«Wir bestellten ein interaktives Spiel für eine Messe – und Joinbox lieferte gleichzeitig auch eine Web-Lösung. So erreichen wir ein viel breiteres Publikum als geplant. Damit hat Joinbox bei uns die maximale Punktzahl erreicht!»

Sandra Hungerbühler Leiterin Marketing + Kommunikation, Regio Energie Solothurn

Corporate-Website mit Drupal 8

  • Umsetzung
  • Weiterentwicklung

«Selten kommen so viele Ansprüche zusammen wie bei der eigenen Website. Dank der engen und professionellen Zusammenarbeit mit Joinbox konnten wir diese anspruchsvolle Aufgabe lösen.»

Chris Imfeld Creative Director, hauser & partner
Hauser & Partner
Post-Overlay
  • Konzept
  • Umsetzung

«Haben wir eine digitale Herausforderung, so löst sie Joinbox. Kreativ, enthusiastisch – und doch pragmatisch. Ich freue mich auf unser nächstes Projekt. Immer wieder.»

Carlo Badini CEO, Cleverclip GmbH
Schweizer Tourismus-Verband

Interaktive Visualisierung für Geschäftsbericht

  • Umsetzung

«Unsere Idee einer interaktiven Darstellung der Vernetzung des STV hat Joinbox informativ und gleichzeitig verspielt umgesetzt. Die interaktive Grafik lädt zum Entdecken ein und macht ein komplexes Thema unerwartet zugänglich.»

Marc Zenhäusern Art Director, Atelier Pol

Event-Plattform mit Online-Shop

  • Konzept (Produktentwicklung und Requirements Engineering)
  • Gestaltung
  • Umsetzung
  • Support und Weiterentwicklung

«Irgendwann kriegte Eventbooster aufgrund seiner Dimensionen den Übernamen ‹Mothership›. Das ist falsch. Es ist mehr eine Horde von kleinen, wendigen Battleships, die im Verbund mächtig sind.»

Michael van der Weg CTO Joinbox
Eventbooster

34 Web-Auftritte für Galenica

  • Konzept (Produktentwicklung und Requirements Engineering)
  • Gestaltung
  • Umsetzung
  • Schulung und Dokumentation
  • Support und Weiterentwicklung

«Was Joinbox auszeichnet: die Nähe. In geografischer, fachlicher und persönlicher Hinsicht.»

Katrin Brunner Leiterin Winconcept AG
Winconcept

Museums-Website mit Ticket-System

  • Umsetzung und Beratung
  • Schulung und Dokumentation
  • Support

«Joinbox hat unsere Qualitäten digital abgebildet: nmbe.ch ist lebendig, hochwertig, informativ.»

Simon Jäggi Leiter Kommunikation und Marketing, Naturhistorisches Museum der Burgergemeinde Bern
Naturhistorisches Museum Bern

E-Learning

  • Konzept (Produktentwicklung und Requirements Engineering)
  • Gestaltung
  • Umsetzung
  • Schulung und Dokumentation
  • Support und Weiterentwicklung

«Wow. Diese Herren haben Drive. Mich muss man begeistern – und das haben sie! Wie? Indem E-Learning nach kürzester Zeit einsatzbereit war – und sich genau richtig anfühlt»

Angelika Lanen CEO, The Body Shop Switzerland AG (bis Februar 2018)
E-Learning für The Body Shop

Corporate Website und Business-Lösungen

  • Produktentwicklung
  • Umsetzung
  • Dokumentation
  • Wartung und Support
  • laufende Weiterentwicklung

«Erfahrung, Kompetenz und Motivation – weil die Leute hinter Joinbox sehr eng mit ihren Kunden zusammenarbeiten, kommen diese drei Qualitäten bei jeder Idee zum Tragen.»

Markus von Holtey Head of Marketing & Communication EMEA, SBC
Saia-Burgess Controls
Infect

Applikation für Antibiotika-Resistenzen

  • Konzept
  • Gestaltung
  • Umsetzung
  • Hosting
  • Weiterentwicklung

«Innerhalb kurzer Zeit hat Joinbox ein Produkt gefertigt, das einen gewaltigen Fortschritt für die angewandte evidenzbasierte Medizin darstellen wird. Danke, Jungs!»

Dr. med. Pascal M. Frey INFECT
Kellenberger Management Consulting

Consulting-Website

  • Konzept
  • Gestaltung
  • Umsetzung

«Dank Joinbox ist unsere Website erfolgreich in der Zukunft angekommen. Joinbox zeigte eindrücklich, was mit einem ‹Change› an einer Website möglich ist.»

Karl Kellenberger Inhaber und CEO KMC
Omeris – Selbstbestimmt leben

Marketing-Seite «Selbstbestimmt leben»

  • Konzept
  • Umsetzung

«Die Zusammenarbeit mit Joinbox verlief getreu dem Motto von Omeris: ‹Viele kleinere, aber regelmässige Lebensfreuden sind wichtiger als einige wenige Höhepunkte›.»

Roland Gempeler Omeris AG, Leiter Region Olten
Mission Raumfahrt

Microsite «Mission Raumfahrt»

  • Konzept
  • Umsetzung
  • Unterhalt

«Bei der Gestaltung dieser Microsite für das Verkehrshaus haben wir nach den Sternen gegriffen. Die Erfahrung und Begeisterung von Joinbox haben das hochfliegende Projekt auf den Boden gebracht. Danke für die Punktlandung!»

Mathias Kälin Junior Art Director, WPS medienservice AG

Online-Kundenmagazin «Moments»

  • Konzept
  • Gestaltung
  • Umsetzung
  • Unterhalt

«Unser Kundenmagazin ‹Moments› erscheint dritteljährlich mit einer Auflage von 400'000 Exemplaren. Dank Joinbox gibt es dieses auch digital, nahtlos integriert in unsere bestehende Online-Plattform. Mille Grazie, Joinbox!»

Valeria Vignolini Business Analyst Cornèrcard
Cornèrcard Emotions Moments
Media World

Microsite «Media World»

  • Konzept
  • Umsetzung
  • Unterhalt

«‹Media World› ist eine interaktive Ausstellung des Verkehrsmuseums zur Mediennutzung. Die Umsetzung der zugehörigen Website durch Joinbox ist die perfekte Adaption auf das Medium Internet.»

Mathias Kälin Junior Art Director, WPS medienservice AG
Righetti & Partner

Marketing-Site für PR-Agentur

  • Konzept
  • Gestaltung
  • Umsetzung

«Kreation, Konzeption und Management sind bei Righetti & Partner eng miteinander vernetzt. Diese Triade im Web abzubilden, ist unmöglich – und Joinbox dennoch gelungen.»

Claudio Righetti Managing Owner Righetti & Partner

Online-Shop und Info-Seite «SmartLife»

  • Weiterentwicklung
  • Konzeption
  • Unterhalt

«Mit Joinbox haben wir nicht eine Agentur, sondern einen Partner gefunden. Ein Team, das uns kompetent berät und mit uns den Weg nach vorne geht.»

Kathrin Spatzier Marketing Manager Swisscom Smart Living
Swisscom SmartLife
Miss Schweiz
  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«Schönheit allein tut's nicht. Wie bei der Wahl zur ‹Miss Schweiz› zählen auch bei Webseiten innere Werte: Nutzerfreundlichkeit, Struktur, Übersichtlichkeit und Inhalt.»

Lauriane Sallin Miss Schweiz 2016
Pasito

Blog und Online-Shop für Mode

  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«Wo ein Wille ist, ist auch ein Weg. Allein für diese Einstellung liebe ich die Zusammenarbeit mit den Joinbox-Jungs. Sie wollen – und sie lösen: Kompetent, hartnäckig – und immer wieder auf überraschende Art und Weise.»

Janine Eichenberger Leiterin E-Commerce (bis Juli 2015), Pasito Switzerland

Online-Kinokalender

  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«Mit dem Kinokalender von Cornèrcard Emotions bieten wir unseren Kunden ein hilfreiches und benutzerfreundliches Tool zur Freizeitgestaltung.»

Beat Weidmann Head of Marketing Cornèrcard, Products & Services
  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung
  • Domain-Kauf

«Die Webseite von Luvé ist wie Haute-Couture, bis ins kleinste Detail durchdacht und mit Raffinesse verarbeitet.»

Claudio Righetti Managing Owner Righetti & Partner, Strategic Art Director Luvé
Hotel Grand Regina
  • Konzept
  • Texting
  • Bildrecherche
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«Was Joinbox einzigartig macht, ist, dass sie uns auf Augenhöhe begleiten: Persönlich, partnerschaftlich, engagiert, ehrlich.»

Tobias Reinhard Dipl. Arch. ETH / SIA, Nüesch Development

Kunden-Plattform «Emotions»

  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung
  • Hosting

«Das Joinbox-Team begleitet uns nicht nur, es unterstützt und inspiriert uns auch. Die Crew denkt mit.»

Manuel Leclerc Supervisor Cornèrcard New Media, Channel & Service
IP Suisse Drag'n'Drop Game
  • Konzept
  • Gestaltung
  • Umsetzung
  • Hosting

«Joinbox bietet uns Gestaltung, Umsetzung und Support vor Ort aus einer Hand: ein gewaltiger Vorteil für Software, welche an Messen eingesetzt wird und einfach funktionieren muss.»

Liliane Herzog Inhaberin, Atelier Herzog AG
Quiz für die AZ Medien
  • Konzept
  • Gestaltung
  • Umsetzung
  • Hosting

«Messen werden zunehmend digital und interaktiv. Mit Joinbox haben wir einen Partner an unserer Seite, der Wissen, Enthusiasmus und die erforderliche Kreativität für die Umsetzung unserer mutigen Ausstellungskonzepte einbringt.»

Liliane Herzog Inhaberin, Atelier Herzog AG
Events.ch

Event-Agenda und Ticket-Shop

  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«events.ch war 2012 eines unserer ersten Agentur-Projekte – eine schweizweite Agenda für Anlässe aller Art. 2017 haben wir events.ch als Mandant in die Eventbooster-Plattform integriert.»

Michael van der Weg CTO, Joinbox
TOASTED.
  • Logo
  • Konzept
  • Gestaltung
  • Umsetzung
  • Weiterentwicklung

«Der Beitrag von Joinbox ist Grundlage für unsere kontinuierlichen Weiter- und Neuentwicklungen.»

Philipp Bareth CEO Toasted
  • Idee
  • Konzept
  • Gestaltung
  • Umsetzung

«Joinbox vereint Facebook, E-Mails und News. Joinbox entstand aus dem Bedürfnis heraus, gängige Online-Nachrichten an einem Ort zusammenzufassen.»

Netzwoche 31.01.2014
Joinbox-App
  • Produkt
    Das «Remake» der grössten Schweizer Event-Plattform
    Zu Eventbooster
  • Aufgaben
    Konzept (Produktentwicklung und Requirements Engineering), Gestaltung, Umsetzung, Support und Weiterentwicklung.
  • Technologien
    Backend: Node.js mit eigenem API-first und Microservice-basiertem Framework, PostgreSQL, Amazon AWS
    Frontend: AngularJS, Polymer, HTML5, CSS3
  • Umfang
    über 30 Mio. Event-Versionen, 450 Datenbanktabellen, über 400 API-Endpunkte, 25 Microservices
Eventbooster

Über Eventbooster

Eventbooster ist mit 30'000 zukünftigen Anlässen – von Konzert über Ausstellung bis Markt – die wichtigste Event-Datenbank der Schweiz. Erfasst werden die Anlässe durch Veranstalter (über eventbooster.ch) und durch eine Berliner Redaktion, ausgegeben werden sie über verschiedenste Schweizer Medien in Form von Werbebuchungen, Eventkalender und vorgefertigten Layouts für die Presse.

2013 entschied sich die Eventbooster AG für ein komplettes «Remake» der Plattform: Neue Technologie, neue Funktionen, neues Design. Während fünf Jahren haben wir Eventbooster Stück um Stück erneuert, erweitert und letztlich ersetzt.

Aus alt mach Zukunft

Es ist deutlich aufwändiger, ein bestehendes System zu ersetzen, als etwas Neues zu erschaffen: Die Software muss nicht nur alle Funktionen der bisherigen Lösung aufweisen, Kunden erwarten zusätzlichen Mehrwert. Und: Man kann dabei nicht klein starten und schrittweise erweitern – es braucht ein «Big Bang»-Release.

Das bedingt vorausschauende Planung und unablässige Koordination. Bei Eventbooster

  • erschafften wir ein gemeinsames Verständnis der Anforderungen. Wir erarbeiteten sie anhand von Workshops und hielten sie in einer funktionalen Spezifikation, in Diagrammen und Wireframes fest.
  • testeten wir Schnittstellen und zentrale Bestandteile mittels Unit- und Integration-Tests automatisiert. Damit erhöhten wir die Qualität und reduzierten Nebenwirkungen bei Code-Anpassungen.
  • setzten wir auf offene und standardisierte Schnittstellen (REST-API); dadurch konnten wir das User-Interface komplett von der serverseitigen Logik trennen. Das verbessert die Wartbarkeit.

User Interface Porn

Der frühere Eventbooster und damit seine Nutzeroberfläche waren 15-jährig, als wir den Ersatz in Angriff nahmen. Seither hat sich viel getan – viel Gutes. Wir haben die relevanten Interaktionen von Grund auf neu konzipiert, uns ganz vom Alten gelöst und das User Interface so gestaltet, wie wir es selber gerne brauchen würden.

Eventbooster bis 2018
Eventbooster ab 2018
Felix Steiner

«User Experience ist nicht die Farbe eines Buttons. Sie hat nicht hübsches Aussehen, sondern das korrekte Funktionieren zum Ziel.

Wir starten mit primitivsten grafischen Darstellungen, mit Filzstift, mit schwarzen Linien und grossen Flächen. Erst ganz spät legen wir die ‹farbige Maske› darüber. So bleibt der Fokus lange bei der Funktionsweise und den Interaktionen – und wurde nicht vom Aussehen gestört.»

Felix Steiner CEO Joinbox

Mother Ship vs Battle Ships

Eventbooster ist mehr als eine Website: Es ist eine Plattform, auf welcher diverse Applikationen laufen: events.ch, Cornèrcard Emotions, eine Schnittstelle für Datenbezüger wie Partyguide, Züritipp oder Ron Orp, eine Event-Suche für die Post, Eventbooster selber, ein Redaktionstool, Exports für Print-Layouts, ein Import von Kinodaten und einer Kulturagenda – «it’s fucking huge».

Das braucht die richtige System-Architektur. Und gute Architektur braucht einen Stararchitekten. Den haben wir. Weil 2013 die richtigen Tools fehlten, entwickelten wir für dieses Projekt das Microservice-basierte Framework «distributed» und den Datenbank-Mapper «related» (https://www.npmjs.com/package/related).

Mother Ship vs Battle Ships
Michael van der Weg

«Irgendwann kriegte Eventbooster aufgrund seiner Dimensionen den Übernamen ‹Mothership›. Das ist falsch. Es ist mehr eine Horde von kleinen, wendigen Battleships, die im Verbund mächtig sind:

Microservices mit klar definierten Zuständigkeiten, die über saubere Schnittstellen miteinander kommunizieren und damit eine skalier- und wartbare Applikation bilden.»

Michael van der Weg CTO Joinbox

Masseneinwanderung

Bei Eventbooster mussten wir rund 12 Millionen Datensätze von der alten auf die neue Applikation übertragen. Diese Daten – Nutzer, Anlässe, Künstler, Veranstaltungsorte etc. – hatten komplexe Abhängigkeiten untereinander und eine veraltete Struktur.

Der erste Testimport dauerte deswegen sechs Tage – während dieser Zeit hätte die Plattform offline sein müssen. Ein No-Go für alle Betroffenen. Optimierungen am Importer (Multi-Threading, Asynchronität und Parallel Processing) haben die benötigte Zeit um 93% reduziert.

Masseneinwanderung
Architektur der Datenimport-Applikation
  • Produkt
    Websites und Extranet für Winconcept, Feelgood’s und 30 Apotheken
    Zu Winconcept Zu Feelgood's
  • Aufgaben
    Konzept (Produktentwicklung und Requirements Engineering), Gestaltung, Umsetzung, Schulung und Dokumentation, Support und Weiterentwicklung.
  • Technologien
    Backend: WordPress Multisite Setup
    Frontend: HTML5, CSS3, Web Components
  • Partner
    comotive GmbH
Winconcept

Über Winconcept

Winconcept ist eine Gruppierung von über 160 selbstständigen Apotheken unter dem Label «Feelgood's» und gehört zur Galenica-Gruppe. Die bisherigen Websites basierten auf einem Agentur-CMS und waren auf Smartphones kaum zu bedienen. Sie brauchten eine Gesamtüberholung: Neue Gestaltung, neues CMS, «Mobile first» – doch das Bewährte sollte bleiben.

1 Extranet, 2 Marken, 30 Apotheken – ein CMS

Apothekenpartner können bei Winconcept das Paket «Internetauftritt» beziehen. Möglich macht dies ein Multi-Site-Setup mit WordPress: Damit werden winconcept.ch, feelgoods-apotheken.ch, das Extranet und alle 30 Apotheken-Seiten auf einer einzigen CMS-Installation betreiben. Die Vorteile? Neue Apotheken-Auftritte sind mit wenigen Klicks angelegt; das Hosting ist günstig; und Software- und Design-Updates können zentral veröffentlicht werden, das reduziert die Unterhaltskosten.

Wordpress Multisite Setup

Eine sanfte Renovation

«Bewährtes soll bleiben, darf aber besser werden»: Eine Vorgabe für das Redesign. Anhand von zwei Workshops erarbeiteten wir mit Winconcept ein «Digitales Massnahme- und Marketingmodell», kurz «D3M». In einem ersten Schritt definierten wir, welche Geschäftsziele die Seite erreichen soll, in einem zweiten legten wir die zugehörigen Massnahmen fest. Und erst im dritten Schritt bestimmten wir die Umsetzung.

Ein Beispiel:

  • Geschäftsziel: Mehr Besucher in den Apotheken (Reichweite erhöhen).
  • Massnahme: Sichtbarkeit der Apothekenpartner auf feelgoods.ch verbessern.
  • Umsetzung: Auf der Frontseite von feelgoods.ch einen Button «Apotheken in meiner Nähe» aufnehmen. Mit nur einem Klick findet der Nutzer die nächstgelegene Apotheke.
Digitales Massnahmemodell
Katrin Brunner

«Was Joinbox auszeichnet: die Nähe. In geografischer, fachlicher und persönlicher Hinsicht.

Winconcept und Joinbox sind beide in Bern zuhause, das vereinfacht die Kommunikation. Sie sind Meister ihres Fachs, verstehen unsere Bedürfnisse und stellen den Kunden ins Zentrum. Das schafft Vertrauen – die perfekte Grundlage für unsere Zusammenarbeit.»

Katrin Brunner Leiterin Winconcept AG

Selbstständige Auftritte

Winconcept ist eine Gruppierung selbstständiger Apotheken. Diese Selbstständigkeit ist auch Motto bei ihren Internet-Auftritten: Sie entscheiden frei, welche Inhalte sie veröffentlichen und pflegen diese eigenständig ein. Mehr noch: Die Apotheken haben Gestaltungsfreiheit, legen Logo und Farbschema ihrer Websites selber fest. Und damit sie nicht alle Inhalte manuell erstellen müssen, können sie auch vorgefertigte Blöcke von Winconcept einbinden.

Winconcept – Customization
Jocelyne Caille

«Mit Joinbox haben wir einen Partner gefunden, der uns begleitet, berät und inspiriert. Und der uns bei Fragen hilfsbereit und kompetent zur Seite steht.»

Jocelyne Caille Product Manager Dienstleistungen

Exklusive Inhalte für Apothekenpartner

Winconcept hat über 160 Apothekenpartner. Sie sind selbstständig, sollen aber laufend informiert werden und Material für Schulungen, Marketing und Administration beziehen können. Deswegen verfügt die Website über ein Extranet: einen Login-geschützten Bereich, über welchen jede Apotheke personalisierte Informationen und Dokumente beziehen kann.

Feelgood's Extranet
Naturhistorisches Museum der Burgergemeinde Bern

Über das Naturhistorische Museum Bern

Das NMBE ist das älteste Museum Berns – und seit es sich unter dem Label «Hilfe, es lebt!» zur nächtlichen Ausgehstätte mauserte, auch irgendwie das jüngste. Der Web-Auftritt muss das reflektieren: glaubwürdig sein und mutig. In den Worten des Kunden: «Wir wollen die attraktivste Webseite der Berner Museumslandschaft.»

Freiheit der Redaktion!

Die beste Agentur ist jene, welche sich überflüssig macht. Deswegen steckt hinter nmbe.ch das Content-Management-System (CMS) Drupal 8. Es gibt der NMBE-Redaktion Macht und Freiheit: Sie kann aus vordefinierten Seitentypen (Anlass, News, Dossier) wählen und diesen beliebig Blöcke (Slideshow, Call-To-Action-Button, Social Media Feed, Liste mit verwandten Inhalten) zuordnen. Freiheit bedeutet Verantwortung, nur nicht hier: Weil die Gestaltung der Blöcke aufeinander abgestimmt ist, können sie ganz beliebig kombiniert werden.

Naturhistorisches Museum – Frontend Blöcke

Mehr Freiheit!

Bei gewissen Seiten kann die Redaktion auch die Gestaltung (z.B. Farbgebung) selber bestimmen und damit eigenständige Microsites für Webekampagnen, Ausstellungen und Anlässe erstellen.

Naturhistorisches Museum Bern – Customization
Simon Jäggi

«Joinbox hat unsere Qualitäten digital abgebildet: nmbe.ch ist lebendig, hochwertig, informativ.

Die Seite lädt zum Entdecken ein, wartet mit Finessen und Überraschungen auf – und stellt den Besucher konsequent ins Zentrum.»

Simon Jäggi Leiter Kommunikation und Marketing, Naturhistorisches Museum der Burgergemeinde Bern

Lebendige Exponate: unsere Pattern-Library

Skop – unsere Freunde von nebenan – haben nmbe.ch gestaltet und dabei einen wegweisenden Schritt gewagt: Sie haben nicht wie üblich Seiten entworfen, sondern einzelne Elemente (Buttons, Formularelemente, Titel, Bilder) und diese zu Blöcken (Slideshows, Listen, Formularen) kombiniert. Erst aus deren Zusammenspiel entstehen Seiten. Der Aufbau folgt dem Muster von «Atomic Design». Bei der Umsetzung fassten wir die Elemente und Blöcke in einer wiederverwendbaren Bibliothek, einer «Pattern Library» zusammen. Und wir sind begeistert davon: Das User-Interface wird erweiterbar, seine Bestandteile sind einheitlicher, die Qualität steigt. Grössere Projekte würden wir nicht mehr anders angehen.

Selina Strössler

«Ich mag Drupal. Und Joinbox.

Ihrer Flexibilität wegen: Dank Drupal kann ich unsere multimedialen Inhalte in der passenden Form veröffentlichen. Und stosse ich dabei an Grenzen, steht mir Joinbox jederzeit zur Seite.»

Selina Strössler Verantwortliche Content (bis März 2018), Naturhistorisches Museum der Burgergemeinde Bern

Digitales Museumsbier

Das NMBE ist ein lebendiges Museum, Veranstaltungen – Konzerte, Führungen, Museumsbier – sind Kernbestandteil. Bisher wurden diese mit Telefon, Excel-Listen und Kugelschreiber organisiert. Im Rahmen der Neugestaltung haben wir sie digitalisiert: Auf nmbe.ch erfassen Angestellte Veranstaltungen, Besucher buchen Tickets, Verantwortliche haben Einblick in die Teilnehmerliste, alles in Echtzeit. Drupal 8 basiert auf dem PHP-Framework Symfony und ist damit geschaffen für benutzerspezifische Software-Entwicklung und für die Digitalisierung von Geschäftsprozessen.

Animiert, suchmaschinenoptimiert, responsive

Eigentlich selbstverständlich: Drupal 8 bietet die perfekten Voraussetzungen für Suchmaschinenoptimierung (SEO), und diese haben wir beim NMBE ausgereizt. Auch ist die Seite komplett responsive, passt sich also an alle Bildschirmgrössen und Eingabemethoden an. Feine Animationen erwecken sie zu Leben. Und nmbe.ch ist auf Geschwindigkeit getrimmt: Weil kurze Distanzen auch kurze Warte- und Ladezeiten bedeuten, hosten wir in der Schweiz, das Caching ist stark optimiert. Und wir entwickeln und veröffentlichen in einem Docker-Container.

  • Produkt
    E-Learning-Plattform für The Body Shop Switzerland. Von Grund auf und individuell für 226 Mitarbeiterinnen konzipiert und entwickelt.
  • Aufgaben
    Konzept (Produktentwicklung und Requirements Engineering), Gestaltung, Umsetzung, Schulung und Dokumentation, Support und Weiterentwicklung.
  • Technologien
    Backend: Symfony, PHP und MySQL
    Frontend: HTML5, CSS3, Web Components/Custom Elements über ES2015
The Body Shop

Über The Body Shop

The Body Shop, gegründet 1976 in England, wird in der Schweiz durch die Coop-Gruppe als Franchise betrieben. The Body Shop steht für Nachhaltigkeit, Tierschutz und Menschenrechte. An den «Best of Swiss Web»-Awards wurde E-Learning in der Kategorie «Mobile» mit Bronze ausgezeichnet.

Den Fax ablösen ...

The Body Shop hat in der Schweiz rund 226 Mitarbeiterinnen. Sie sind verteilt auf 49 Filialen, die meisten arbeiten Teilzeit. Es ist der Anspruch von The Body Shop, dass diese Mitarbeiterinnen von neuen Produkten, Markenwerten und Verkaufsstrategien erfahren, dass sie auf dem Laufenden bleiben und regelmässig geschult werden. Bisher geschah dies über Newsletters, welche in die einzelnen Filialen gefaxt wurden.

... und die App einführen

Bis wir diesen Prozess im Mai 2017 digitalisierten und The Body Shop E-Learning einführten. Damit werden die Inhalte nicht nur über das Web ausgeliefert (und Kosten gesenkt), wir nutzen auch andere Mehrwerte dieses Kanals:

  • Anhand von Fragen und Antworten kann jede Mitarbeiterin den eigenen Lernfortschritt messen und über einfache Statistiken auswerten.
  • Richtig beantwortete Fragen, Besuche und abgeschlossene Kurse geben Punkte. Mit diesen erstellen wir eine Filialen-Rangliste – The Body Shop E-Learning ist damit auch ein (kleines) Social Network.
  • Das Head Office und die Filialleiterinnen können detaillierte Statistiken zu Filialen, Nutzern und Kursen einsehen, die Inhalte so dem Nutzerverhalten anpassen und zu besseren Resultaten animieren.
  • Statische inhalte werden interaktiv und multimedial – Video, Bild und Text werden kombiniert und ergänzen sich gegenseitig.
Angelika Lanen

«Wow. Diese Herren haben Drive. Mich muss man begeistern – und das haben sie!

Wie? Indem sie meine Anforderungen innert Wochenfrist zu einem täuschend echten Prototypen machten. Indem sie diesen um eigene Ideen ergänzten. Indem E-Learning nach kürzester Zeit einsatzbereit war – und sich genau richtig anfühlt.»

Angelika Lanen CEO, The Body Shop Switzerland AG (bis Februar 2018)

Rapid Prototyping

Zägg-zägg-zägg – The Body Shop E-Learning war Produktentwicklung par excellence: Eng mit dem Kunden zusammen, rasch und mit einem erreichbaren Ziel vor Augen.

  • Start: Briefing durch den Kunden
  • Nach 2 Wochen: Präsentation der Lösung durch Joinbox anhand von «Clickable Prototypes»
  • Nach 3 Wochen: Offerte und Timeline
  • Nach 4 Wochen: Freigabe des Auftrags
  • Nach 3 Monaten: Erster Prototyp für den Kunden, User-Testing durch die Filialleiterinnen
  • Nach 4 Monaten: Einpflegen der Inhalte
  • Nach 6 Monaten: Veröffentlichung

Der sinnvolle Minimalumfang, der Einsatz von klickbaren Prototypen und der frühe Einbezug der Nutzerinnen machten das Einhalten von Budget und Zeitplan einfach. Und wurde, ganz neu für uns, an der jährlichen Tagung der Filialleiterinnen mit Applaus und Yeah-Rufen bestätigt. Dafür danken wir herzlichst!

Präsentation der Lösung durch Joinbox anhand von «Clickable Prototypes»
Simon Kortekaas

«Joinbox ist ehrlich: Wenn ihnen etwas zu weit geht, dann sagen sie das auch.

Und Joinbox ist kreativ: Wenn etwas fehlt, dann haben sie eine Lösung bereit. Das Resultat dieser beiden Eigenschaften sieht man in The Body Shop E-Learning – und davon sind wir begeistert.»

Simon Kortekaas Head of HR & Training, The Body Shop Switzerland

Nutzerinnennah

Der durchschnittliche Nutzer von The Body Shop E-Learning ist eine Nutzerin, zwischen 30- und 40-jährig, arbeitet Teilzeit in einer Filiale, spricht eine der drei Landessprachen. Hat während der Arbeit immer wieder kurze kundenfreie Pausen, nutzt das Smartphone deutlich häufiger als ein Tablet oder einen Computer.

Diesen Vorgaben entspricht unser Produkt: Es ist ausgelegt auf Smartphones (Lesbarkeit, Ladezeiten, Layout), Arbeitszeiten (kurze Kurse für kurze Pausen) und Arbeitsweise (Motivation durch Quiz und Wettbewerb). Das schätzen Nutzerinnen wie Experten: Die Bronzemedaille in der Kategorie «Mobile» bei den «Best of Swiss Web»-Awards freut uns gewaltig.

Um das zu erreichen, haben wir kein bestehendes Learning-Management-System (LMS) verwendet, sondern mit Symfony auf ein abstraktes Framework gesetzt. Damit sind auch die Möglichkeiten für kommende Weiterentwicklungen unbegrenzt.

Moodle (LMS)
The Body Shop E-Learning

Sexy E-Learning

Lernen hat diesen Beigeschmack von Zwang. Auch The Body Shop E-Learning ist Pflicht für die Mitarbeiterinnen – aber eine Pflicht, der man gern und freiwillig nachgeht.

Durch ein Quiz im Stil von «Wer wird Millionär?» und das Antreten der Filialen gegeneinander wird Lernen zur spielerischen Herausforderung. «Gamification» nennen wir das.

Das Quiz ist mehr als ein Spiel: Es ist ein Instrument für Filialleiterinnen und das Head Office, den Lernfortschritt der Mitarbeiterinnen zu verfolgen, sie zu motivieren und individuell zu fördern.

  • Produkt
    Corporate Website und diverse Applikationen für Saia Burgess Controls.
    Zur Website
  • Aufgaben
    Konzept, Design, Umsetzung, Weiterentwicklung
  • Technologien
    Backend: Node.js mit Loopback-Framework von IBM, MongoDB, PostgreSQL.
    Frontend: HTML5, CSS3, JavaScript/ES7, W3C Custom Elements, AngularJS.
  • Partner
    Design: Leuzinger + Partner
    TYPO3: Netcase
Saia Burgess Controls

Über Saia Burgess Controls

Saia-Burgess Controls AG mit Sitz in Murten fertigt Komponenten für Gebäudeautomation. Dank schlanken Produktionsmethoden und gelebter Lean-Kultur – agilen Ansätzen wie wir sie auch verfolgen – ist der Schweizer Produktionsstandort kompetitiv. Und erfolgreich: Der Jahresumsatz beläuft sich auf rund CHF 90 Mio.; das Unternehmen hat 250 Mitarbeiter, besteht seit 1920 und wurde 2012 vom Honeywell-Konzern übernommen. Die Produkte zeichnen Innovation und Qualität, offene Schnittstellen und eine extreme Langlebigkeit von bis zu 25 Jahren aus.

Saia-Burgess Controls in Murten

Unternehmenswebsite mit Mehrwerten

SBC haben wir nicht von Grund auf entwickelt, sondern im Kindesalter – kurz nach dem Release – übernommen von Netcase. Kinder haben Kinderkrankheiten. Diese behoben wir im ersten Halbjahr. Seither widmen wir uns der Wartung und insbesondere der Weiterentwicklung.

Websites verfolgen keinen Selbstzweck. So ist die Website von SBC auch dazu da, Prozesse zu optimieren, Kunden zu gewinnen, Supportanfragen zu reduzieren. Um diese vielschichtigen Anforderungen abzudecken, setzt SBC auf TYPO3 (als Content-Management-System für die Marketing-Seite) und IBM Loopback (als Framework für die Applikationen). Beide Teile spielen nahtlos zusammen – Besucher bemerken die Trennung nicht.

Markus von Holtey

«Erfahrung, Kompetenz und Motivation – weil die Leute hinter Joinbox sehr eng mit ihren Kunden zusammenarbeiten, kommen diese drei Qualitäten bei jedem unserer gemeinsamen Projekte zum Tragen.

Die Lösungen, welche daraus entstehen, funktionieren. Und aus einer Idee wird so schnell eine nachhaltige, intuitive und überzeugende Web-Anwendung.»

Markus von Holtey Head of Marketing & Communication EMEA, SBC

Exkurs: Micro-Services

Wie bei anderen Projekten auch, setzen wir bei SBC auf Micro-Services – kleine Softwarekomponenten mit einer beschränkten, klar definierten Zuständigkeit und gut dokumentierten, getesteten und öffentlichen Schnittstellen. Über diese Schnittstellen kommunizieren die Komponenten untereinander. Diese strikte Unterteilung von Software in Komponenten bedingt eine saubere Planung und zwingt zu sauberer Arbeitsweise. Und bringt weitere Vorteile mit sich: Weniger manueller Testaufwand, Wartbarkeit, Erweiterbarkeit, Wiederverwendbarkeit; Software mit Zukunft.

Kurz: Micro-Services sind für uns eine notwendige Voraussetzung für ein Projekt dieser Grösse geworden.

Microservice-Architecutre
Michael van der Weg

«Jede Software-Anpassung – sei’s ein Bugfix oder die Entwicklung eines neuen Features – kann Side-Effects haben: ungewollte Veränderungen an einem anderen Ort. Grosse Projekte wie SBC funktionieren nur, wenn wir diese Side-Effects minimieren.

Anders ist eine Weiterentwicklung nicht möglich. Automatisch getestete und gut dokumentierte Micro-Services spielen dabei die zentrale Rolle.»

Michael van der Weg CTO Joinbox

Herausforderung Lebensdauer

Die avisierte Lebensdauer der SBC-Website ist zwar geringer als jene der SBC-Produkte, soll aber im Backend bei gut 10 Jahren liegen. Für Software ein beachtliches Alter. Dieses erreichen wir, indem wir

  • auf junge, doch erprobte Open-Source-Technologien mit einer starken Community setzen (Node.js, IBM Loopback),
  • neue technologische und architektonische Entwicklungen (z.B. Micro Services) berücksichtigen und unseren Code laufend aktualisieren,
  • nicht den schnellsten, sondern den abstrakteren und nachhaltigen Weg wählen,
  • jede neue Funktion im Vorfeld hinterfragen, sauber planen und dabei die Auswirkungen auf das ganze System berücksichtigen und
  • jede Anforderung und die gewählte Lösung laufend dokumentieren und begründen.
Lorenzo Kappeler

«Bei Joinbox fliesst viel Zeit und Energie in die Produktentwicklung, bevor mit der eigentlichen technischen Umsetzung begonnen wird. Das ermöglicht uns, Software nachhaltig aufzubauen und schafft Planbarkeit: für den Kunden, für Joinbox und für mich als Entwickler.

Gleichzeitig haben wir einen klaren Weg definiert, um die Softwarequalität und ihre Lebensdauer hoch zu halten: mit automatischem Testing, Micro-Services und disziplinierter Dokumentation.»

Lorenzo Kappeler Backend-Entwickler, Joinbox

«Am Anfang war das Gespräch.»

Um eine Website oder eine Applikation zu entwickeln, muss man das Geschäft dahinter verstehen: das Problem, das man lösen soll; und auch die aktuelle Lösung und deren Schwachstellen und Stärken.

Jede Neuentwicklung beginnt deswegen mit einem Gespräch. Mit allen Beteiligten. Mit unzähligen Fragen. Mit mehr Fragen und Rückfragen.

Darauf denken wir eine Lösung an, halten diese fest. Bereinigen sie intern und vereinfachen sie – berücksichtigen dabei Machbarkeit, Aufwand und andere Anforderungen. Diskutieren sie mit dem Kunden. Und bereinigen wieder. Bis das Problem eine konkrete Lösung hat, nachhaltig und intuitiv. Erst danach setzen wir um.

Diese intensive Vorbereitung braucht Zeit – wir sparen aber ein Vielfaches davon ein, indem die Fragen, weiteren Fragen und Rückfragen nicht während der Umsetzung aufkommen. Oder noch schlimmer: erst danach.

Kan-bang!

SBC produziert in Murten. Schweizer Standort und trotzdem kompetitiv. Wie das? Dank schlanker Arbeitsweisen. Englisch: Lean Methodologies. Konkret: Just-in-Time-Produktion mittels Kanban. Erstaunlich: Wir setzen auf die gleichen Methoden – Kanban, schlanke Pipelines, kurze Produktzyklen.

Was heisst das? Wenn wir ein Projekt umsetzen, unterteilen wir dieses in kleine Aufgaben. Jede Aufgabe durchläuft einen Zyklus: Idee, Produktentwicklung, Review, Umsetzung, Review, Testing, Abnahme, Dokumentation, Release. In jedem dieser Schritte kann sich nur eine beschränkte Anzahl an Aufgaben befinden; innerhalb jedes Schritts werden die Aufgaben priorisiert. Die jeweils wichtigste wird erledigt und wechselt darauf zum nächsten Schritt; die wichtigste Aufgabe aus aus dem vorangehenden Schritt rutscht nach. Dieses einfache System visualisieren wir anhand von Kanban-Boards. Ein explosives Gemisch. Kan-bang.

Raphael Marti

«Kompetitiv trotz Schweizer Produktion – dank schlanker Arbeitsweise. Verschiedene Wirtschaftszweige, gleiche Grundlagen. Auch das verbindet SBC mit Joinbox. Ein perfekter Match.»

Raphael Marti Projektleiter SBC, Joinbox
  • Produkt
    Online-Shop und Website für Swisscom SmartLife, das Überwachungs- und Steuerungs-System der Swisscom für jedes Zuhause.
  • Aufgaben
    Weiterentwicklung, Konzeption und Unterhalt
  • Technologien
    Backend: WordPress und WooCommerce
    Hosting: Safe Swiss Cloud
    Frontend: HTML5, CSS3 und Plain Ol’JavaScript. Google Tag Manager und Custom Metrics für Google Analytics.
Swisscom SmartLife

Über Swisscom SmartLife

Die Zukunft gehört der Home-Automation – dem Steuern und Überwachen von Gebäuden aus Distanz oder von selbst. Dass Home-Automation nicht bloss Zukunfts*musik* ist, beweist SmartLife von Swisscom: Eine greifbare Lösung zur Überwachung und Fernsteuerung des eigenen Zuhause per Smartphone-App. Über eine Zentrale werden Kamera, Steckdosen, Bewegungs- und Rauchmelder, Temperatur- und Wassersensor mit dem Internet und dadurch mit der SmartLife-App verbunden. Das Zuhause ist, wo das Smartphone ist.

Kathrin Spatzier

«Mit Joinbox haben wir einen kompetenten und greifbaren Partner für die Weiterentwicklung der SmartLife-Plattform gefunden.

Die Entscheidungswege sind kurz, die Zusammenarbeit angenehm unkompliziert. Das Resultat? Überzeugende Lösungen und Freude am gemeinsamen Weg dahin.»

Kathrin Spatzier Marketing Manager Swisscom Smart Living

Conversions ftw!

Eine Anzeigenkampagne ist nur so gut, wie die Landing-Page, auf welche sie führt. Gelingt es dieser Seite nicht, die Nutzer zu informieren, zu fesseln, zu konvertieren – stoppen Sie die Kampagne, Sie verschwenden Geld.

Im Gegenzug ist eine gute Landing-Page Gold und Diamanten wert. Wenn sie die Nutzer dazu bringt anzurufen, zu bestellen, eine E-Mail-Adresse zu hinterlassen, ein Beratungsgespräch anzufordern, einen Newsletter zu abonnieren, Fan zu werden – dann wird sie ein zentraler Treiber Ihres Geschäftserfolgs.

Anzeigenkampagnen – Google AdWords, Facebook, Schweizer Display-Netzwerke – sind ein wichtiges Standbein der Werbestrategie von Swisscom SmartLife. Optimierte Landing-Pages sind deswegen Pflicht und unsere Kür.

Derya Kilic

«Unsere Web-Projekte setzen wir gemeinsam mit Joinbox um. So kommt unser Produkt-Wissen mit der User-Experience- und Technologie-Erfahrung von Joinbox zusammen.

Diese Partnerschaft führt zu nachhaltigen Lösungen, welche SmartLife weiterbringen.»

Derya Kilic Jr. Marketing Manager Swisscom Smart Living

Schneller ist besser. Wirklich

Der bei WordPress verwendete Page-Builder steht schnellen Ladezeiten der SmartLife-Website etwas entgegen. Und langsame Ladezeiten hindern den Erfolg einer Website. Soweit dies möglich war, haben wir deswegen die Geschwindigkeit der Seite bei der Projektübernahme verbessert und Caches eingebaut, die Anzahl verwendeter Schriften reduziert, Dateien zusammengefügt und komprimiert, Slideshows eine fixe Höhe gegeben, Bilder auf die jeweilige Gerätegrösse optimiert.

Ladegeschwindigkeit nach Optimierungen
Ladegeschwindigkeit vor Optimierungen

Messbare Resultate

Es ist der Anspruch von Joinbox, den Nutzern nicht nur hervorragende, sondern messbare Resultate zu liefern. Dazu braucht’s vor allem gute Daten. Kaum ein Web-Analytics-Tool misst die «Time on Site» korrekt und rasch stossen diese Werkzeuge bei Websites, die aus wenigen und langen Seiten bestehen (sogenannte «One-Pager») an ihre Grenze. Da sie sich aber bestens erweitern lassen, führten wir für Swisscom SmartLife zwei «Custom Metrics» für die Frontseite ein, um detailliertere Einblicke in das Nutzerverhalten zu gewinnen: Die eine misst die «True Time on Site» (die effektive Zeit, die ein Nutzer auf der Seite verbringt), die andere die «Scroll Depth» (wie weit ein Nutzer auf der Seite nach unten scrollt). Die Auswirkung von Änderungen an der Frontseite können zukünftig einfach und präzis gemessen werden. Ob eine Massnahme erfolgreich ist, bestimmt sich nicht mehr nach Gefühl – sondern nach Zahlen und damit nach dem Verhalten der Nutzer. Inversion of Control, Demokratie 3.0.

var arrivedOnSite 		= new Date().getTime()
	, timeAway 			= 0
	, timeLeftPage;

// Stop tracking «true time on site» if tab is hidden
window.addEventListener( 'visibilitychange', function() {

	// Store time user left page
	if( document.hidden ) {
		timeLeftPage = new Date().getTime();
	}
	else {

		// User leaving page was not recorded
		if( !timeLeftPage ) {
			return;
		}

		timeAway += new Date().getTime() - timeLeftPage;
		timeLeftPage = undefined;

	}

} );
  • Produkt
    Eine Website, über welche Cornèrcard-Kunden von exklusiven Event-Angeboten profitieren können: vergünstigte Tickets, Verlosungen, «Meet and Greet»-Veranstaltungen, VIP-Anlässe. Gleichzeitig ein schweizweiter Event-Kalender mit über 30’000 Einträgen.
    Zur Plattform
  • Aufgaben
    Konzept, Design, Umsetzung, Weiterentwicklung, Hosting
  • Technologien
    Backend: Mandantenfähige EventBooster-Architektur, basiert auf node.js, distributed, related und PostgreSQL
    Hosting: Amazon Web Services
    Frontend: angular.js, Bootstrap, HTML5 und CSS3
  • Partner
    EventBooster AG (Konzept, Daten, Support)

Über Cornèr Bank AG/Cornèrcard

Cornèrcard, eine Division der Cornèr Bank AG, gehört zu den Pionieren auf dem Schweizer Zahlungskartenmarkt. Als Herausgeberin von Visa, MasterCard und Diners Club Karten bietet sie ihren Kunden eine breite Palette von Produkten und Dienstleistungen an, die auf neusten Technologien beruhen.

Mobile Web Application

«Mobile First»: Tönt gut – ist’s aber nicht. Nicht immer.

Wenn ein Begriff zu häufig fällt, ist er überstrapaziert. Wie eben «Mobile First». Kunden besuchen «Emotions» zu 45% von Mobiltelefonen, zu 10% von Tablets und zu 45% von Computern aus. Auch wenn sich das Verhältnis zu Gunsten von Mobilgeräten verschiebt: Es gibt keinen Grund, sie bevorzugt zu behandeln. Konzept, Design und Nutzerführung sollen für die jeweilige Gerätekategorie optimiert sein – keine soll sich einer anderen unterordnen müssen. Desktop-Webseiten sind komplexer, weswegen wir sie zuerst gestalten. Ihren Umfang reduzieren wir dann für Mobile – was wiederum Auswirkungen auf die Desktop-Variante hat. Nicht «first», nicht «last»: «Together» ist die Lösung – auch wenn dem Begriff das für eine Headline notwendige Konfliktpotential fehlt.

Minimierte Komplexität

Cornèrcard Emotions kennt 7 verschiedene Checkout-Varianten, welche aus 12 möglichen Schritten bestehen können: Login, Bezahlen, Adresse eingeben, AGB annehmen, BIN, Gästenamen oder Gutschein-Code eingeben, Fragen beantworten mit oder ohne vordefinierte Antworten. Und vieles mehr. Ausgesprochen spannende Funktionen – für Leute, die sich dafür interessieren. Dazu gehören die Kunden sicher nicht. Deswegen haben wir den Checkout in einem grafisch und funktional absolut reduzierten Formular untergebracht, das sich auf mobilen Geräten so gut bedienen lässt wie von einem Computer aus.

Manuel Leclerc

«Unsere Kunden nutzen und schätzen Emotions: die einfache Bedienung, die Übersichtlichkeit und das schlichte Design.

Dank dieses Grundsteins wurden unsere Erwartungen an Nutzerzahlen und -verhalten deutlich übertroffen. Und das verdanken wir auch Joinbox.»

Manuel Leclerc Supervisor Cornèrcard New Media, Channel & Service

Nicht nur eine Website – eine ganze Software-Architektur

Cornèrcard Emotions ist eine individuelle Entwicklung und gleichzeitig Teil der EventBooster-Software-Architektur: Einer mandantenfähigen Web-Lösung, welche auf Event- und Kinodaten fokussiert und diese um Shopping- und Verlosungsfunktionen ergänzt. Mandantenfähig bedeutet: Mehrere Websites laufen auf denselben Servern und der gleichen Software-Instanz, haben aber voneinander strikte getrennte Daten und Frontends.

API First

Emotions läuft auf dem von Joinbox entwickelten Distributed-Framework. Distributed ist Open Source und basiert auf nodeJS. Im Wesentlichen tut es bloss drei Sachen – diese aber besonders gut:

  • Es mappt die Datenbank auf eine standardisierte Web-Schnittstelle (REST-API).
  • Es erlaubt, das Mapping über Controller zu erweitern und so massgeschneiderte und wiederverwendbare Komponenten (Micro Services) zu fertigen.
  • Es stellt ein Protokoll zur Verfügung, um diese Micro Services miteinander zu verbinden, ist damit eine Service-orientierte Architektur (SOA).

Das Meiste davon ist für die Meisten Blabla, deswegen das Zentrale in Kürze: Distributed stellt eine saubere und erweiterbare REST-API bereit. Also eine standardisierte, web-basierte Schnittstelle, über welche Mobile Apps, Websites und alle anderen mit dem Internet verbundenen Geräte in einfachster Weise mit Emotions kommunizieren können. So konnten beispielsweise ohne Zutun von Joinbox die aktuellen Verlosungen auf Emotions in die Mobile-App von Cornèrcard integriert werden. Pure Magic.

Valeria Vignolini

«Emotions ist eine sehr umfangreiche Plattform, umso wichtiger ist ein verlässlicher Ansprechpartner. Joinbox ist jederzeit für uns da. Und zwar rasch und unkompliziert – auch ausserhalb der Bürozeiten.»

Valeria Vignolini Product Manager Cornèrcard, E-Services & Channel Development

Zentrale Anforderung: Klare Anforderungen

Klar definierte Anforderungen an eine Website sind die zentrale Voraussetzung, um bei einem Projekt Budget und Zeitplan einhalten zu können. Dies gilt insbesondere für ein initiales Release mit dem Umfang von Emotions. Planungsgrundlage waren eine funktionale Spezifikation und Wireframes, die während der Umsetzung kontinuierlich weiterentwickelt wurden. Diese Änderungen fanden aber erst Eingang in die Version 1.1, sodass das erste Release (mit den ambitionierten zeitlichen Vorgaben) von Änderungswünschen unberührt blieb.

Die Entwicklung startete mit «Clickable Prototypes» für die relevanten Workflows, welche darauf mit der serverseitigen API verbunden wurden. Seit dem 1.0-Release im August 2014 wird die Plattform in kleinen Schritten optimiert und weiterentwickelt.

Visuelles Grundgerüst von Cornèrcard Emotions
Felix Steiner

«Wir lieben die Zusammenarbeit mit Cornèrcard – nicht nur wegen der Ausflüge ins Tessin.

Joinbox darf, kann und soll sich einbringen, und so finden wir oft gemeinsam mit Cornèrcard zu Lösungen, die am Ende beide Partner überraschen und begeistern.»

Felix Steiner CEO, Joinbox
  • Produkt
    Ein komplettes Kinoprogramm mit Sonderangeboten für Kunden, integriert in die bestehende Cornèrcard-Emotions-Website.
    Zum Kinokalender
  • Aufgaben
    Konzept, Design, Umsetzung, Weiterentwicklung
  • Technologien
    Backend: Mandantenfähige EventBooster-Architektur, basiert auf node.js, distributed und PostgreSQL.
    Hosting: Amazon Web Services.
    Frontend: angular.js, Bootstrap, HTML5 und CSS3.
  • Partner
    EventBooster (Konzept, Auftraggeber) und Cineman/Cinergy (Datenlieferant)

Über Cornèr Bank AG/Cornèrcard

Cornèrcard, eine Division der Cornèr Bank AG, gehört zu den Pionieren auf dem Schweizer Zahlungskartenmarkt. Als Herausgeberin von Visa, MasterCard und Diners Club Karten bietet sie ihren Kunden eine breite Palette von Produkten und Dienstleistungen an, die auf neusten Technologien beruhen.

Einfachheit, Eleganz

Wir mögen Seiten, wenn sie schlicht sind, und elegant. Wir reduzieren gern auf das Wesentliche. Nicht grundlos: Wir finden, dass eine übersichtliche und klar strukturierte Webseite ihre Aufgabe am besten erfüllt; tut sie dies mit Charme: umso besser.

Ein Kinoprogramm ist eine wunderbare Aufgabe, die schlicht und elegant gelöst werden kann. Entsprechend begeistert arbeiteten wir an Emotions Cinema. Anstelle von Filtern, Tabellen und viel Text, stellten wir die Filme in den Mittelpunkt, den eigentlichen Inhalt. Die Quintessenz eines ganzen Films in einem Bild, das Filmplakat, ist Dreh- und Angelpunkt von Emotions Cinema.

Ergänzt um die relevantesten Filter – und bald auch eine Volltextsuche – bildet die Liste von Filmplakaten die Einstiegsseite von Emotions Cinema und deckt damit die allermeisten Use-Cases einer Kinoplattform ab. So einfach. So schlicht.

Beat Weidmann

«Mit dem Kinokalender von Cornèrcard Emotions bieten wir unseren Kunden ein hilfreiches und benutzerfreundliches Tool zur Freizeitgestaltung.»

Beat Weidmann Head of Marketing Cornèrcard, Products & Services

Für die meisten Nutzer das Beste

Wenn alles nach Plan läuft – und das tut’s bei Emotions –, sind die Hauptnutzer einer Website weder der Auftraggeber noch die Agentur, sondern die Besucher. Deswegen beziehen wir sie gern früh in die Konzeption ein – und lernen immer wieder Überraschendes.

Eine zentrale Frage hatten wir in der Planungsphase von Emotions Cinema zu klären: Weswegen besucht ein Nutzer eine Kinoplattform? Anhand von Nutzerbefragungen haben wir die verschiedenen Nutzungsszenarien gesammelt und priorisiert (siehe Diagramm). Die Erkenntnisse bildeten und bilden Grundlage für die Konzeption, Umsetzung und Weiterentwicklung von Emotions Cinema; jede Anpassung an der Plattform wird daran gemessen.

Ziel von Cornèrcard war nie, alle Szenarien abzudecken – dafür gibt es andere Kinoseiten – sondern für die häufigsten Use-Cases die einfachste Lösung anzubieten. Deswegen haben wir die Funktionalität und das Design von Emotions Cinema ganz auf die meistgenannten Nutzerwünsche ausgerichtet: Die Suche nach Filmen, welche zu einer bestimmten Zeit an einem bestimmten Ort gezeigt werden.

Umfrage
Adrian Herrmann

«EventBooster arbeitet seit Jahren sehr eng mit Joinbox zusammen. Immer wieder lösen die Jungs von Joinbox die gestellten Aufgaben anders als erwartet, denken ‹out of the box› und begeistern uns alle damit.

Dabei decken sie alle relevanten Fachgebiete – Konzeption, Interaction und Web Design, Umsetzung von Front- und Backend, App-Entwicklung, Datenbank-Design, Unterhalt, direkte Kommunikation mit dem Kunden – mit höchster Effizienz und langjähriger Erfahrung ab. In Kombination mit ihrer Begeisterung für ihr Fachgebiet ist Joinbox ein unschlagbares Team.»

Adrian Herrmann Geschäftsführer, EventBooster AG
  • «Spielzeiten-Widget»

    Nutzer besuchen «Emotions Kino», um sich über die aktuellen Filme und ihre Spielzeiten zu informieren. Das «Spielzeiten-Widget» erlaubt die einfache Anzeige und Navigation durch alle Spielzeiten.

  • Übersicht

    Das Relevante ist auf den ersten Blick sichtbar – und alles Weitere nur einen Klick entfernt. Auf der interaktiven Frontseite können Ratings, Trailer, Beschreibung, Cast und Spielzeiten angezeigt werden. Ein Link führt direkt zu den Details des Films oder des Kinos – natürlich mit jeweiligem Programm.

  • Ratings

    «Heute Abend in meiner Nähe» liefert die Vorselektion – doch welcher Film darf’s sein? Wer Neues entdecken will, ist auf Entscheidungsgrundlagen angewiesen. Breit abgestützte Ratings von IMDB, Rotten Tomatoes und Cineman unterstützen bei der Filmwahl und werden überall prominent dargestellt.

Einer für Alle

Alle für Sie

Inhabergeführt

Ein von den Inhabern geführtes Unternehmen, ein Verbund von Gleichberechtigten, die auf ein gemeinsames Ziel hinarbeiten. Wir sind überzeugt, dass diese urdemokratische Agenturform wahrscheinlich nicht zu den einfachsten, aber sicherlich zu den nachhaltigsten Lösungen führt.

Begeisterung

Ein Team, dessen Mitglieder aus allen Himmelsrichtungen kommen – Volkswirtschaft, Informatik, Jura, Betriebswirtschaft, Design, Kommunikation, Philosophie, Oenologie. Die zusammen tun, was sie tun, weil sie das tun wollen – Und die sich dabei hervorragend ergänzen. Begeisterte, die tun, was sie lieben.

Nähe

Wir wohnen in der ganzen Schweiz – und sind doch Berner. Wir gestalten, konzipieren, programmieren und feiern beim Bierhübeli. Wir sind nahe bei Ihnen und nahe beieinander. Unsere Wege sind kurz, die Kommunikation ist direkt, die Verantwortung klar – Zusammenarbeit ist einfach, ist einfach Freude.

Kontinuität

Sechs Freunde, die sich über Jahrzehnte hinweg getroffen, begleitet und getrennt haben, um darauf wieder zusammenzufinden. Die miteinander Schullager und Release-Nächte verbracht haben. Und die alle wissen, dass sie mit den richtigen Leuten zur richtigen Zeit am richtigen Ort sind. Und dies auch bleiben wollen.

Fabian Jordi

  • E-Mail Adresse
    fabian@joinbox.com
  • Spezialität
    Responsive und SEO-optimierte Frontends.
  • Technologien
    HTML5, CSS3, SASS, AWAI-ARIA, Bootstrap, Photoshop, Illustrator.
  • Häufigste Aussage
    Und wie soll das auf Smartphones funktionieren?
  • Code Editor
    Coda.
  • Fachfremde Erfahrungen
    Bachelor-Studium VWL. Rekrutenschule bei Righetti & Partner. Engagierter Zivilschützer.
  • Reisedestination
    Dorffest Gerlafingen & Südamerika.
  • Eigene Projekte
    Website des FC Gerlafingen. Und Gemeinderat Gerlafingen. Also eigentlich einfach Gerlafingen.
Fabian Jordi

Fabian ist ein Urgestein (und Gemeinderat – und insbesondere natürlich Gerlafinger). Gründete in Kanti-Tagen zusammen mit Konrad und Felix die kleine und auftragslose Agentur creators.ch, fertigte mit ihnen später erfolgreicher Flip-Flops als Enfant Terrible und hatte 2009 die zielführenden Geistesblitze, als die Idee für Joinbox während eines Sommergewitters unter einem Sonnenschirm im Solheure entstand. Seine ursprüngliche Karriereplanung gab er zu Gunsten seiner Passion auf, und so braucht er statt BIP und Y1=C+I* nun CSS und HTML**, und anstelle von Statistiken zeichnet er User Interfaces – mit einer Subversion, die uns alle glauben macht, dass er als Volkswirt ein Che geworden wäre.

* Ja, das wäre dann Volkswirtschaft.

** Und das sind Frontend-Technologien.

Felix Steiner

  • E-Mail Adresse
    felix@joinbox.com
  • LinkedIn
    /fxstr
  • Subreddit
    /r/programmerhumor
  • Spezialität
    Mit ein paar Worten und Grafiken überzeugen. Und GitHub: git —piff paff puff.
  • Technologien
    Frontend (Javascript, AngularJS, Polymer), Photoshop und Indesign (Offerten und Spezifikationen).
  • Code Editor
    Sublime 3.
  • Fachfremde Erfahrungen
    Ausgebildeter Jurist. Mal kurz Pariser Philosophiestudent. Langjähriger Grafiker bei Righetti & Partner.
  • Reisedestination
    Wo das Internet nicht vorhanden oder unbezahlbar teuer ist.
  • Eigene Projekte
    Der eigene Pinot Noir und dessen Website. Die Bau- und Werkkommission Flumenthal. Kaffeerösten und die Adana 8×5.
Felix Steiner

Felix ist Handwerker – eine etwas tendenziöse Aussage, weil a) kaum jemand, der ihn kennt, zustimmen würde und b) er diesen Text gerade selber schreibt, in Winterthur, in einem Kaffee, bei Gipfeli und Americano, mittags, wie meistens donnerstags. Trotzdem: Handwerker: Weil er Resultate mag, Greifbares und wie wir alle: letztlich eine bessere Welt. Die soll man sich nicht denken, man soll sie nicht diskutieren – man soll sie machen. Deswegen fertigte er mit Fabian Flip-Flops, brannte Absinth, druckt die Joinbox-Visitenkarten von Hand, röstet Kaffee, macht seit Jahren Wein. Deswegen sind User Interfaces sein Ding, und er gnadenlos, wenn es darum geht, sie zu optimieren. Weil’s eben nicht um das UI geht – sondern die bessere Welt.

Michael Rüfenacht

  • E-Mail Adresse
    michael.ruefenacht@joinbox.com
  • Spezialität
    Software nach Lehrbuch: Getestet, dokumentiert, und nach Patterns.
  • Technologien
    Backend (PHP und node.js).
  • Im Büro
    9-to-5-Worker und konsequenterweise auch die Happy-Hour-Glocke.
  • Code Editor
    PHP Storm.
  • Reisedestination
    Wo das Wasser warm und der Alkohol stark ist (jap, er taucht).
  • Eigenes Projekt
    City Nord
Michael Rüfenacht

«Nei.» – «Wiso de nid?» – «Eifach nei!» (das «Nei» kommt von Michael, nicht das «Wieso?»; die Frage ist meistens Sache von Raphael oder Felix). Klingt bitchy, ist aber verflucht wertvoll: Es schützt vor Übermut. Und der kommt ja vor dem Fall – à propos Fall: Michael ist im Fall auch «richtiger» Informatiker, er hat ein Diplom und so, macht Test-Driven Development und codet in Patterns. À propos Development: Der Westen gilt ja als entwickelt – Michael «Rüfe» Rüfenacht rappt mit «City Nord» in Solothurn (jap, damit ist der Bogen wohl überspannt).

Lorenzo Kappeler

  • E-Mail Adresse
    lorenzo@joinbox.com
  • LinkedIn
    /lorenzo-kappeler
  • Subreddit
    Reddit ist nichts für konzentrierte Schaffer.
  • Spezialität
    Vollkommen unerwartet zuschlagen – im Sinne von «brutal schlagfertig sein», meinen wir. Und dran bleiben, bis es läuft.
  • Technologien
    Client und Server, webbasiert (JavaScript, AngularJS, Node.js, PHP, HTML, CSS). Konfiguration, Wartung und Betrieb von Servern (AWS, DevOps, Docker).
  • Code Editor
    Atom.
  • Fachfremde Erfahrungen
    Bar-Keeping und Event-Management.
  • Reisedestination
    Alle Stadien der UEFA.
  • Eigenes Projekt
    Mozilla Schweiz.
Lorenzo Kappeler

Ferien in St. Petersburg? Tönt gut. Mit dem Bus? Eher nicht. Freitag Abend losfahren, Sonntag Abend zurück? Ganz bestimmt nicht – würde man meinen. Nicht so Lorenzo. Seine Ferien dauern in der Regel 90 Minuten, etwas länger bei Nachspielzeit. Lorenzo ist Fussballer. Und Berner. Folglich YB-Fan. Und zwar so r-i-c-h-t-i-g, tourt die Clubstädte der UEFA – oder zumindest ihre Stadien.

Irgendwie beruhigend ist, dass Lorenzo JavaScript-Befehle fliessender aufzählt als die Namen des YB-Kaders. Konsequent zu Ende gedacht ist er also doppelt-r-i-c-h-t-i-g Backend-Entwickler. Und das mit Begeisterung: Bleibt neben YB und Joinbox etwas Zeit, arbeitet er an Mozilla-Projekten mit.

Wären die Pässe von YB so präzise wie Lorenzo’s Schlagfertigkeit, hätten wir einen neuen Meister. Und weniger Lorenzo wegen der vielen Champions-League-Ferien. Das wäre schade – so sind wir heimlich etwas froh über durchzogene Saisons.

Michael van der Weg

  • E-Mail Adresse
    michael@joinbox.com
  • LinkedIn
    /michaelvdw
  • Subreddits
    /r/HeavySeas
    /r/javascript
    /r/linux
    /r/programming
  • Spezialität
    Zukünftige Technologien heute sinnvoll einsetzen. Software Systeme entwerfen.
  • Technologien
    Javascript (node.js), Electronics, Bash, Java, Lucidcharts und Google Docs.
  • Code Editor
    Sublime 27, Atom.
  • Im Büro
    Oberster Gärtner.
  • Fachfremde Erfahrungen
    Segler. Und Bartender (Non-Disclosed Location).
  • Reisedestination
    Abgeschiedene Naturschönheiten umgeben von Wasser. Er segelt.
  • Eigene Projekte
    Alles mit wenig und viel Strom: Bürobeleuchtung mit Arduino, Transistoren & Co. Machine Learning, Open Source Software.
Michael van der Weg

Michael hatte in seinem Leben 23 Stromschläge – and counting. Das macht ihn mit Abstand zu Joinbox’ erstem Techniker und gibt ihm als CTO mehr Street Credibility als manchen lieb ist. Gäbe es Aliexpress nicht, hätte er es programmiert; und gäbe es Michael nicht, wäre die Alibaba-Aktie ein Penny-Stock (und Felix folglich potentieller Käufer). Würde Alibaba dann ganz eingehen, könnte Raphael die Deckung unserer Sachversicherung halbieren (weil Michael ja nicht mehr bastelte). Da es Alibaba und Michael aber gibt, hat Joinbox ein 10'000-LED-Licht-Konzept – und die Nachbarschaft schlaflose Nächte (die hat Michael auch, aber nicht des Lichts, sondern unserer visionären IT-Strategie wegen).

Raphael Marti

  • E-Mail Adresse
    raphael@joinbox.com
  • LinkedIn
    /raphaelmarti
  • Xing
    /Raphael_Marti
  • Subreddit
    /r/sports
    /r/excelporn
  • Spezialität
    Übersicht bewahren, Ordnung schaffen. Menschen.
  • Technologien
    Keine – also, doch, natürlich: Word, Excel, PowerPoint & vermehrt auch Google Docs.
  • Code Editor
    Say what?
  • Fachfremde Erfahrungen
    Medientrainer.
  • Reisedestination
    Sambia, Japan, Tasmanien, Israel und immer wieder Polska.
  • Eigenes Projekt
    Polnisch lernen.
Raphael Marti

Raphael ist der Einzige im Team, der keine Programmiersprache spricht, im Gegenzug aber vielleicht die Sprache unserer Kunden am besten versteht. Das macht ihn zu unserem Lead Project Manager und Business Developer. Wörter, die aus einer Welt kommen, in der er heimisch ist: Statt einer Karriere als Unternehmensberater wählte Raphael einst den Freiraum von Joinbox – it still makes us proud. Um unsere Prozesse zu optimieren, Aufträge zu gewinnen und Projekte zu leiten – wie er einmal meinte: um Joinbox in eine blühende Zukunft zu führen – verliess er seinen Karrierepfad. Einen Pfad, der ihn durch einen BWL-Master, durch Anstellungen bei Accenture, UBS und IBM und als Mediencoach sogar durch das Militär führte.

Sandro Kneubühl

  • E-Mail Adresse
    sandro@joinbox.com
  • LinkedIn
    /sandro-kneubuehl
  • Spezialität
    Ausgeprägte Allrounder-Fähigkeiten.
  • Technologien & Knowhow
    HTML, CSS, PHP, JavaScript.
    Datenmodellierung & Projektmanagement.
  • Code Editor
    PhpStorm, Sublime - früher InteliJ.
  • Fachfremde Erfahrungen
    Fotografie, Design, Reiseführer.
  • Reisedestination
    Überall wo's Wind hat («we love the Kitesurfing»).
  • Eigenes Projekt
    Portfolio meiner Fotografien und Reisen shotsoftheworld.com.
Sandro Kneubühl

Sandro setzt Frontends um, und das aus Leidenschaft. Hat einen Projektleiter-Job an den Nagel gehängt, um bei uns User Interfaces zu implementieren. Und ist, dank jahrelanger Programmiererfahrung und Bachelor, bestens gerüstet dafür.

Zwei weitere Leidenschaften Sandros haben wir mittlerweile kennengelernt:

Reisen und das Gesehene festhalten. Insbesondere Südamerika, insbesondere Kolumbien.

Mit grösster Leidenschaft verschaffen Unfälle Sandro Leiden. Unser Favorit? «Jungs, ich muss heute Home-Office machen. Habe eine Rösti wenden wollen. Sie fiel mir auf den Arm, den ich dadurch verbrannte. Bin ins Bad gerannt. Und hab mir dabei den Zeh gebrochen.»

Tobias Kneubühler

  • E-Mail Adresse
    tobias@joinbox.com
  • LinkedIn
    /tobiaskn
  • Spezialität
    Projekte aller Grössen. Mobile Apps, Kundensupport und dirty Hacks.
  • Technologien
    Backend (node.js und PHP), Apps (Swift/Objective-C), Datenbanken, Symfony, Java.
  • Code Editor
    Atom, Sublime, Xcode.
  • Fachfremde Erfahrungen
    Kunst-Atelier, Club geführt - Events veranstaltet.
  • Reisedestination
    Tagelange Wellnessausflüge mit Familie, Roadtrips.
  • Eigenes Projekt
    Jeden Sommer das Steinbruchkino (und die Welt verschönern).
Tobias Kneubühler

Spielten wir Schach – tun wir nicht, weswegen die Aussage wohl falsch ist – wäre Tobias Springer: Er rennt dahin, wo Not am Mann ist. Dafür kriegt er zu wenig Dank, deswegen: Merci, Tobi! Das macht ihn gleichzeitig zur vielseitigsten und flexibelsten Person in unserem Team (nur CSS-Voodoo bleibt die alleinige Domäne von Fabian). So stimmt Tobi’s Aufgabe auch mit seinem Charakter überein: Er ist unser Empathisant (jo, der mit der Empathie halt). Das hilft insbesondere bei hektischen Sitzungen unter Gleichberechtigten. Auch hier: Danke, Tobi.

  1. Joinbox
  2. 13 Gründe für Drupal

Hinter den meisten Websites steckt ein Content-Management-System (CMS). Über dieses erstellen und überarbeiten unsere Kunden die Inhalte ihrer Website selbständig. Drupal ist das CMS unserer Wahl. Das hat viele Gründe. Hier die wichtigsten:

Grund 1

Enterprise Class für Startups

Drupal ist ein Vorschlaghammer: Sie können damit Wände einreissen – aber auch mal einen kleinen Nagel einschlagen. Dank unserem optimierten Drupal-Setup können wir einfache Websites rasch und kostengünstig umsetzen. Und es ist so flexibel, dass wir damit auch komplexe Business-Lösungen realisieren können.

Grund 2

Wie WordPress, nur …

Wir haben die wichtigsten CMS miteinander verglichen und uns dabei für Drupal (und gegen WordPress, Joomla, TYPO3, django, Contao, Craft etc.) entschieden. Weil Drupal beim Vergleich von Marktanteil, Plugins, Lizenz (Open-Source), Dokumentation, Community, Vision, Erweiterbarkeit und Wartbarkeit, Geschwindigkeit und Qualität Gesamtsieger war. Mit Glanzresultat.

«Web-Projekte starten häufig mit einem beschränkten Umfang und wachsen dann zusammen mit dem Geschäft unserer Kunden. Zwei Sachen sind bei einem CMS deswegen zentral: ein rasches Setup und Erweiterbarkeit. Beides sind Kernbestandteile von Drupal 8.»

Sandro Kneubühl Frontend-Entwickler

Grund 3

Redaktion an die Macht!

Bei Drupal erstellt die Redaktion Inhalte, indem Sie vordefinierte Bausteine (wie Slideshows, Buttons, Tabellen, Videos, formatierter Text etc.) miteinander kombiniert. Das macht Drupal sehr mächtig und die Content-Pflege einfach. Gleichzeitig stellt dieses Baukastensystem sicher, dass die Inhalte auf jedem Gerät – Smartphone bis Fernseher – perfekt aussehen.

Grund 4

Microlandingmarketingcorporatewebsite

Drupal ist die geeignete Grundlage für verschiedenste Anwendungen: Corporate Websites, Blogs, Web-Apps, Online-Shops, Microsites, E-Learning-Tools, Landing-Pages und – dank einer sauberen REST-API – sogar für Mobile-Applikationen.

Grund 5

Free Speech, Free Beer

Drupal 8 ist Open-Source-Software, die von einer breiten Community entwickelt wird. Und Drupal ist eines der am häufigsten eingesetzten CMS weltweit (mit Nutzern wie Tesla, Pfizer, BBC etc.). Das gibt Ihnen Unabhängigkeit: von einem Hersteller, von Lizenzkosten und sogar von uns.

Grund 6

Ein kompletter Bausatz

Mittels Plugins lassen sich Funktionen, welche im Kern eines CMS fehlen, einfach ergänzen: Formulare, E-Commerce-Lösungen, Anbinden von bestehenden Schnittstellen. Drupal verfügt über eine breite Palette aktueller und hochwertiger Module (Plugins). Und wo eines noch fehlt, können wir dieses entwickeln.

Grund 7

Erprobte Business-Lösungen

Drupal 8 basiert auf Symphony 2. Was wir damit sagen wollen: Die Grundlage von Drupal ist ein erprobtes, verbreitetes und flexibles PHP-Framework, über das sich Ihre Geschäftsprozesse digital abbilden lassen. Bestellungen, Freigaben oder Bestätigungen gehören zur Kernkompetenz von Drupal – und lassen sich nahtlos in Ihre Website integrieren.

Grund 8

Planbare Sicherheit

Eine Software ist so lange sicher, wie sie aktualisiert wird. Das gilt auch für Drupal – mit drei Pluspunkten: Sicherheitsupdates werden bei Drupal rasch entwickelt, umgehend veröffentlicht und früh kommuniziert. Das macht Updates und damit die Sicherheit planbar.

Grund 9

Präzise Rechte

Ihren Drupal-Nutzern können Sie Rechte sehr granular vergeben. So ist es beispielsweise möglich, dass ein Produkt-Manager nur die ihm zugewiesenen Produkte bearbeiten kann – und nicht mehr. Oder dass eine Redaktorin Seiten entwerfen aber nicht selber veröffentlichen kann.

Grund 10

Viele viele bunte S…eiten

Kommt häufiger vor als man denkt: Sie haben verschiedene Websites (z.B. für Untermarken, Zweigniederlassungen oder Partnerunternehmen). Diese sollen auf der gleichen Software laufen und ähnlich aussehen, aber verschiedene Inhalte und Domains haben. Drupal handhabt das spielend dank integrierter Multi-Site-Funktionalität.

Naturhistorisches Museum Bern – Customization

Grund 11

Sprachgewandt

Die Schweiz ist mehrsprachig – Drupal auch. Während bei WordPress Übersetzungen nachträglich über Plugins von Drittanbietern installiert werden müssen, ist Mehrsprachigkeit Kernbestandteil von Drupal. Und damit flexibler, wartungsfreundlicher und weniger fehleranfällig.

Grund 12

Ein voller Rucksack

Drupal ist das solide und breite Fundament Ihres Web-Projekts: Suchmaschinenoptimierung (SEO), hohe Ladegeschwindigkeiten (Caching) und Medienverwaltung gehören ebenso dazu wie Versionierung der Inhalte, flexible Datenstrukturen und mächtige Taxonomien (Kategorisierung und Querverlinkung von Inhalten). Damit nicht genug: Alle diese Funktionen lassen sich über eine standardisierte Schnittstelle (REST-API) ansprechen – und damit in bereits bestehende Applikationen einbinden.

Grund 13

Immer neuer, immer besser

Drupal ist erwachsen, hat mit Version 8 einen grossen Sprung vorwärts gemacht (der bei WordPress übrigens noch ansteht). Und Drupal wächst weiter, ein grösseres Update wird alle sechs Monate veröffentlicht. Inline-Editing im Frontend, bessere Schnittstellen (API-First), eine einfachere Medienverwaltung und mächtigere Layout-Funktionen sind angekündigt.

  1. Joinbox
  2. Gute User-Experience in 11 Beispielen (Teil 1)

Viele der erfolgreichsten Websites sind nicht besonders schön. Erfolgreich sind sie, weil sie den Nutzer ins Zentrum stellen. Weil sie eine gute «User Experience» (UX) bieten.

User-Experience ist nicht, wie eine Website aussieht – sondern wie sie funktioniert; wie sie sich anfühlt. Was sich richtig anfühlt, das brauchen die Nutzer, das brauchen sie gern und immer wieder. Gute User-Experience ist damit ein relevanter Erfolgsfaktor für dein nächstes Online-Projekt und der Grund, weswegen erfolgreiche Websites nicht unbedingt gut aussehen (müssen).

Hier einige Highlights, die Nutzer glücklich machen – direkt aus unserem Agenturalltag:

Beispiel 1

Registration: Die Sonnencrème des Web

Registrations- und Anmeldeprozesse sind die Sonnencrème des Webs: Ein notwendiges Übel. Wie häufig hast du schon eine Buchung oder einen Kauf abgebrochen, weil er zu mühsam war – und bist dann nie wieder auf die Website zurückgekehrt? Lass uns daraus lernen.

Beispiel

Du kennst das – es ist mir vor Kurzem beim SwissPass der SBB passiert: Du besuchst eine Website, willst dich registrieren, füllst dazu sieben Formularfelder aus. Dann klickst du «Registrieren» – und es erscheint die Meldung: «Nutzer ist bereits registriert». Formular für nichts ausgefüllt. Von der Website bleibt ein schlechter Eindruck – und damit auch von dem Unternehmen dahinter.

SwissPass könnte von Eventbooster lernen: Da gibt die Nutzerin ihre Mail-Adresse ein; falls sie bereits registriert ist, zeigen wir ihr das Passwort-Feld für den Login an. Falls sie noch nicht registriert ist, zeigen wir ihr das Registrationsformular an. Kein einziges Feld füllt sie unnötigerweise aus. 💪

«Kein Nutzer mag persönliche Daten preisgeben, bevor er Vertrauen in deine Website gefasst hat.»

Beispiel 2

Passwort2: Vulnerability by Design

Sichere Passwörter sind wichtig und kompliziert einzugeben, besonders auf Smartphones. Beim Setzen des Passworts musst du dieses häufig wiederholen. Damit sollen Falscheingaben entdeckt werden. Dumm nur: Wer gibt ein kompliziertes Passwort schon doppelt ein? Die Wiederholung verleitet dazu, ein einfaches und damit unsicheres Passwort zu wählen.

Beispiel

Bei Eventbooster kannst du dir das Passwort beim Setzen anzeigen lassen. Das erspart die doppelte Eingabe – und stellt sicher, dass du das Passwort nicht doppelt falsch eingibst.

Beispiel 3

Keine Ausreden für Anreden

Den meisten Vornamen können wir eine Anrede zuordnen. Dennoch musst du bei Formularen häufig deinen Vornamen und die Anrede angeben. Wiiiiesoo? Weil zu viele Webdesigner nicht denken, da hilft keine Ausrede.

Beispiel

Bei der Registration für Eventbooster fragen wir zuerst Vor- und Nachnamen, erst dann die Anrede ab. Sobald du deinen Vornamen eingegeben hast, erfragen wir die Anrede bei einer offenen Web-Schnittstelle und füllen das Formular entsprechend aus. Die Anrede kannst du jederzeit manuell ändern.

Beispiel 4

Feedback, zack zack!

Du füllst ein Formular aus und erst beim Absenden zeigt es dir an, dass eine Eingabe falsch war. Du musst raufscrollen, den Fehler suchen, beheben, runterscrollen und das Formular erneut absenden. Spass geht anders.

Felder können mehrere Validatoren aufweisen (z.B. «Muss mit einem Grossbuchstaben beginnen» und «Nicht mehr als vier Grossbuchstaben in Folge»).

Um dir das Leben möglichst einfach zu machen, validieren wir die Eingaben in Echtzeit. Die Fehlermeldungen sind hilfreich und kurz, ungültige Werte kannst du so rasch beheben.

Beispiel

Bei Eventbooster validieren wir Eingaben auf verschiedenste Weise, weil die angeschlossenen Medien qualitativ hochwertige Daten verlangen: Grösse von Bildern, Länge von Texten, Anzahl Grossbuchstaben in Folge, Wörter auf einem Index.

Felder können mehrere Validatoren aufweisen (z.B. «Muss mit einem Grossbuchstaben beginnen» und «Nicht mehr als vier Grossbuchstaben in Folge»).

Um dir das Leben möglichst einfach zu machen, validieren wir die Eingaben in Echtzeit. Die Fehlermeldungen sind hilfreich und kurz, ungültige Werte kannst du so rasch beheben.

«Verfasse hilfreiche Fehlermeldungen: ‹Mind. 7 Ziffern› ist klarer als ‹Eingabe fehlerhaft›.»

Beispiel 5

Heute Abend in meiner Nähe

Du willst einen Kinofilm schauen gehen oder suchst die Filiale eines Geschäfts. Häufig befinden sich die relevanten Resultate in deiner Nähe – richtig? Dafür gibt’s Geolocation im Browser. Der Klick auf einen Button genügt, um Filialen oder Filme nach der Distanz zu deinem aktuellen Aufenthaltsort zu sortieren.

Beispiel

Beim Kino-Kalender von Cornèrcard haben wir bereits 2014 die Möglichkeit geschaffen, nach Filmen in deiner Nähe zu suchen – und zwar heute Abend, weil dies die häufigste Suchanfrage ist. Auch hier: Smart Defaults 😍!

Fortsetzung folgt…

Weitere Beispiele guter User-Experience folgen Anfang 2019 in einem zweiten Teil.

  1. Joinbox
  2. So wird ihr Software-Projekt zum Erfolg

Software-Projekte stehen im Verruf, sie sind Synonym für Kosten- und Zeitüberschreitungen geworden. Das ist schade und falsch. Wenn Sie diszipliniert planen und die folgenden Empfehlungen beachten, halten Sie Zeitplan und Budget ein.

Die folgenden Tipps haben wir in unseren Jahren als Startup und Agentur gesammelt – und teils hart erarbeitet.

Tipp 1

Seien Sie verdammt klar

Oberstes Ziel aller Planung ist, Risiken zu minimieren. Das bedingt, dass Sie sich im Vorfeld mit dem Vorhaben und allen Betroffenen auseinandersetzen und dass Sie sich festlegen – klar und deutlich. Bringen Sie dazu alle Beteiligten mit an Bord, holen Sie früh ihre Erwartungen ab. Eliminieren Sie Interpretationsspielraum und Unsicherheiten. Kommunizieren Sie offensiv, informieren Sie regelmässig. Zwingen Sie sich selbst, Ihre Vorgesetzten, Ihre Agentur zu ganz präzisen Aussagen. Halten Sie Features, Kosten, Zeitplan und Verantwortlichkeiten schriftlich fest. Das ist mühsam und kostet im Vorfeld viel Zeit. Es nicht zu tun, kostet Sie das Vielfache.

Tipp 2

Beschränken Sie den Umfang

Das Risiko wächst exponentiell zur Grösse eines Projekts. Agenturen berücksichtigten das Risiko bei ihren Kostenschätzungen. Grosse Projekte werden deswegen exponentiell teurer und gleichzeitig risikoreicher.

Software kann jederzeit erweitert werden. Starten Sie mit dem notwendigen Minimalumfang (siehe Messen und lernen Sie) und erweitern Sie die Software später. Wenn ein Feature nicht zum Kernprodukt gehört oder wenn Sie nicht wissen, ob seine Implementation mehr kostet als sie finanziell bringt, verzichten Sie darauf – vorerst.

«Halten Sie Ihre Agentur bezüglich Feature-Set an einer verdammt kurzen Leine.»

Tipp 3

Messen und lernen Sie

Jedes neue Projekt, das ein Unternehmen plant, gleicht einem Startup: Es ist gekennzeichnet von Ungewissheit. Marktforschung ist spannend, bleibt aber hypothetisch. Erst in der Wirklichkeit erfahren Sie, ob Ihre Erwartungen erfüllt werden – veröffentlichen Sie Ihre Software deswegen möglichst früh.

Beachten Sie dabei zweierlei:

1 — Richten Sie sich nach dem Kunden: Software-Design ist häufig von Gefühlen und Meinungen getrieben («Ich denke, der Nutzer könnte das wollen»). Weil jeder Beteiligte eine andere Meinung hat, kommen Sie kaum auf einen grünen Zweig. Hören Sie nicht auf Meinungen, sondern auf den Kunden. Arbeiten Sie wissenschaftlich: Stellen Sie Hypothesen auf, dann validieren Sie diese! Dazu müssen Sie das Nutzerverhalten messen und analysieren. Das Web ist dafür perfekt geeignet.

2 — Release early, release often: Starten Sie mit dem Produkt, das notwendig ist, um Ihre ersten Annahmen zu validieren – mehr nicht. Arbeiten Sie in Iterationen (in kontinuierlichen kleinen Schritten) und in einem «Build-Measure-Learn»-Cycle: Jeden Schritt planen Sie; dabei legen Sie die Erwartungen an das Nutzerverhalten fest. Dann setzen Sie um. Darauf messen Sie die Auswirkungen auf das Nutzerverhalten – und dann lernen Sie daraus! Darauf kommt der nächste Schritt, bei dem Sie bereits etwas mehr über den Nutzer wissen und dies einbringen können.

Übrigens: Agenturen mögen, was sie tun – sie tendieren deswegen zu unnötig «perfekten» Lösungen. Halten Sie Ihre Agentur oder Ihre Entwickler bezüglich Feature-Set an einer verdammt kurzen Leine.

Tipp 4

Lassen Sie pitchen

Sie haben Ihre Lieblingsagentur gefunden? Bleiben Sie bei ihr: Vertrauen ist wichtiger als kleine Kostenvorteile. Wenn nicht, evaluieren Sie zwischendurch Alternativen.

Anhand eines Pitches können Sie Agenturen bestens vergleichen – wenn er richtig vorbereitet wird. «Pitch» ist ein Unwort für (Verkaufs-)Präsentation. Agenturen haben dabei 30–60 Minuten Zeit, ihre Fähigkeiten anhand eines konkreten Umsetzungsvorschlags unter Beweis zu stellen.

Erstellen Sie ein präzises aber kurzes Briefing (2 Seiten max.), das folgende Fragen beantwortet, der Agentur aber Freiheiten bei der Ausgestaltung der Lösung lässt:

  • Wer sind Sie und wie gliedert sich das Projekt in Ihr Unternehmen und Ihre Systeme ein (Vorwort)?
  • Welche Ziele wollen Sie mit der Software erreichen (Strategie: Leads, Sales, Information, weniger Support-Aufwand), wer ist das Zielpublikum?
  • Was soll die Software können (funktionale Anforderungen/Use Cases)?
  • Welche Vorgaben bestehen bezüglich Design, eingesetzter Software (Open Source, Support) und Schnittstellen?
  • Was genau soll die Agentur liefern (siehe Beispiel)?
  • Haben Sie spezifischere Wünsche? (Wenn Sie unbedingt viele grosse Bilder auf Ihrer Website wollen, dann sagen Sie das)

Seien Sie fair: Der Aufwand für Vorbereiten und Halten eines Pitches beträgt gern 20–60 Stunden. Entschädigen Sie, wenn auch nicht fürstlich. Und laden Sie nicht mehr als vier Agenturen ein.

Tipp 5

Schaffen und verlangen Sie Transparenz

Es gibt viele Entwicklungs-Modelle (agil, iterativ, lean, scrum – blabla). Agenturen lieben, damit zu werben. Wichtig ist einzig: Das Modell muss Ihnen liegen und Sicherheit bezüglich Features, Kosten und Zeit geben.

Stellen Sie sicher, dass Sie in den Entwicklungsprozess sehen – nichts ist demotivierender als Blindflug. Bei uns hat sich bewährt, grössere Projekte in kleine und messbare Meilensteine (man könnte sie «Sprints» nennen) zu unterteilen. Jeder Meilenstein:

  • dauert maximal zwei Wochen
  • hat eine Deadline und eine zugehörige Aufwandschätzung
  • ist für den Kunden sichtbar (hat also ein User-Interface)
  • hat einen zugehörigen Acceptance-Test
  • wird von dem Kunden anhand der Acceptance-Tests abgenommen

So sinkt das Risiko für den Kunden (er weiss und sieht, wo Entwicklung und Budget stehen) und für die Agentur (Meilensteine werden abgenommen). Den Fortschritt jedes Milestones halten wir laufend fest – so lassen sich Budget und Zeitplanung von Anfang an vergleichen, Fehlentwicklungen können wir frühzeitig beheben. Und das ist zentral: Nichts ist motivierender als Fortschritt, der greifbar ist.

«Es wird Bugs geben, Software-Updates, Server-Downtimes. Holen Sie die Kostenschätzung dafür vor der Umsetzung ein.»

Tipp 6

Preis ≠ Aufwand * Stundensatz

Geschätzter Aufwand und Stundensatz ergeben den Preis einer Software? Falsch:

  • Das gilt während der Umsetzungsphase nur, wenn die Anforderungen ganz klar sind; ist dies nicht der Fall, müssen Sie mit unerwarteten Zusatzkosten rechnen.
  • Nach der Umsetzung kommt der Unterhalt: Es wird Bugs geben, Software-Updates, Server-Downtimes, Hosting-Gebühren. Holen Sie die Kostenschätzung dafür bereits vor der Umsetzung ein (z.B. über ein SLA).
  • Stellen Sie sicher, wer Verantwortung und Kosten für welche Software-Fehler (Bugs) trägt. In der Regel gilt: Versteckte Mängel, die Sie bei der Abnahme nicht sehen können, gehen zu Lasten der Agentur, andere bleiben bei Ihnen hängen. Stellen Sie also sicher, dass für die Abnahme genügend Ressourcen bereitstehen und sie sehr, sehr ernst genommen wird.
  • Sowieso: Rechnen Sie bei jeder Projektplanung genügend Zeit für Tests, Bugfixes und Releases ein.
  • Wenn mehrere Unternehmen involviert sind, besteht das Risiko unklarer Verantwortung. Stellen Sie sicher, dass Sie ein einziges verantwortliches Unternehmen und dabei eine einzige Ansprechperson haben. Und dass Sie dieser vertrauen.
  • Schnittstellen (APIs) sind Teufelszeug und aufgrund der Abhängigkeit von Drittanbietern das wohl grösste Risiko bei der Softwareentwicklung. Definieren Sie ganz genau, welche APIs angebunden und welche Daten übertragen werden, wer die Datenhoheit hat und dass die Anbindung automatisiert getestet wird.

Tipp 7

Wählen Sie praktisch vor schön

Schönes Design ist schön – aber nicht mehr. Software ist interaktiv: Entscheidend für den Erfolg ist nicht ihr Aussehen, sondern ihre Funktionsweise. Die grossen Player – Amazon, Facebook, von mir aus auch Zalando – sind oder waren lange Zeit richtiggehend hässlich. Wenn Sie am Erfolg und nicht an einem kurzen «Wow» interessiert sind, entscheiden Sie nicht aufgrund des Aussehens, sondern aufgrund der Überlegungen, welche dahinter stehen.

Fragen Sie die Agentur nach dem «Wieso»:

  • «Wieso haben Sie zum Einstieg eine Slideshow verwendet?» (Bei einer Slideshow ist nur eine Slide sichtbar, alle anderen brauchen einen Klick oder Zeit; zentrale Inhalte sind also versteckt)
  • «Wieso verwendet das Mobile Menu einen Hamburger?» (Viele Nutzer kennen das Icon mit den drei Strichen nicht und alle Inhalte des Menus sind hinter einem Klick versteckt; die Navigation, wichtigstes Element vieler Seiten, ist geradezu unsichtbar).
  • «Wieso muss ich mich registrieren?» (Eine Registration ist für den Nutzer ein häufiger Grund, einen Checkout abzubrechen, kann Sie also einen Verkauf kosten – ohne dass Sie einen sinnvollen Gegenwert erhalten dafür)

Gibt Ihnen die Agentur keine Antwort, welche Sie nachhaltig beeindruckt, dann lesen Sie das Kapitel «Lassen Sie pitchen».

Zusammenfassung

Schaffen Sie im Vorfeld Klarheit. Blinde Flecken können Sie ein Vermögen kosten. Beschränken Sie den Umfang – seien Sie diesbezüglich hart zu Ihnen, zu Ihren Vorgesetzten, zu Ihrer Agentur. Testen Sie früh am Markt, messen und insbesondere: lernen Sie! Vergleichen Sie Agenturen. Hinterfragen Sie. Letztlich, wie unsere Miss Schweiz so schön sagte: «Wie bei der Wahl zur ‹Miss Schweiz› zählen auch bei Webseiten innere Werte: Nutzerfreundlichkeit, Struktur, Übersichtlichkeit und Inhalt.»

Sie verwenden einen veralteten Browser und können nicht alle Funktionen dieser Website nutzen. Bitte laden sie einen dieser aktuellen und kostenlosen Browser runter: