[Lens] Improve interface when only visual options are visible

[markov00]

When using the Gauge chart or a table visualization, there is only a single button on the top of the workspace for the visual options. This button now, without the chart switcher feels a bit lonely and out of context. We should find a way to fill up that space.

In the same context, I also see the missing alignment of the chart panel with the rest of the page, as it now (after applying all the aspect ratios) feels floating in the middle of the page.

A couple of possible solutions/suggestions:

• align the chart panel always to the top of the workspace
• let's consider the introduction of the chart title and description as an element on the page
• move the Visual options and other options to the right side of the screen (these need to be accessible also in the inline editing experience so it's worth starting moving them to the side

@MichaelMarcialis We need your input here

[elasticmachine]

Pinging @elastic/kibana-visualizations (Team:Visualizations)

[dej611]

move the Visual options and other options to the right side of the screen (these need to be accessible also in the inline editing experience so it's worth starting moving them to the side

I like that. I was going to propose it as well.

[MichaelMarcialis]

align the chart panel always to the top of the workspace

I'm a bit torn on this one. On one hand, I can appreciate bringing the visualization panel in closer proximity to the toolbar. On the other hand, with the introduction of aspect ratios and min/max widths for certain visualization types, I fear this would leave a lot of empty space below certain visualizations and look a bit odd/sparse.

Part of the current "floating" feeling is likely coming from the lack of visual framing between sections like the layer panels and field list (which are aligned top) and the visualization itself (which is aligned center). Perhaps an alternative would be to retain the center vertical alignment of the visualization, but restore some kind of stylistic divider between the three primary sections (field list, visualization, layers). This could come in the form of borders, background colors, etc. Thoughts?

let's consider the introduction of the chart title and description as an element on the page

I like this idea, especially if we intend on keeping the toolbar in its current location. We could display the title of the visualization saved object and offer an edit button to allow users to change the name or description of it if they wish (without relying on the save modal).

move the Visual options and other options to the right side of the screen (these need to be accessible also in the inline editing experience so it's worth starting moving them to the side

This may work as well, seeing as we already show the toolbar above the layer panels in the inline flyout editor already. The one thing to consider here is that the toolbar space above visualization is also used to house any conditionally appearing errors/warnings and the "apply" button (when auto-apply is disabled). Would we want those to also move above the layer panels? Would there be enough space to do so? And would such a change hurt discoverability?

---

Additionally, I've been considering whether the toolbar menus are even necessary in some cases. For example, could the current axes toolbar menu settings appear within individual layer axis dimension configuration flyouts (accounting for shared axes, like a histogram's x-axis, by updating any shared settings dynamically across both dimensions)? Another example could be migrating visual toolbar settings like line interpolation and missing values to the individual layer settings flyouts. Would it make sense for us to perform an audit of all existing toolbar settings and see if it makes sense to continue to house them there or if they should be relocated/consolidated elsewhere in the interface? Or do we prefer to continue to offer these settings apart from the layer panels?

In any case, I'd be happy to do some explorations on these proposed changes. How would ya'll like me to prioritize this? I'm currently assisting the management team with some designs, but if this is a high priority, I can move it to the top of my to-do list. Let me know.