05 / 19 · Onlineshop-Komfort für Novartis-Labore

Buying Engine

Forschende bei Novartis bestellen über die Buying Engine Verbrauchsmaterial, Geräte und Laborbedarf. Ich leitete ein 8-monatiges Redesign, dessen erstes Release ohne Backend-Änderungen auskam. Sein Framework trug danach ein zweites Produkt, den Data Marketplace.

Rolle
Lead Designer
Kunde
Novartis
Branche
Gesundheit & Life Sciences
Jahr
2020–2022
Leistungen
UX-Design, Informationsarchitektur, UI-Redesign

Eine Forscherin bei Novartis bestellt Laborbedarf und füllt vielleicht einen Warenkorb mit Artikeln von Merck und Thermo Fisher, mit getrennten Lieferadressen und Kostenstellen. Ihre Laborleitung muss zudem Bestand und Ausgaben im Blick behalten. Beide arbeiten in derselben internen Einkaufsplattform.

Die Plattform war mit der Zeit überladen. Dekorative Markenelemente konkurrierten mit Preisen und Produktnamen, Abstände wechselten von Seite zu Seite, und eine schwache Informationsarchitektur machte Produkte schwer auffindbar. Viele Produktkarten zeigten nur einen Bildplatzhalter. Die Laborleitung hatte keinen strukturierten Überblick über Bestand oder Kosten, und jede Verbesserung musste kommen, ohne auf Backend-Änderungen zu warten.

Könnten wir dem Laboreinkauf den Komfort eines Onlineshops geben, ihn schnell auf dem bestehenden Backend ausliefern und dabei etwas bauen, das sich im nächsten Produkt wiederverwenden lässt?

Wir starteten mit Belegen: frühere Studien, neue Interviews, Workflow-Maps der Stellen, an denen Bestellungen hängen blieben, und Prototypen in formativen Tests. Das erste Release änderte nur das Frontend. Es brachte ein aufgeräumteres UI, ein einheitliches Layout, bessere Kategorien und Filter und ein Analytics-Dashboard für die Laborleitung. Das zweite reduzierte die Klicks bis zum Checkout und machte grosse Datensätze schneller. Dieselbe Informationsarchitektur, dieselben Patterns und Komponenten wurden dann zur Basis des Novartis Data Marketplace.

Meine Rolle

Lead Designer. Ich leitete das Redesign rund 8 Monate lang. Dazu gehörten Interviews zur Bestätigung der Pain Points, Workflow-Mapping, Skizzen und Prototypen für formative Tests, zwei Release-Iterationen und das wiederverwendbare Framework hinter dem Data Marketplace.

Was es schwierig machte

  • Keine Backend-Änderungen

    Das erste Release musste alles im Frontend verbessern. Das hielt das technische Risiko klein, schränkte aber ein, was sich ändern liess.

  • Bestellungen bei mehreren Lieferanten

    Ein Warenkorb kann sich in mehrere Bestellungen aufteilen, jede mit eigenem Lieferanten, eigener Lieferadresse und eigener Preisumrechnung.

  • Auffindbarkeit

    Tausende Produkte mit uneinheitlichen Daten und fehlenden Bildern brauchten eine Struktur, in der man stöbern und filtern kann.

  • Zwei Zielgruppen

    Forschende wollen schnell bestellen. Die Laborleitung braucht Überblick über Bestand und Ausgaben. Beide leben im selben Produkt.

Fragen, die wir stellten

  1. Worauf schauen Einkaufende zuerst, wenn sie ein Produkt überfliegen: Preis, Titel oder Lieferant?
  2. Wo scheitern Bestellungen bei mehreren Lieferanten im Checkout?
  3. Welche Aufgaben der Laborleitung laufen noch von Hand ausserhalb der Plattform?
  4. Was können wir heute ändern, ohne das Backend anzufassen?
01

Was Nutzende sahen

Wir annotierten die alten Screens, um überflüssige Dekoration von dem zu trennen, was zählt: Produktname, Preis, Lieferant und der nächste Schritt. Interviews bestätigten dieselben Probleme, die Nutzende schon in früheren Studien genannt hatten.

Was Nutzende sahen

