Design Power für das neue Drupal Admin User Interface

Sascha EggenbergerMärz 2019

Mein Engagement für Drupal

Ich bin Teil der Drupal-Initiative «Admin UI & JavaScript Modernisation». In meiner Freizeit arbeite ich mit verschiedenen Designern aus der Community an einem neuen Gewand für Drupal. Als erstes Teilprojekt steht die Erarbeitung eines Design-Systems für Drupal im Fokus. Erster Output aus dieser Arbeit ist ein neues Admin-Theme namens «Claro» (spanisch für «Klar»), welches in einer Vorabversion in den kommenden Wochen zur Verfügung stehen soll und voraussichtlich in Drupal Core 8.8.0 als «Experimental» Theme enthalten sein wird. Dies ist ein erster Schritt auf dem Weg zu einem komplett neuen Admin User Interface (UI) für Drupal. Hier stehen wir noch ganz am Anfang mit User Studies und Wireframes. Das langfristige Ziel ist es, ein einfacheres, modulares und für Content-Editoren benutzerfreundliches Interface zu erstellen.

Abbildung 1: Sascha Eggenberger und Cristina Chumillas geben am Drupal Mountain Camp Einblick in das Redesign des Admin UI.
Abbildung 1: Sascha Eggenberger und Cristina Chumillas geben am Drupal Mountain Camp Einblick in das Redesign des Admin UI.

Meine Motivation hinter meinem privaten Engagement für Drupal ist der Open-Source-Gedanke. Ich bin seit über sieben Jahren Teil der Drupal-Community. Als Designer gibt es seltener Chancen, der Community etwas zurückzugeben. Deshalb habe ich keine Sekunde gezögert, mich an dieser Initiative zu beteiligen, als ich davon Wind bekommen habe.

Technik und Design arbeiten Hand in Hand

Die Initiative entstand als Zusammenschluss aus ursprünglich zwei verschiedenen, parallelen Programmen. Das eine kümmerte sich um die Modernisierung des JavaScript Frameworks, also mehr um technische Aspekte, und das andere um ein neues Look & Feel der Admin-Oberfläche. Durch den Zusammenschluss der Initiativen können wir gemeinsam ein gesamtheitliches Erlebnis für Administratoren aus Technik- und aus Design-Sicht schaffen.

Die Initiative ist in mehre Teilprojekte unterteilt:

  • Ausarbeiten eines Drupal Design-Systems

  • Modernisierung der JavaScript Frameworks

  • Überarbeitung des aktuellen Admin Themes

  • Neues UI

Der Weg zum neuen Drupal Admin User Interface

Viele der Teilprojekte gehen Hand in Hand und auch parallel vonstatten. Aus der Designperspektive arbeiten wir aktuell an der Finalisierung des Design-Systems und des daraus resultierenden neuen Admin Themes. Dieses neue Theme ist ein erster Quickwin. Rein technisch ändert sich nicht viel, viele Dinge wurden bereits «unter der Haube» modernisiert, wie zum Beispiel die Frontend-Umsetzung.

Parallel dazu beginnen die Arbeiten für das neue UI. Hierzu gibt es bereits erste Scribbles und Wireframes (siehe Abbildung 2). Die Wireframes werden aktuell mit Content-Editoren und anderen Benutzern getestet, um möglichst zeitnah ein erstes Feedback zu erhalten.

Abbildung 2: Ein Wireframe des neues Admin UI, welches zur Zeit getestet wird.
Abbildung 2: Ein Wireframe des neues Admin UI, welches zur Zeit getestet wird.

Wir wollen, dass das neue Admin Theme «Claro» so schnell wie möglich in einer Vorabversion einsetzbar wird (siehe Abbildung 3). Diesen Meilenstein sollten wir im Verlauf dieses Frühlings schaffen. Jedoch muss das Theme zu diesem Zeitpunkt noch manuell installiert & aktiviert werden. Auf die Fahne geschrieben haben wir uns, das Theme dann mit Drupal 8.8.0 (siehe Roadmap Drupal) im Dezember auszuliefern (ggf. zuerst als experimentales Theme) um es anschliessend kontinuierlich weiterzuentwickeln.

Abbildung 3: Ausschnitt aus der Claro Admin Toolbar
Abbildung 3: Ausschnitt aus der Claro Admin Toolbar

Accessibility treibt das Design

Der Zugang für alle ist ein wichtiger Faktor im Designprozess für das neue Design-System und das neue Admin Theme. Wo nötig stecken wir im Design zurück – etwas weniger "fancyness" – um dafür in Accessibility zu punkten. Farben, Schriftgrössen, Auszeichnungen, Fokus etc. werden optimiert und fortlaufend getestet, damit ein gesamtheitlich funktionales Design entsteht.

Einblick am Drupal Mountain Camp

Am diesjährigen Drupal Mountain Camp habe ich zusammen mit Cristina Chumillas einen Talk über den aktuellen Stand des Redesign des Admin UI gehalten. Ziel war es, einen Einblick in das Design-System, das Claro Admin-Theme “Claro” und das zukünftige UI zu geben. Hier könnt ihr unseren Talk nachverfolgen: https://www.youtube.com/watch?v=0fs2umEJbug

Kontakt für Ihre digitale ​Lösung mit Unic

Termin buchen

Sie möchten Ihre digitalen Aufgaben mit uns besprechen? Gerne tauschen wir uns mit Ihnen aus: Jörg Nölke und Gerrit Taaks (von links nach rechts).​

Gerrit Taaks

Wir sind da für Sie!

Termin buchen

Sie möchten Ihr nächstes Projekt mit uns besprechen? Gerne tauschen wir uns mit Ihnen aus: Melanie Klühe, Stefanie Berger, Stephan Handschin und Philippe Surber (im Uhrzeigersinn).

Melanie Kluhe
Stefanie Berger
Philippe Surber
Stephan Handschin