MELAG - B2B Headless Platform

Redesign und Neustrukturierung für optimierte User Experience

Für uns bestand die Aufgabe darin, den Relaunch der Corporate Website MELAG.COM zu betreuen. Das neue Online-Portal von MELAG sollte die Anlaufstelle für unterschiedlichste Personengruppen werden. Neben der Anfrage von Produkten, sollte ein umfassender Content-Bereich aufgebaut werden, der MELAG-Bestandskund:innen sowie -Neukund:innen auf unterschiedliche Weise inhaltlich abholt. 

Um diesen Anforderungen nachzukommen, spielte die Systemevaluation hierbei eine entscheidende Rolle. Im Austausch mit MELAG sind wir dazu gekommen, dass die auf Drupal7-basierende Website mit einem State-of-the-art CMS umgesetzt werden sollte und haben uns auf eine Umsetzung mit Contentful und Shopware geeinigt. Eine Kombination aus Content-Management-System und Shop ermöglicht den Mitarbeitenden von MELAG, Informationen in ausführlichem Umfang bereit zu stellen und diese sinnvoll mit dem Shop zu verknüpfen. 

Das Ziel der neuen Informationsdarstellung besteht darin, die erklärungsbedürftigen und konfigurierbaren Inhalte sowie Produkte der Website klar, verständlich und ansprechend zu präsentieren, um effektiv Leads für MELAG und Ihren Fachhandelspartner zu gewinnen. Die Servicebereiche dienen als wichtige Säule für die Blogbeiträge, die Produktkonfiguration und insbesondere der Lead-Generierung.

Detaillierter Ansatz in 3 Phasen: Präzise Planung und Umsetzung für den MELAG Website-Relaunch

Zunächst haben wir nach der Festsetzung des Zieles, die Corporate Website MELAGs zu optimieren, das Projekt in 3 konkrete Phasen gegliedert und dementsprechend nach den Vorgaben umgesetzt.

In der ersten Phase des Scopings, haben wir gemeinsam mit dem Kunden die Ziele und Funktionen der geplanten Website erfasst und ausformuliert sowie ein technisches Grundkonzept erstellt, welches mit ersten Designentwürfen versehen wurde. Zusätzlich haben wir ein Basislayout erstellt und auf Basis der Kundenanforderungen nach einer Systemevaluierung, in der wir verschiedene CMS-Systeme gegenübergestellt haben, eine Systemempfehlung für Contentlful abgegeben. Auch die Evaluation des passenden Shopsystems spielte eine entscheidene Rolle, bei der wir uns folglich auf Shopware geeignigt haben.

Im zweiten Schritt sind wir in das Feinkonzept gegangen und haben die Module grafisch ausgearbeitet und die Requirements der gestalterischen und funktionalen Anforderungen formuliert. Unter anderem hat dies auch weitere Requirements für Datenflüsse und die Definition von Schnittstellen erfordert.

Der letzte Schritt der Projektphase ist geprägt von der technischen Umsetzung eines MVP. Kern unserer Arbeit ist seither die Umsetzung eines Headless-Frontend für die Webseitenbestandteile.

Über das ganze Projekt hinweg waren unsere Expert:innen aus Konzept, Design, Front- und Backend, SEO und Projektmanagement involviert und waren daran beteiligt, ein Contentful-Projekt in der brandung zu verwirklichen sowie ein Headless-Shopware-Projekt in unserer Agentur zu realisieren.

Eine Erfolgreiche Transformation: Hochwertige UX und Starke Markenpräsenz für MELAG

Das Ergebnis ist mehr als erfreulich. Es freut uns, dass circa 32 Contentmodule im CMS realisiert werden konnten und für spürbar erlebbare Inhalte sorgen. Die User Experience der Website ist so, wie sie jetzt dargestellt wird, sehr hochwertig und nutzerorientiert.

Hinsichtlich des UX-Designs wurde bei MELAG ein System der modularen Flexibilität etabliert, das großzügige redaktionelle Freiräume gewährt und eine dynamische sowie interaktive Präsentation der Produkte ermöglicht. Damit können die User im Handumdrehen die Hauptmerkmale und Detailverbesserungen der Produkte erkennen, was wesentlich zur Stärkung der Markenidentität von MELAG beiträgt. Die intuitive Nutzerführung, gestärkt durch ein flexibles Navigationssystem, ermöglicht den Kund:innen, Produkte zügig zu konfigurieren und sie ohne Umstände zu erwerben.

Im Bereich des UI-Designs wurde der Fokus auf die Leitwerte Qualität, Hygiene, Reinheit, Zuverlässigkeit und Präzision gelegt, was sich deutlich im Outcome hervorhebt.

Das klare und professionelle Design spiegelt Robustheit und Reinheit wider und unterstreicht so die Qualitäts- und Verlässlichkeitsversprechen von MELAG als ein in Deutschland hergestelltes Produkt. Die visuelle Präsentation des Designs positioniert MELAG als Marktführer und hebt ihre Markenstärke hervor. Farbakzente, insbesondere in Blau, fungieren als visuelle Leitlinien und werden gezielt eingesetzt, um Benutzer:innen den Weg durch wichtige Interaktionselemente wie Call-to-Actions zu weisen, wodurch eine effektive Benutzerführung und eine herausragende UX unterstützt werden.

Als ein separates Side-Project wurde das Lizenzmodell MELATrace im März 2023 eingeführt. Dieses bietet Kund:innen die Möglichkeit, sich zu registrieren und notwendige Lizenzen für ihre Produkte zu erwerben. Zudem etabliert MELAG mit Sterihero einen weiteren Vertriebskanal für ausgewählte Produkte, präsentiert im eigenen Marken-Design und -Konzept.

Nicht nur das Technische, sondern auch das Menschliche stimmte bei der Zusammenarbeit mit MELAG. Die Projektphasen, vom Briefing über die Contenterstellung bis hin zur Pflege, liefen für beide Seiten sehr zufriedenstellend. Wir freuen uns schon jetzt auf zukünftige Projekte, in denen wir einen Shop und dessen Seiten weiter ausbauen können.

„Der neue Webshop und der Relaunch der Website stellen nicht nur uns, sondern auch unsere zahlreichen Kund:innen mehr als zufrieden. Wir sehen in der Arbeit von brandung unsere Produkte in vollem Glanz – denn das können wir – dargestellt, aber auch unsere vielfältige, innovative Unternehmenskultur.

Die neue Präsenz unseres Unternehmens ist nicht nur eine Lösung für die Außenkommunikation. Sie strahlt auch nach innen und motiviert uns umso mehr bei unserer täglichen Arbeit.“

Siegfried Weinhart, Senior Marketing Manager