Barrierearme Vertriebsplattform in NEOS mit individuellem Produktberater
Expertise
Tech Stack
Laufzeit
Challenge
Die bisherige Website diente vor allem als digitale Visitenkarte und spiegelte weder die Beratungsstärke noch die Vielfalt des Produktportfolios wider. Ziel war es, die digitale Präsenz von einer statischen Produktdarstellung zu einer Plattform für Lead-Generierung zu entwickeln, die Expertise und Kundenfokus sichtbar macht.
Solution
Im Fokus unserer Lösung standen Lead-Generierung und Nutzerbedürfnisse. Da das Know-how der Entscheider in Unternehmen im Bereich Internet und Telefonie stark variiert, entwickelten wir einen intelligenten Produktberater. Er empfielt durch gezielte Fragen passende Lösungen und erklärt nachvollziehbar, warum die Empfehlung optimal zur individuellen Situation passt. So wird die Beratungsqualität von Plusnet digital erlebbar und stärkt die Positionierung weg vom anonymen Anbieter hin zu einem Partner mit Expertise und Persönlichkeit.
Die barrierearme Umsetzung nach WCAG-AA-Standards sorgt für Zugänglichkeit, während die direkte Salesforce-Anbindung Leads effizient in den Vertriebsprozess integriert.
Mit strategischer Neuausrichtung zur idealen User Journey
FigJam Datei des Key Sprints
Der gemeinsame Strategie-Workshop bildete den Auftakt für die Neuausrichtung von Plusnet. Statt abstrakter Markenarbeit stand die konkrete Betrachtung von Produkten, Services und der gesamten Customer Journey der unterschiedlichen Zielgruppen im Mittelpunkt. Dabei wurden strategische Ziele formuliert und ein klarer Fahrplan für die Umsetzung festgelegt.
Was Plusnet besonders macht: Die Kombination aus hochwertigen Telekommunikationslösungen „Made in Germany“ und „Hosted in Germany“, einem Service mit Top-Kundenzufriedenheit und einer unkomplizierten, partnerschaftlichen Beratung. Ihr Ziel ist es, Unternehmen bei der Digitalisierung nicht nur zuverlässig zu begleiten, sondern die Zusammenarbeit so angenehm wie möglich zu gestalten.
Genau daraus leiteten wir das Ziel der neuen Website ab: Den oft als mühsam empfundenen Prozess der Anbieterwahl zu einem positiven Erlebnis zu machen. Statt Bedenken wie „Klappt das?“ oder „Werde ich über den Tisch gezogen?“ soll bei Plusnet eine klare, verständliche Nutzerführung im Vordergrund stehen, die Orientierung gibt und Spaß macht. So finden auch kleine Unternehmen und Small Offices / Home Offices ("SoHos") schnell das passende Angebot – und fühlen sich bei ihrer Entscheidung rundum gut aufgehoben.
Der ersten Low-fi Wireframe
Key Sprint als Sprungbrett
Auf den Strategie-Workshop folgte ein interdisziplinärer Key Sprint mit einem Team aus Technical Lead, UX Lead, UI Lead, Strategy, Product Lead und dem Kunden. Innerhalb von fünf Tagen entstand ein Moodboard und ein erster Prototyp in Form eines Wireframes, der im weiteren Prozess mit Testpersonen validiert wurde.
Im Fokus standen dabei eine stärkere Unterstützung der Recherche-Phase, eine modulare Website-Struktur, die mit der Produktausrichtung von Plusnet mitwachsen kann, sowie eine klare, verständliche Nutzerführung mit vertrauten Interaktionsmustern. Ebenso wichtig war, den hohen Anspruch an Service und Beratung direkt erlebbar zu machen und die Website wie eine digitale Beratungsleistung wirken zu lassen.
Ein Kernelement im Wireframing war daher der Produktberater, der Nutzer:innen Schritt für Schritt zur richtigen Lösung führt. Ergänzt durch eine Sidebar mit Tipps und beratenden Infos aus der Branche entsteht so eine Beratungserfahrung, die Orientierung gibt, Vertrauen schafft und gleichzeitig die Leadgenerierung steigert.
Moodboard & Userflow im Usability-Test
Um die Konzeption frühzeitig zu validieren, wurde ein Usability-Testing durchgeführt. Ziel war es sicherzustellen, dass das Moodboard die Markenidentität von Plusnet klar und ansprechend vermittelt und der darauf basierende Userflow zu einer erfolgreichen Conversion führt.
Aus den drei Hauptzielgruppen wurde mit je zwei Personen ein qualitatives User Testing mithilfe der „Thinking out loud“-Methode und einem individuellen Interview-Leitfaden durchgeführt. Auf diese Weise ließen sich Gedanken, Gefühle und Bedürfnisse der Testpersonen nachvollziehen, während diese sich durch den Prototyp klickten. Die gewonnenen Erkenntnisse führten zu gezielten Detailanpassungen, die die Usability auf das bestmögliche Niveau heben konnten. So entstand beispielsweise die Idee eines fiktiven Experten, der die User Schritt für Schritt begleitet, und optimierte Texte, die den Entscheidungsprozess noch klarer und einfacher machen.
UX Konzept & Design
Inspiriert vom Markenkern und den strategischen Zielen von Plusnet haben wir ein modernes UX-Konzept und Design entwickelt, das die Website in eine kundenfokussierte Vertriebsplattform verwandelt.
Das Design integriert die Markenwerte des Unternehmens durch eine dezente Farbgebung, die den Fokus auf die Inhalte legt, sowie durch organische Formen und Rundungen für einen modernen Look. Barrierefreiheit wird durch großflächige Buttons und ein klares, intuitives User Interface gewährleistet. Um die Marke nahbarer zu machen, wurden zudem Bilder mit echten Menschen integriert, die Plusnet als verlässlichen Partner erlebbar machen.
Intuitiver Product-Finder als Herzstück der Website
Der Kern unserer Entwicklung war ein interaktiver Product-Finder, der als digitale Beratung fungiert. Ziel war es, potenzielle Kund:innen intuitiv und personalisiert zum passenden Angebot zu führen – ohne sich durch das gesamte Produktportfolio arbeiten zu müssen.
Das Konzept basiert auf drei Eingaben: dem gewünschten Produkt, der Unternehmensgröße und der Adresse. Anhand dieser Angaben werden Nutzer:innen automatisch einer Zielgruppe zugeordnet. So können nicht nur die passenden Produkte und Services angezeigt werden, sondern auch weiterführende Inhalte wie News, Ratgeber oder Referenzen, die für diese Zielgruppe relevant sind. Auf diese Weise wird der Beratungsprozess ganzheitlich – von der Produktempfehlung bis hin zur inhaltlichen Vertiefung.
Auch für den Fall, dass ein Produkt am angegebenen Standort nicht verfügbar oder für den Bedarf ungeeignet ist, bietet der Product-Finder Sicherheit: Ein Empfehlungstext weist auf passende Alternativen hin und verlinkt direkt weiter. Ergänzt durch Empfehlungen von fiktiven Experten entsteht so eine Nutzerführung, die den Auswahlprozess vereinfacht, Vertrauen schafft und Plusnet als kompetenten Partner erlebbar macht.
Technische Umsetzung und Integration
Die neue Website von Plusnet ist als Single Page Application (SPA) konzipiert, die wir mit dem Svelte-Framework realisiert haben. Die Entscheidung für Svelte fiel bewusst: Es bietet nicht nur eine exzellente Developer Experience, sondern gewährleistet auch bei großen Datenmengen eine herausragende Performance bei der Aktualisierung der Benutzeroberfläche.
Die Anwendung dient als zentrales Element, um den genauen Bedarf der Besucher:innen zu ermitteln und maßgeschneiderte, granulare Angebote zu erstellen. Im Backend setzen wir auf Neos als CMS, eine bewährte Lösung in unseren Projekten. Während Neos klassischerweise fertige HTML-Bausteine ausgibt, arbeitet der Product Finder mit strukturierten Rohdaten (JSON), die als Bauplan für die Anwendung dienen.
Effiziente Content-Pflege für Redakteure
Besonderen Wert haben wir auf eine intuitive Content-Pflege gelegt. Um die Arbeit für Redakteure so einfach wie möglich zu gestalten, wurde in Neos eine visuelle Vorschau vieler Daten implementiert – Inhalte können dadurch wie gewohnt inline bearbeitet werden, statt abstrakt in Eingabefeldern. Zusätzlich haben wir einen Importer entwickelt, der über 100 News-Seiten aus der alten WordPress-Umgebung automatisch nach Neos migriert hat – ein enormer Zeitgewinn für das Redaktionsteam.
Darüber hinaus führten wir einen zweitägigen Content-Workshop durch. Neben einer Neos-Schulung wurden die Inhalte gemeinsam mit dem Kunden neu strukturiert und Tipps für den optimalen Seitenaufbau erarbeitet. Außerdem erhielt das Redaktionsteam praktische Empfehlungen, welche der umfangreichen Content-Elemente sich für welche Inhalte am besten eignen. Damit ist die Website nicht nur technisch leistungsfähig, sondern auch nachhaltig effizient in der Pflege.
FigJam vom Content Workshop mit Plusnet
Content Workshop vor Ort bei Plusnet
