Wiedererkennung statt Einheitsgrau: So passt Ihr Kundenportal im Maschinenbau perfekt zu Ihrem Corporate Design

Teilen auf:

Warum Ihr Kundenportal im Maschinenbau mehr ist als nur ein Zugangspunkt – und was gutes Design damit zu tun hat

Ein überzeugendes und durchgängiges Serviceangebot im After-Sales des Maschinenbaus lebt von funktionalen Mehrwerten. Doch genauso wichtig ist der Eindruck, den Ihr Kundenportal beim Endkunden hinterlässt. Als digitale Schnittstelle sollte es sich mit hohem Wiedererkennungswert nahtlos in Ihren Unternehmensauftritt einfügen.

Eine klare Navigation, die lückenlose Integration angebundener Systeme und ein individueller Look im Einklang mit Ihrer Corporate Identity sind dabei entscheidend.

Mit der EquipmentCloud® erhalten Sie ein Kundenportal, das Effizienz, Transparenz und Kollaboration in den Mittelpunkt stellt und damit die digitale Transformation von Maschinen- und Anlagenbauer aktiv unterstützt. 

Die Custom-CSS (Cascading Style Sheets) bieten Administratoren dabei weit mehr als reine Gestaltungsmöglichkeiten. Sie schaffen echte Freiräume, um das eigene Corporate Design im Kundenportal gezielt umzusetzen – mit individuellen Gestaltungselementen und einer durchgängig markenkonformen Nutzererfahrung.

Die wichtigsten Vorteile von CSS liegen dabei auf der Hand: 
  • Konsistentes Corporate Design: Ein einheitlicher Auftritt im gesamten Kundenportal stärkt die Wiedererkennung Ihrer Marke und schafft Vertrauen beim Endkunden.
  • Trennung von Struktur und Design: APEX liefert die Inhalte und die strukturelle Grundlage der Webanwendung – wie bei vielen Web-Applikationen wird das Erscheinungsbild über CSS gesteuert. Das Custom CSS in der EquipmentCloud® ergänzt oder überschreibt dabei gezielt die bestehenden Stylesheet-Regeln von APEX.
  • Skalierbarkeit & Wartbarkeit: Ein zentrales CSS-Theme lässt sich flexibel erweitern oder aktualisieren. Modular aufgebaute Styles – etwa mit CSS-Variablen oder Utility-Klassen – erleichtern zudem die Pflege deutlich.
  • Responsives Design: Dank Media Queries und moderner Layout-Techniken bleibt das Portal auf allen Endgeräten konsistent und markengerecht, egal ob auf Desktop, Tablet oder Smartphone.

Wie lässt sich ein Kundenportal im Maschinenbau individuell gestalten?

Custom-CSS eröffnet eine Vielzahl an Freiheitsgraden, mit denen sich das Erscheinungsbild Ihres Kundenportals passgenau an Ihr Corporate Design anpassen lässt. Typische Gestaltungsmöglichkeiten umfassen:

  • Farbschemata: Primär- und Sekundärfarben, Hintergrundtöne, Akzentfarben und Schattierungen
  • Typografie: Schriftart, -größe, Zeilenhöhe und Schriftgewicht
  • Abstände und Layout: Padding, Margin sowie die Anordnung über Grid oder Flexbo
  • Gestaltung von Buttons und Formularelementen
  • Animationen und Übergänge, z. B. über Pseudoklassen beim Hovern
  • Brand-spezifische Icons oder Bilder, etwa Logos im Kopf- oder Fußbereich
  • Variablen für die Berechnung von Farben oder Pixelgrößen,  einmal definiert und mehrfach einsetzbar
Wie wird das in der EquipmentCloud® umgesetzt?

Die Custom-CSS-Funktion ist über das Branding Plus in der EquipmentCloud® nutzbar. Damit lässt sich das Erscheinungsbild aller Seiten im Kundenportal beliebig anpassen. 

Auch die Widgets auf dem Dashboard sind vollständig individualisierbar. Hier wurden CSS-Klassen implementiert, die es ermöglichen, sowohl einzelnen als auch mehreren Widgets gezielt eigene Styles zuzuweisen. Administratoren und Nutzer können damit spezifische Designs für Widgets erstellen und wichtige Inhalte visuell hervorheben. Diese CSS-Klassen können im CSS-Live- oder Entwicklermodus definiert werden und umfassen den gleichen Gestaltungsumfang wie zuvor beschrieben. 

Wo stößt das Custom-CSS an seine Grenzen?

So flexibel CSS auch ist – es gibt einige Punkte, an denen die Gestaltungsmöglichkeiten im Kundenportal eingeschränkt sind. Wir wollen Ihnen einen transparenten Überblick über die volle Bandbreite der Rahmenbedingungen geben.

Technisches Vorwissen erforderlich

Nicht jeder ist mit Custom-CSS vertraut. Anpassungen an Farbwerten oder Abständen erfordern ein grundlegendes CSS-Verständnis. Kleine Fehler in der Syntax können das Design unerwünscht beeinträchtigen. HTML-Kenntnisse sind also von Vorteil, um die gesamte Bandbreite an Funktionen nutzen zu können – KI-Tools wie ChatGPT können hier unterstützen. 

Begrenzte Vorschaumöglichkeiten

