FirstSpirit ContentCreator Redesign: Bessere User Experience und modernes Look & Feel

Marketing CMS Innovation
von Romy Fischer

Fünf Fragen an Daniela Reddig, UX Lead bei e-Spirit.

Mit der FirstSpirit Version von Februar 2020 erleben Kunden ihre gewohnte Redaktionsumgebung in überarbeitetem Design: Der ContentCreator stellt Redakteuren eine Reihe neuer Funktionen bereit und bekommt ein neues Look & Feel.

Schon ein Release früher, im Januar, können FirstSpirit on-premises Kunden ihre Umgebungen im neuen Design testen. Zum Rollout der nächsten UX-Generation stellt Daniela Reddig, UX Lead bei e-Spirit, im Experteninterview die Highlights des Redesigns vor und gibt einen Blick hinter die Kulissen.

Daniela, was macht gute User Experience aus?

Bei UX geht es um die Erfahrungen, die ein Nutzer bei der Interaktion mit einem Produkt sammelt. Einfach zusammengefasst: Gute UX maximiert das positive Erlebnis bei der Benutzung eines Produkts.

Benutzerfreundlichkeit ist schon immer ein zentrales Thema beim Interface-Design, häufig verbunden mit dem Schwerpunkt, User möglichst effizient mit Systemen arbeiten zu lassen. User Experience geht aber weit darüber hinaus: Sie stellt den Benutzer selbst mit seinen Erfahrungen und Empfindungen in den Mittelpunkt. Es geht darum, eine möglichst gute Rundum-Erfahrung zu generieren - physisch, haptisch und emotional. Gute UX braucht also eine Reihe von Zutaten: Die Software muss stabil und performant laufen, sie sollte User möglichst gut darin unterstützen, ihre Ziele einfach, und schnell zu erreichen und dabei noch möglichst chic und modern aussehen - sich in Summe einfach gut anfühlen.


Aktuell erscheint der FirstSpirit ContentCreator in komplett überarbeitetem Design. Was ändert sich mit dem Redesign für die Benutzer?

Auf den ersten Blick sehen Redakteure ein frisches und modernes Software-Layout, in dem sie sich sofort sicher und “zu Hause” fühlen. Die Farbpalette wurde überarbeitet, das Layout der Formulare vereinfacht, Icons und Fonts vergrößert. Insgesamt wirkt die UI heller und “ruhiger”.

Auffällig sind die Änderungen bei den globalen Bedienelementen: Die Toolbar am oberen Bildschirmrand ist neu gestaltet und die Formensprache modernisiert. Einige Elemente, etwa der Freigabestatus, wurden neu positioniert oder in ihrer optischen Gewichtung angepasst. Bei der Nutzerführung werden Redakteure ebenfalls Veränderungen bemerken: Mehrstufige “Wizards” wurden zu Dialogen mit besserer Übersichtlichkeit weiterentwickelt.


Neues Design des FirstSpirit Content Creators
Das neue Status-Dashboard


Zusätzlich sind Funktionen neu dazugekommen, z. B. die Möglichkeit, Schriftgrößen und Formulare zu skalieren und damit besser an die individuelle Arbeitsumgebung anzupassen. Das neue Status-Dashboard fasst User-spezifische Aufgaben sowie hilfreiche Informationen und Aktionen zusammen. Neu ist auch der Medienmanager, der mehr Bearbeitungsmöglichkeiten - zum Beispiel beim Zuschnitt - ermöglicht und im Fullscreen-Modus bessere Übersicht über alle Media Assets bietet.

Was war das Ziel des Redesigns?

Oberstes Ziel war natürlich die Verbesserung der User Experience. Die Herausforderung dabei ist, dass jeder User eine andere Sicht auf UX hat - sie hängt für jeden einzelnen davon ab, welche Erfahrungen er oder sie bisher gesammelt hat. Jemand, der jahrelang mit einer Software arbeitet, hat eine ganz andere Erwartung und Wahrnehmung als jemand, der die Anwendung gerade zum ersten Mal aufruft. Der Herausforderung aus Sicht des UX Designers ist es, beide mit einem neuen Layout abzuholen.

Grundlage dafür ist eine Mischung aus Neuem und Gewohntem: Eine einfache und gewohnte Sprache für Redakteure beizubehalten und gleichzeitig modernes Design und “interaction patterns” aufzugreifen. Niemand soll “FirstSpirit neu lernen” müssen.

Zudem beginnt mit dem ContentCreator Redesign auch eine neue Generation von FirstSpirit Interfaces. Mit dem FragmentCreator haben wir im vergangenen Jahr einen neuen Client gelauncht, der darauf optimiert ist, Omnichannel-Inhalte zu orchestrieren. Das Redesign vereinheitlicht das Look & Feel verschiedener spezialisierter FirstSpirit UIs und führt eine einheitliche Designsprache für kommende Weiterentwicklungen ein.


Wie habt ihr das neue Design entwickelt?