Das Audit des Altsystems: Dekoration und Abstände auf der einen Seite, die Produktfakten, die Einkaufende brauchen, auf der anderen.

02

Zuerst Skizzen

Die Skizzen deckten Liste, Detailseite, Warenkorb und eine Auswertungsansicht ab. Der Warenkorb wurde zu einem Schritt-für-Schritt-Assistenten für mehrere Bestellungen, Lieferadressen und Preisumrechnungen. Die Auswertungsansicht nutzte das Listen-Template mit Filtern, einem Raster und Ampelfarben für den Status.

Zuerst Skizzen

Liste, Detailseite, ein Warenkorb als Assistent für Bestellungen bei mehreren Lieferanten und eine Auswertungsansicht auf Basis des Listen-Templates.

03

Vorher und nachher

Die erste Iteration räumte das Interface auf, vereinheitlichte Abstände und Layout, verbesserte Kategorien und Filter und ergänzte ein Dashboard für die Laborleitung mit Bestellungen und Bestand. Die zweite verkürzte den Weg zum Checkout und optimierte die Performance bei grossen Datensätzen. Produktkarten zeigen jetzt zuerst Kategorie, Preis und einen klaren «Add to Cart»-Button.

Vorher und nachher
Vorher und nachher

Die alte Startseite, dann das Redesign: zuerst Kategorie, Preis und «Add to Cart».

04

Ein Framework, zwei Produkte

Dieselbe Informationsarchitektur, dieselben Interaktions-Patterns und Komponenten wurden zur Basis für den Novartis Data Marketplace, wo man Datenbestände findet und Zugriff darauf beantragt. Eine Sitemap-Analyse bildete das neue Produkt auf die bestehende Struktur ab: Suche, Detailseiten, eine persönliche Bibliothek, ein Warenkorb und ein Wissenszentrum.

Ein Framework, zwei Produkte
Ein Framework, zwei Produkte
Ein Framework, zwei Produkte

Die Startseite des Data Marketplace, gebaut auf dem Framework der Buying Engine.

05

Der Data Marketplace

Ein vertrautes Shopping-Modell senkte die Einstiegshürde. Datendomänen öffnen sich aus einem verbundenen Mega-Menü, und beim ersten Start wählt man eine Ansicht: «Focused» oder «Advanced». Suchergebnisse zeigen den Zugriffsstatus auf einen Blick. Der Warenkorb erfasst eine geschäftliche Begründung und zeigt, welche Datenbestände zu jeder Sicherheitsgruppe gehören.

Der Data Marketplace
Der Data Marketplace

Ansichtswahl, Suche mit Zugriffsstatus, Warenkorb für Datenzugriffe und persönliche Bibliothek. Namen von Datenbeständen und Plattformen sind unkenntlich gemacht.

In Bewegung

Ergebnisse

  • ~8Monate als Lead Designer
  • 2Release-Iterationen
  • 2Produkte auf einem Framework
  • Höhere gemeldete Zufriedenheit der Nutzenden dank eines klareren, einheitlicheren Interfaces
  • Schnellere Bestellabwicklung und besserer Überblick über den Bestand für die Laborleitung
  • Ein wiederverwendbares Design-Framework, das den Launch eines zweiten Produkts beschleunigte
  • Mehr Nutzung und weniger Aufwand in Design und Entwicklung

Was ich mitnehme

  • Ein sicheres erstes Release ausliefern. Sichtbare Fortschritte ohne Backend-Risiko machten es leichter, die zweite Iteration zu finanzieren.
  • Erst die Struktur, dann die Oberfläche. Eine klare Informationsarchitektur brachte mehr Tempo als jeder visuelle Feinschliff.
  • Patterns für die Wiederverwendung gestalten. Das zahlte sich aus, als ein zweites Produkt schnell live gehen musste.
Lead Designer
Preetham Lawrence
Ein schwieriges Problem, das sich zu lösen lohnt?

Lösen wir es gemeinsam.

preetham.lawrence@icloud.com
+41 76 740 46 30Telefon
LinkedIn↗ Texte auf Medium↗

Designleiter in Zürich, Schweiz. Offen für Führungsrollen und ausgewählte Kooperationen.

© 2026 Preetham LawrenceÜbersicht