Neue Corporate Web-Plattform mit Drupal 9, Produktkonfigurator und Webshop

Höhere durchschnittliche Aufenthaltsdauer und geringere Absprungrate durch neue Web-Plattform für ein führendes Schweizer High-Tech Unternehmen

Kunde IST AG
Jahr 2022
Rolle Discovery, MVP, Software-Entwicklung
01 —

Zusammenfassung

Die IST AG ist einer der weltweit führenden Hersteller von physikalischen, chemischen und biologischen Sensoren, mit Hauptsitz in Ebnat-Kappel in der Schweiz. Da die Produkte als komplex betrachtet und in vielen Fällen nach Kundenwunsch gefertigt werden, erfolgt der Grossteil des Umsatzes traditionell durch physische Kanäle wie den Direktvertrieb und Messen. Die bisherige Webseite offerierte zwar bereits einen eigenen Webshop, strategisch spielte er aber noch keine massgebliche Rolle.

Neben der Erklärung von komplexen Produkten auf der Webseite, bestand eine Herausforderung der IST AG darin, dass ihr Vertrieb durch eine hohe Anzahl an Kundenanfragen überlastet war. Allgemeine Produktanfragen und Sonderwünsche erforderten bislang einen hohen Kommunikationsaufwand.

Damit in Zukunft der Vertrieb entlastet wird hat B-works zusammen mit der IST AG eine komplett neue Webseite, inklusive Produktfinder und Webshop entwickelt und live geschaltet. Diese deckt die gesamte Customer Journey vom Erstkontakt bis zur Weiterempfehlung ab und berücksichtigt die Anforderungen der Kunden, sowie jene der IST Abteilungen, welche die einzelnen Aufgaben entlang der Wertschöpfungskette abbilden und effizient umsetzen können müssen.

Projekt-Kategorie: Webseite mit Webshop und Produktkonfigurator

Titel: IST Digital

Kunde: Innovative Sensor Technology IST AG, Schweiz

Branche: B2B, Technologie, Produktion, Sensoren

Zielsetzungen: Entwicklung einer neuen Firmen-Webseite für die IST AG, inklusive Produktfinder und Webshop. Entwicklung von Komponenten, die es den Content-Managern ermöglichen per Layout Builder einfach und schnell neue Seiten zu erstellen und per drag & drop beliebig anzupassen. Vereinfachte Kontaktformulare, die es Webseiten-Besuchern erlauben, schneller, einfacher und zielgerichteter Anfragen an den Vertrieb zu senden, so dass dieser langfristig entlastet wird. Gestaltung der Webseite als mobile-first Design. Das Projekt umfasste folgende Aktivitäten:

  • Discovery-Workshop mit zwölf Abteilungen bei IST, um die Bedürfnisse und Probleme der Nutzer vollständig zu identifizieren, Personas zu erstellen und Customer Journeys für spezifische Anwendungsfälle zu entwerfen.
  • Design der Webseite und ihrer Komponenten mittels Mockups, die es dem Kunden ermöglichten, das Design und die User Experience zu testen und Feedback vor der eigentlichen Implementierung zu geben.
  • Implementierung der kompletten Webseite, Webshop und Produktkonfigurator in iterativen Sprints.

B-works Rolle: Discovery, UX/UI Design, Backend- und Frontend-Entwicklung

Technologie: Drupal 9 (CMS), Drupal Layout Builder

Projektumfang: 12 Monate mit 5 B-works Teammitgliedern

Figma Website Wireframe
02 —

Unsere Arbeit

Für dieses Projekt stellte B-works ein Scrum Team zusammen, bestehend aus einem Product Owner, einem UX/UI-Designer, einem Backend-Entwickler, einem Frontend-Entwickler und einem Test-Engineer.

Das Projekt wurde in eine Discovery-Phase, eine Design-Phase und in eine Implementierungs-Phase aufgeteilt und mit Scrum umgesetzt.

Prozess und Tools:

Folgende Faktoren waren für die erfolgreiche und termingerechte Umsetzung des Projekts entscheidend:

  • Kick-off-Meeting zur Definition der Projektziele und der zu erreichenden Funktionalität
  • Aufbau eines synergetischen 5er-Teams, bestehend aus einem Product Owner, UX/UI-Designer, und drei Entwicklern
  • Discovery-Workshops zur Entwicklung der Produktvision, Entwicklung von Personas, Definition von Pain Points und Bedürfnissen, Erstellung von Customer Journeys
  • Design-Phase zur Entwicklung von Low-Fidelity und High-Fidelity Mockups der Webseite und ihrer Komponenten
  • Zweiwöchentliche Sprints mit Sprint Reviews, Plannings und Grooming Sessions
  • Zweiwöchentliche Fortschrittsberichte mit dem Kunden nach dem Sprint-Review
  • Website-Entwicklung mit Drupal 9
  • Monatliche Zeiterfassung und Budgetberichterstattung mit Jira & Harvest
  • Agiles Testen durch B-works, laufende Abnahme durch den Kunden und paralleles Bugfixing durch das Entwicklungsteam

Eingesetzte Technologien:

  • Drupal 9
IST_Tablet_Checkout
03 —

Die wichtigsten Vorteile für den Kunden

Bereits in den ersten beiden Monaten nach dem Go-Live konnte die IST AG signifikante messbare Verbesserungen mit der neuen Webseite verzeichnen. Es gab einen grossen Anstieg der Webseitenbesucher, eine Erhöhung der durschnittlichen Verweildauer auf der Webseite und eine Verringerung der Absprungrate.

Gemeinsam mit dem UX/UI-Designer von B-works wurde die Webseite nach User-Experience Best-Practices entwickelt. Für die Webseiten-Besucher ist es Dank des Produktfinders nun deutlich einfacher, die richtige Produktkategorie und das eigentliche Produkt zu finden. Durch weitere Filter lassen sich Suchen verfeinern und eingrenzen. Die Produktseiten wurden ausserdem so gestaltet, dass sich die wichtigsten Informationen schnell und leicht finden lassen. Auch der komplette Checkout-Prozess wurde neu konzipiert, um die Abschluss-Rate zu maximieren.

Ist das gesuchte Produkt gerade nicht auf Lager oder bedarf es einem spezifischen Kundenwunsch, so können diese Anfragen mit den neuen Kontaktformularen viel leichter als zuvor an die IST AG gesendet werden. Hierfür reicht nun ein Knopfdruck im Shop und das richtige Produkt ist bereits vorausgewählt. Dafür wurden eigens neue Formulare entwickelt. Das erfreut die Webseitenbesucher und den Vertrieb.

Mithilfe der neuen Webseite haben die Content-Manager von IST AG nun maximale Flexibilität bei der Gestaltung von neuen Seiten und beim Einpflegen von Inhalten. Der Drupal Layout Builder ermöglicht es ihnen Dank einer Drag-and-Drop Oberfläche Komponenten auf einer Seite auszuwählen, zu platzieren und zu arrangieren. Jede einzelne Komponente wurde nach Kundenwunsch entworfen und umgesetzt - sowohl im Frontend als auch im Backend.

Um diese Ergebnisse zu erreichen und die wichtigsten Bedürfnisse der einzelnen Abteilungen der IST AG zu sammeln wurden mehrere Vor-Ort-Workshops durchgeführt. Vertreter der Abteilungen haben zusammen mit B-works Ideen auf Basis von Kundenproblemen und -bedürfnissen entwickelt und priorisiert, die dann von B-works in Prototypen umgewandelt und getestet wurden. Danach konnte die IST AG ihre "Must-Have" Features für die Version 1.0 der neuen Webseite auswählen. Diese zusätzliche Nutzenvalidierung der einzelnen Komponenten gab der IST AG erhöhte Erfolgschancen und Kostensicherheit für das Projekt. Der Aufwand für die Implementierung konnte durch B-works dann sicher geschätzt werden und letztendlich wurde das Projekt zeit- und budgetgerecht umgesetzt.  

  • Neue Webseite mit neuem Design und verbesserter UX für die IST AG
  • Produktfinder und Webshop, welche die Produktsuche und den Einkauf für die Webseitenbesucher erleichtern
  • Drag-and-Drop Layout Builder zur einfacheren Erstellung von Seiten mit vordefinierten Komponenten für die Content Manager
  • Mobile-first Design, alle Seiten sind nun responsive und für jegliche Displaygrösse geeignet
  • Neue Kontaktformulare zur schnelleren und vereinfachten Kontakaufnahme für die Webseitenbesucher
  • Entwicklung in 12 Monaten, innerhalb des Budgets und des geplanten Go-Live-Datums
Product Finder

Copyright © 2022 – B-works. Alle Rechte vorbehalten  |  Privacy Policy  |  Sitemap  |  Impressum