CSS-Anpassungen erfolgen meist direkt im Code, ohne direkte Vorschau. Das macht das Trial-and-Error-Prinzip mühsam, besonders ohne Live-Editor oder visuelle Hilfen. Hier haben wir aber mit dem Entwicklermodus Abhilfe geschaffen.

Keine tiefgreifende Kontrolle über Struktur oder Logik

Zwar können Nutzer Farben, Schriftarten, Abstände anpassen oder bestehende HTML-Elemente umpositionieren, doch die grundlegende Struktur der HTML-Datei oder das Verhalten von Komponenten lassen sich nicht verändern. Auch das Erstellen zusätzlicher HTML-Elemente ist nicht möglich – spezielle Layoutanforderungen stoßen hier an systembedingte Grenzen. Die zugrunde liegende Struktur ist in der EquipmentCloud® über APEX definiert und bleibt durch CSS unangetastet.

Eingeschränkter Zugriff auf Drittkomponenten

SaaS-Portale wie die EquipmentCloud® enthalten UI-Komponenten von Drittanbietern – etwa Kalender, Charts oder Formulare –, die sich häufig nur eingeschränkt stylen lassen. Das Custom CSS hat in diesen Fällen oft nur begrenzten oder gar keinen Einfluss, sofern keine expliziten Klassen, IDs oder API-Hooks vorhanden sind. Aus diesem Grund wurden gezielt CSS-Klassen für die Widgets auf dem Dashboard implementiert, um dort mehr Gestaltungsspielraum zu schaffen.

Keine visuellen Standards

Jeder Nutzer kann theoretisch beliebige Styles festlegen – was schnell zu inkonsistenten Nutzererlebnissen führen kann, etwa durch schlechte Kontraste oder unleserliche Schriftarten. Ohne visuelle Leitplanken sind Fehlkonfigurationen möglich, die das Portal am Ende unprofessionell wirken lassen.

Responsiveness hängt vom CSS ab

Nutzer können unbeabsichtigt Custom-CSS schreiben, das auf Mobilgeräten nicht sauber dargestellt wird – etwa durch feste Breiten oder unflexible Layouts. Ohne Kenntnisse zu Media Queries oder den Grundlagen responsiven Designs leidet die mobile Nutzererfahrung schnell darunter.

Unsere Tipps für eine einfache Umsetzung mit Custom-CSS

Um die genannten Herausforderungen im Umgang mit Custom-CSS besser zu meistern, geben wir Ihnen aus der Praxis erprobte Tipps an die Hand, damit die Individualisierung Ihres Kundenportals im Maschinenbau einfach und effizient gelingt.

Über die Entwicklerkonsole (engl. Developer Console), die sich in Chrome, Edge und Firefox mit der Taste F12 öffnen lässt – in Chrome und Edge alternativ auch mit Strg + Shift + Ckönnen einzelne Elemente und Designelemente im Kundenportal direkt per Selektor markiert und farblich hervorgehoben werden. So lassen sich CSS-Variablen leichter identifizieren und auf verschiedenen Seiten konsistent anwenden. Das ist eine wertvolle Hilfe beim gezielten Anpassen.

Für einen entspannten Einstieg in die Gestaltung eigener Themes – wie zum Beispiel Light- oder Darkmode-Varianten – stellen wir die Datei „Customer CSS Beispiel“ zur Verfügung. Darin sind bereits die wichtigsten Selektoren zusammengetragen und mit hilfreichen Kommentaren versehen. So dient die Datei als praktische Orientierungshilfe und erspart die zeitaufwändige Suche nach passenden Selektoren. Typische Fehler lassen sich dadurch leichter vermeiden – ideal für alle, die strukturiert in die Individualisierung ihres Kundenportals starten möchten.

Für Administratoren steht der sogenannte Entwicklungsmodus zur Verfügung. Darüber kann das CSS bearbeitet werden, ohne dass andere Benutzer durch fehlerhafte Einstellungen beeinträchtigt werden. Der Modus wird über die Branding-Option unter Custom CSS aktiviert. Sobald er eingeschaltet ist, wird ein separater Satz von CSS für den Darkmode und den Lightmode freigeschaltet. Innerhalb dieses Modus kann das CSS angepasst und im eigenen Benutzerkonto getestet werden. Nur die Nutzer, die den Entwicklungsmodus aktiviert haben, sehen diese Änderungen. So kann gefahrlos ausprobiert, angepasst und optimiert werden, ohne dass unfertige Designs für andere sichtbar sind. Ist die Bearbeitung abgeschlossen, lassen sich die Inhalte aus dem Entwicklungsmodus in die Produktion übernehmen. Ab diesem Moment sehen alle Benutzer das finale, veröffentlichte Layout im Kundenportal.

Zusätzlich bieten wir Schulungen und Trainings an, um den Einstieg in die Custom-CSS-Gestaltung so einfach wie möglich zu machen.

Bereit, Ihr Kundenportal im neuen Licht erscheinen zu lassen?

Sie wollten Ihrem Kundenportal schon lange einen modernen Darkmode verleihen oder endlich Ihr Corporate Design konsequent umsetzen? Dann nutzen Sie jetzt die neuen Gestaltungsmöglichkeiten in der EquipmentCloud® – und machen Sie Ihr Kundenportal zum digitalen Aushängeschild Ihres Unternehmens.

Sprechen Sie uns an – wir beraten Sie gerne und zeigen Ihnen, wie Sie das volle Potenzial ausschöpfen.