Internetagentur für Webdesign, Webentwicklung und Onlinemarketing

Donnerstag, 30. Januar 2014

MODX Manager Re-Thought

After an early preview of the new MODX 2.3 Manager has been shown at MODXpo 2013 in Cologne, some very talented designers and agencies contributed mock-ups of their own vision for a new MODX manager. Since I now have used MODX for many projects and having designed and developed an ExtJS-based backend a few years ago by myself, I've made my own mock-up that I'd like to share with you.

So here is the result of my thoughts, that were highly inspired by mock-ups from the guys over at Sterc and EdenWeb.

One of my biggest concerns about the current MODX manager is that while developing a website with it, you cannot quickly switch between a document, a chunk, a snippet or even some security settings, without closing the active editor. I often find myself having several browser tabs open at once, that contain different manager pages. So I was thinking about how this could be improved and came up with the idea to have the manager open its manager pages in its own tabs. So when you want to edit a page, instead of reloading the whole manager with the page editor, the manager just opens a new tab for it. Same goes for chunks, snippets, plugins, even system settings, package management or security settings. You then can quickly switch between different manager pages, and if you're done, simply close the tab.

​Another thing I tried to achieve was that the manager uses the whole browser window in a way that no "first-level" feature can ever scroll out of view. This is for example currently the case, when you have a huge resource tree open, that is higher than the browser window: if you scroll down, the tabs and buttons at the top are no longer accessible. With my mock-up, the dark, left pane would always fill the whole height and only the resource tree contents would be scrolled. Same goes for the right pane with document settings, template variables and so on, so the content editor and all settings "tabs" always remain visible.

My motivation behind this is just the same as EdenWeb's: contributing something that can be further improved upon to the community, hoping that some ideas will be adopted in a future version and the interface becomes a little simpler, quicker more user-friendly and more fun to use.

So please, let me know what you think, get involved and improve it! You'll find all the sources (that's basically just a document made in Sketch) over at GitHub.


Über den Autor

Christian Bartels arbeitet bereits seit 1999 als Webdesigner. Nach seiner Ausbildung zum Mediengestalter für Digital- und Printmedien arbeitete er bei einer führenden Agentur für Direktmarketing und entwickelte für zahlreiche renommierte Kunden erfolgreiche Websites, Internet-Anwendungen und Kampagnen zur Gewinnung neuer Kunden und Interessenten.


5 Kommentare

  1. empiguet

    Hey ! Opening stuff in tab is a great idea !

    Antwortenempiguet am 30. Januar 2014, 18:35 Uhr

  2. Peter Knight

    Nice work. I like the way the darker Resource Tree focuses the user on the content etc.

    AntwortenPeter Knight am 30. Januar 2014, 21:07 Uhr

  3. Pavel Lautsevich

    Good work!

    In my opinion, color palette Edenveb perceived easier. But you have a great idea to work with internal tabs! You need combine efforts!

    AntwortenPavel Lautsevich am 02. Februar 2014, 15:09 Uhr

  4. Neil

    This looks great. I love the idea of different colors for each button.

    AntwortenNeil am 28. Mai 2014, 06:27 Uhr

  5. Max

    I think these are great suggestions - the tabbed editing would solve a particularly frustrating problems when developing a site in the early stages as you switch between lots of elements.

    The darker Resource Tree looks good too, it's a nice touch.

    AntwortenMax am 31. Januar 2015, 00:27 Uhr

Kommentar hinzufügen