Was die neuen Elemente betrifft, haben wir intensiv in die Weiterentwicklung bestehender Funktionen investiert und dafür eng mit Kunden zusammengearbeitet. Gute UX ist immer auch ein Ergebnis gesammelter Nutzererfahrungen - der Job des Designers ist es dann, Feedback in ein Produkt und eine Designsprache zu übersetzen, die die Bedürfnisse der Kunden möglichst gut erfüllt.

Um sicherzustellen, dass die aktuellen User übergangslos in der neuen Umgebung zurecht kommen, haben wir insbesondere auf Tests mit Bestandskunden gesetzt. Ziel war es, das richtige Maß an Veränderung zu finden, um besser zu werden, ohne Nutzer zu überfordern. Gleichzeitig haben wir uns angeschaut, wie Erstnutzer mit der Software interagieren. Hier ist es wichtig, dass User schnell und intuitiv “Erfolgserlebnisse” haben, ohne eine Doku lesen oder eine Schulung besuchen zu müssen.

Mindestens genauso wichtig ist der Blick über den Tellerrand: Mit der Evolution des Web kristallisieren sich produkt- und kanalübergreifende UI-Konventionen und Patterns heraus, die von Usern intuitiv verstanden werden. Ein Beispiel dafür sind drei vertikal angeordnete Punkte mit der Bedeutung “weitere Optionen“. Es ist sinnvoll, solche etablierten Bedienkonzepte aufzugreifen - sie sind wichtige Signale, damit User eine UI als “modernes Interface” wahrnehmen.

Vergleich altes Design des Medienmanagements im ContentCreator mit neuem Design.
Vergleich Medienmanagement altes Design vs neues Design

Die Aufgaben der Marketer werden immer komplexer, die Tools immer mächtiger - wie sieht die Zukunft von UX aus?

Tools in allen Bereichen übernehmen schon heute viele Aufgaben des Users - sie sind nicht mehr nur noch ein “Werkzeug” zur Ausführung einer Aufgabe, sondern gleichen schon eher einem externen Gehirn. Software versucht an vielen Stellen nach “best-guess” zu unterstützen und die Ziele des Users vorauszusehen - ihm Antworten zu liefern, bevor er selbst überhaupt die Frage gestellt hat und auf Basis von erlerntem Verhalten die nächsten Schritte zu erahnen.

“Werkzeuge” waren immer dazu konzipiert, dem Benutzer Arbeit abzunehmen - das tun sie auch weiterhin, nur auf anderen Ebenen. Das, was früher das Werkzeug war, um den Menschen die physische Arbeit abzunehmen ist jetzt die KI, die alle Informationen zusammenstellt und eine Entscheidungsgrundlage bietet.

Eine Tendenz in der Software-Evolution kann man für die UX schon jetzt ganz gut beobachten: Tools, die unterstützen, bevor man als User überhaupt gemerkt hat, dass es ein “Problem” gibt, oder man überhaupt Unterstützung benötigt. Plus nahtlose Integration ins “echte Leben”, sodass man die Softwareunterstützung als so natürlich und selbstverständlich wahrnimmt, dass sie nicht mehr als externes Werkzeug, sondern als Bestandteil des Lebens angenommen wird.

Manchmal wird das unter der knackigen Überschrift “No UI is the best UI” zusammengefasst. Aber bis es soweit ist, konzentrieren wir uns darauf, unsere UIs so UX-optimal wie möglich zu gestalten.

Changelog

Feature: Zu finden im:
Full-screen Medienverwaltung mit großen Vorschaubildern und erweiterten Funktionen, z.B. Zuschnitt und Medien-Bookmarks Bild-Icon in der Toolbar
Zentraler Einstiegspunkt für die Erstellung neuer Inhalte +-Icon in der Toolbar
Status-Dashboard für benutzerspezifische Aufgaben und “next-best actions” Sprechblase-Icon in der Toolbar
Menü mit erweiterten Optionen (Hilfe, Skalierung) drei vertikale Punkte in der Toolbar
Größenskalierbare CMS-Elemente (Icons, Formulare, Dialoge, Texte) drei vertikale Punkte in der Toolbar
Zuletzt besuchte Elemente in der Report-Bar nach links weisendes Dreieck
Kontextspezifische Aktionen und Infos “Page” Dropdown-Menü in der Symbolleiste
Deep-Links per URL zu Inhaltsseiten global
Geändert: Zu finden im:
Farben, Icons, Anordnung von UI- und Steuerelementen mit dem Ziel besserer Benutzerfreundlichkeit global
Neu positionierte Elemente rechts in der Toolbar:

Freigabestatus
Multiperspective-Preview
Medienverwaltung
grüner/oranger Abschnitt der Toolbar
“Devices”-Icon
Bild-Icon in der Toolbar
Lineare Dialoge anstelle bisheriger mehrstufiger Assistenten z.B. neue Seite anlegen
Hilfe ist unter "erweiterte Optionen" verfügbar drei vertikale Punkte in der Toolbar

Jetzt Demo anfordern und neues Design testen:

Zum Formular!

About the author

Romy Fischer
Partner Marketing Manager

rfischer@e-spirit.com