UX Unterstützung für CMSBOX

Interaktionskonzept Content Management

Zusammen mit der Berner Firma CMSBOX GMBH durften wir das Interaktionskonzept der neuen Version des hauseigenen Content Management Systems „CMSBOX“ erarbeiten.

Seit über 10 Jahren bietet das innovative Content Management System CMSBOX ein sogenanntes „inline editing“ an. Was heisst, dass Content Manager direkt innerhalb der Webseite Ansicht auch bearbeiten können, ohne dass man in ein Backend (Bearbeitungs-Modus) des Systems wechseln muss. Dafür wurde die CMSBOX sogar mit dem Swiss Web Award ausgezeichnet. Für die neue Version 3.0 wurden wir angefragt das CMSBOX-Team hinsichtlich User Experience Design zu unterstützen.

Vorgehen

Interaktive Wireframes mit Invision-Prototype
Interaktive Wireframes als Invision Prototyp

Interaktive Wireframes

Erste Iterationen des Interaktions-konzeptes fanden anhand von Wireframes statt, welche mit Hilfe eines Invision Prototyps interaktiv wurden. Somit konnte das ganze Projekt-Team die Idee der neuen Interaktion und Abläufe anhand von interaktiven Screens erleben, um diese auf die Machbarkeit zu überprüfen.

Funktionaler Prototyp

In einer weiteren Phase wurde das neue Konzept vom Entwicklungsteam der CMSBOX GMBH in eine Testinstallation integriert. Der funktionale Prototyp diente als Grundlage für die bevorstehenden Benutzertests. Denn nur mit einem qualitativ hochwertigen Funktions-Prototypen konnten wir die komplexen Interaktionen und Abläufe auf Effizienz und Verständnis testen.

cmsbox-user-testing
Remote User Test via Skype

User Testing

Nachdem das neue Interaktionskonzept als funktionaler Prototyp implementiert wurde, starteten wir mit den Benutzertests. Die Tests wurden Remote durchgeführt, dass heisst, die Benutzer haben via Skype am Test teilgenommen und mussten somit nicht extra nach Bern anreisen. Die Test-Szenarien wurden auf das schnelle Erfassen von Inhalten („Fast Content Creation“) ausgelegt. Die Erkenntnisse der Benutzertests waren sehr hilfreich und dienten als Grundlage für weitere Design-Iterationen, welche schlussendlich zum Endprodukt führten.


Das neue Interaktions-Konzept

Schnelle Inhaltserfassung

Das ganze Interaktionskonzept haben wir mit Fokus auf „fast content creation“ erstellt. Eine Website sollte möglichst schnell mit Inhalten befüllt werden können. Deshalb werden nun dem Autor die nötigen Optionen im Kontext zur Auswahl gezeigt. Ein Beispiel dafür ist, wenn ein Text editiert wird, wird die Toolbar erst dann angezeigt, wenn der Content Manager auch wirklich diese Aktion auslösen möchte. In diesem Fall, sobald der Text selektiert wird.

Inhalte hinzufügen

In der CMSBOX können verschiedene Inhaltselemente hinzugefügt werden. Diese stehen neu beim Aufbau der Seiten direkt im Inhaltsbereich zur Verfügung. Eine Schaltfläche „+“ öffnet die verschiedenen Möglichkeiten wiederum im Kontext der Website. Diese Optionen werden dem Benutzer da angezeigt, wo er die Inhalte auch erfasst. Somit verliert dieser keine unnötige Zeit, um den Mauszeiger zum Beispiel zur Seitenleiste zu bewegen, um dann die gewünschte Option auszuwählen.

Responsive Design

Die neue Version des Content Management Systems sollte den neusten Ansprüche der Webtechnologien und vor allem des Responsive Designs entsprechen. Kunden sollten die auf der CMSBOX basierten Websites in den verschiedenen Gerätegrössen innerhalb des CMS testen können, um das Bewusstsein der Autoren für die unterschiedlichen Endgeräte zu fördern. Deshalb gibt es neu einen sogenannten „Device Switch“, mit welchem die Webseite während dem Bearbeiten auf den verschiedenen Bildschirmgrössen getestet werden kann.

Weiter war der Anspruch, dass alle Interaktionen auf Touch-Bedienung ausgelegt werden, damit eine Website auch auf einem mobilen Gerät bearbeitet und somit von unterwegs einfach aktualisiert werden kann.

 

