Grid Redesign

[EdwardBock]

@kroppenstedt

Sorry for assigning us two but lets have a look on a new ui pattern toghether.

[EdwardBock]

@kroppenstedt is redesigning the Grid. But I'd really like to here the experience and ideas of @palasthotel/developers so we can use it for the redesign.

[juliakleinediekmann]

I would like to have better usability for reusable boxes. The interface is very poor compared to the rest of the grid and because this is a more complex feature the poor interface makes it even harder to understand.

I have not heard any negative feedback on other issues, so that's it for me:)

[greatestview]

Nice to hear that there is going to be progress :) My rough thoughts on what needs improvement (with descending priority):

• Reducing Clutter, reducing horizontal and vertical lines. Currently there is happening a lot visually. It is difficult to distinguish between the draggable Container header and the Boxes, because they look the same. The Boxes should stand out more from the Containers (Darker Container background? No need for the white draggable Container header, that could be transparent).
• Fonts. The Box content could me more prominent, there is a lot of space. A font-size of 11px is difficult to read.
• Information. The Boxes should reveal all Box specific settings (items count, offset, style, viewmode, post type etc.). I find it really hard to tell at a glance, which Box tyles are placed. The Box type could be focussed by a bigger font size, or why not use different background colors for different box types?
• Overlay. As already proposed, an overlay for the edit mode makes a lot of sense. Currently you loose focus when switching to and from the edit mode.
• Unified actions for Container and Boxes. Currently the buttons for editing and deleting Boxes look different to the Container ones. Maybe there is also a way to make them visible by default?
• Container/Box toolbar categories expanded by default, that would a) speed up work a lot and b) would allow unexperienced users to see all possibilities at a glance. I think the list of Containers and Boxes is not that long that we really need to collapse them.
• On Edit screen: Prolog/Epilog expanded by default, if edited. Currently you might miss important information, because Prolog and Epilog are collapsed by default. On the other hand, expanding Prolog and Epilog by default also makes no sense. My idea: Expand Prolog and Epilog only if they differ from the default settings.
• A readmore link should only be created when text and link are given. Currently it is possible to create a readmore link without link. That makes no sense.
• Move Toolbar to top? Just a suggestion, which may work. If we move the publishing buttons and the Container/Box lists to a vertical toolbar on top, we gain more space for the Grid to the sides (death to sidebars!). The Container and Box lists could be dropdown-lists (next step: searchable, see the mite project and services lists). Then there would also me more space, so that we could include labels for the publishing buttons to decrease confusion about their meanings.
• Place loading indicator where something is happening. Currently there is only one loading indicator, which overlays the grid, even when loading lists in the sidebar (e.g. when clicking on Box -> Lists). Another nice way of solving this issue is using Promise Buttons (loading state visible inside the button left to the button text).