Design suggestions megathread

[henrygd]

Please post any ideas for design improvements in this thread. And upvote the ideas you like.

Don't worry about critiquing the current design. I'm not an expert and won't be offended. It's helpful to get tips from people who are better at it.

For reference, the app uses shadcn/ui, so any components / layouts from there should be easy enough to implement.

[henrygd]

To start, here are suggestions from @alex3305 in issue #31:

Thanks for creating this nifty little tool. As you can probably tell I have been experimenting with it all day and enjoying it really well. One thing I have noticed is that the current layout has pretty low information density. This works really well on mobile, but perhaps not so on desktop. I think it would improve the project with very slight layout changes on larger screens. I have made some mockups to show what I mean:

[alex3305]

Repasting the images so they are also visible here:

[henrygd]

Updated in 0.2.0. Thanks again for the suggestions!

[henrygd]

I like these changes a lot, but I'm not sure about the buttons in the top bar shifting around. So I think it might be better to have the "Add System" button on every page.

I also find it helpful to line up CPU spikes vertically with docker containers, so maybe we can make the grid configurable. A button that switches between full width and side-by-side layouts. Or otherwise have the CPU charts full width and everything else in the grid.

Any thoughts are appreciated!

[alex3305]

First of all thanks for your openness to discuss these suggestions. That is greatly appreciated 🚀. I saw your reply in #31, but will reply here with your comments inline for consistency.

I like these changes a lot, but I'm not sure about the buttons in the top bar shifting around. So I think it might be better to have the "Add System" button on every page.

Having the same top bar for all pages (=uniformity) was always my intention, but for my mock-ups I just moved around some elements. Doing that across pages was a bit tedious so I omitted that. I should have a been a little more clear about that though.

For the charts, I was split on whether to go with the 2x2 grid. I agree it's much better for getting a quick overview of the system.

Both are fine. Don't worry about it. However on desktop IMHO a 2 column grid would suit better, but I guess that's also a matter of preference.

A button that switches between full width and side-by-side layouts.

What I would do is make two layouts:

• Single column
• Two column

I would make the single column default on mobile devices (ie. <700px) and two column on screens with more real estate. On those bigger screens I would also add a button to switch between the two. On those smaller screens I wouldn't show the button. But that's just how I should have do it. It doesn't mean that's the best way, just my preference 🤷 .

Or otherwise have the CPU charts full width and everything else in the grid.

I wouldn't mind having the CPU chart half width. Even half chart has plenty of information density. However I mostly look at trends and previous x-minutes.

---

The only thing from the current layout that really bothers me are the Docker CPU and Docker Memory tooltips. I have about 60 containers running and the thing is borderline unusable. On the cAdvisor dashboard that I previously used there is a table next to the graph with all the containers. Which is way more usable.

[henrygd]

I agree with pretty much all of this.

Someone suggested having a filter bar on container charts so you could search through the items in the tooltip. And possibly update the chart to show only the matching containers.

Having a little table like the cadvisor example is more functional, but where could we fit that in? I'm even open to a major redesign. I just want something that's usable and doesn't look like shit.

[utlilb]

I would love to have the ability to add/remove/rearrange columns on the main screen.

[henrygd]

I'll probably add column display selection in the next release or two.

[ctrlaltdelete007]

Thanx for the great new layout!
Is it possible to use more than one filesystem entry? md2; md3 What would be the syntax?
FILESYSTEM: /dev/md3

[henrygd]

Not yet. Hopefully in the next release. See #36.

[Simonh2o]

Missing the single (non-split) layout already, hoping it will be customizeable in future releases!

[henrygd]

I'll add a way to toggle it.

[lephtHanded]

main page options:
current load in page is a list of all the hosts with some information for them.

could there be a user chosen main page, or link to a page that has a certain stat for ALL hosts... then you can click in to them for more information?

scenario: i like looking at bandwidth, others may prefer Disk I/O or CPU usage... what ever stat you like most.

• the page I want to see has all the bandwidth graphs sitting cozy to each other like the host view of all stats.
• each graph labeled Bandwidth-[hostname]
• if there is some weird spike and i want to investigate, i click that hosts chart and boom, i'm looking at that hosts full stats.

[henrygd]

Yes, I mentioned exactly this in #29 and it's in the queue after webhook alerts and a couple other things.

[TheTaran]

Will there integration of SNMP checks? With the Agent is only possible to check Servers/Systems with a accesible OS. With SNMP integration it will be possible to integrate also Network devices in one Dashboard (Full OVerview.)

[henrygd]

I have no experience working with SNMP, so probably not. At least not in the near future.

Feel free to open an issue with more information on exactly what you'd like to see and I'll look into it further down the line.