Detaillierte Funktionen der CMSBOX können auf der Website cmsbox.ch gefunden werden.

Art
Interaktionskonzept für CMSBOX

Kunde
CMSBOX GmbH

Leistungen
Design

Website
https://www.cmsbox.ch/cms

cmsbox screenshot features

SWICA Blogs

Statt wie bisher ihre Geschäftskunden mit Broschüren und Flyer zu informieren, hat die SWICA Krankenversicherung sich entschieden, einen Blog zu starten. Wir durften sie dabei vom Start bis zum Launch im April 2018 und darüber hinaus begleiten.

SWICA Magazin

SWICA bringt 4 mal pro Jahr ihr Haus-eigenes Print-Magazin „aktuell“ raus und verteilt dieses an ihre Kunden. Um mit dem Magazin noch mehr Leser zu erreichen, haben wir die SWICA dabei unterstützt, das Magazin online zu bringen. Ähnlich wie beim Print-Magazin, gibt es jede Ausgabe als eine geschlossene Einheit. Dazu haben die Leser auf einem …

Swisscom Wettbewerb

Lange standen sie fast an jeder Ecke, spätestens seit dem Siegeszug des Handys fristen sie jedoch ein einsames Dasein: die Publifon-Telefonkabinen. Laufend werden die letzten verbliebenen Kabinen abgebaut, eine Ära geht zu Ende. Was war das Ziel des Projektes? Swisscom wollte den 10 letzten Telefonkabinen ein zweites Leben ermöglichen und sie kreativen Köpfen überlassen. In …

Kaufleuten Website & Payment Integration

Für das Kaufleuten in Zürich haben wir ihre Website einem kompletten Redesign mit Mobile-First Ansatz unterzogen. Zudem durften wir ihr Ticketing-System um eine Payment-Integration erweitern. Nun können Veranstaltungen nicht nur reserviert, sondern auch gleich online bezahlt werden.

klingler consultants Corporate Website

Für klingler consultants durften wir ihren ganzheitlichen Webauftritt neu gestalten und umsetzen. In Zusammenarbeit mit unserem Partner Fotograf Boris Baldinger ist die Bildsprache der Teambilder entstanden.

foodward Website für Weiterbildungen

Wir arbeiten bereits seit einigen Jahren mit foodward zusammen und hatten nun die Gelegenheit, ihre Website neu zu gestalten, um die Ausbildungsangebote und das Food-Netzwerk entsprechend zu präsentieren.

MAAG Music & Arts AG Event-Websites

Für MAAG haben wir die Websiten für Ihre Veranstaltungen redesigned. Dazu gehören nebst den Hauptseiten auch all ihre Show-Websites, wie zum Beispiel die des bekannten Schweizer Musicals „Ewigi Liebi“. Alle Seiten haben wir komplett neu gestaltet und mit WordPress umgesetzt.

Swiss Moving Media Ad Calculator

Wir haben eine auf WordPress basierte Webapplikation gebaut, um die Buchung von Inseraten für gleich vier Städte – Genève, Basel, Lausanne und Zürich – zu ermöglichen.

Tageswoche Artikel Detail

TagesWoche Design und Konzeption für die News Plattform

Zusammen mit Adrian Zumbrunnen haben wir das Team der TagesWoche beim Redesign von tageswoche.ch in Bezug auf Konzeption und Design unterstützt.

Swisscom Magazin

Ehemals als “KMU Business World” bekannt, versorgt das Swisscom KMU-Magazin kleinere und mittlere Unternehmen in der Schweiz mit Erkenntnissen und Artikeln rund um Management, Technologie, Marketing, Finance und mehr.

Pro Helvetia Website

Pro Helvetia ist die offizielle Schweizer Kulturstiftung. Pro Helvetia fördert Schweizer Kunst und Kultur mit Blick auf Vielfalt und hohe Qualität. Als Förderinstitution des Bundes unterstützen sie Vorhaben von gesamtschweizerischem Interesse.

CSS Versicherung Blog

Die CSS Versicherungen ist die grösste Schweizer Krankenkasse und bietet ihren Kunden neben den gesundheitlichen Leistungen auch Informationen in Form von Print-Magazinen und Online-Publikationen. Der Blog spielt dabei eine sehr wichtige Rolle.