Contao Backend Studie

Grundgedanken

• optimiert für Mobile Geräte
• bessere Ausnutzung des verfügbaren Bildschirms
• ersetzen der bisherigen Icons durch svg-Grafiken, oder Icon-Fonts
• übersichtlichere und besser zu erfassende Darstellung der jeweiligen Inhalte
• weniger Klicks und Seitenaufrufe
• Laden von Inhalten durch eine konsequente Nutzung von AJAX

Im nachfolgenden findet ihr die Mockups und Erklärungen für den Desktop.

Listenansichten

Generell gilt eine zweigeteilte Darstellung (Bild 3) der Inhalte in Listenbereich (links) und Bearbeitungsbereich (rechts), insofern der Platz am jeweiligen Bildschirm zur Verügung steht.

In der Artikelliste werden die Seiten in grau hinterlegten Blöcken dargestellt und bei Untergeordneten Elementen eingerückt. Die bearbeitbaren Artikel werden immer in weißen Blöcken dargestellt.

Button für Filtereinstellungen, Sucheinstellungen, neuer Artkel etc. sind fix oberhalb der Liste positioniert und bleiben somit auch beim Scrollen der Liste im sichtbaren Bereich. Filtereinstellungen (in andere Listen) und Sucheinstellungen sind über eigene Button zu erreichen und werden erst bei Aktivierung eingeblendet.

Die Icons zur Bearbeitung von Artikeln werden erst on Mouse-Hover (Bild 2) am jeweiligen Artikel angezeigt. Das bringt mehr Ruhe und Platz in die Übersicht.

Für jede Seite gibt es ein eigenes Icon für die Frontend-Vorschau. Der Aufruf über das Seiten-Icon wäre somit hinfällig.

Bearbeitungsbereich

Das Aufrufen des Bearbeitungsbereichs erfolgt mittels AJAX Request.

Der zu bearbeitende Artikel wird in der Liste farblich (grün) hervorgehoben. Zu jeder Zeit kann in der Artikelliste ein anderer Artikel zur Bearbeitung angewählt werden.

Die Formulare werden im wesentlichen so beibehalten, jedoch die Formelemente optisch aufgearbeitet.

Sie Speichern-Button entspechen der Funktion der Listenansicht.

Menü

Das neue Menü findet am linken Bildschirmrand (Desktop, Tablet) in Form eines Iconmenüs seinen Platz, wobei nur die einzelnen Bereiche (Inhalte, Themes, Benutzerverwaltung etc.) angezeigt werden. On Mouse-Hover werden dann die jeweiligen Unterpunkte angezeigt.

Das Iconmenü lässt sich jederzeit über ein eigenes Menü-Icon ausgeklappen und fixieren. Die Unterpunkte des aktiven Bereichs werden dann permanent angezeigt. Listen und Bearbeitungsbereich passen sich in ihrer Breite an den verfügbaren Platz an.