Bug 385992 - Discover's sidebar is too wide by default
Summary: Discover's sidebar is too wide by default
Status: RESOLVED FIXED
Alias: None
Product: Discover
Classification: Applications
Component: discover (show other bugs)
Version: 5.11.1
Platform: Other Linux
: NOR minor
Target Milestone: ---
Assignee: Aleix Pol
URL:
Keywords: usability
: 389362 (view as bug list)
Depends on:
Blocks:
 
Reported: 2017-10-20 15:38 UTC by Nate Graham
Modified: 2018-02-22 23:03 UTC (History)
3 users (show)

See Also:
Latest Commit:
Version Fixed In: 5.12.3


Attachments
Current too-wide sidebar (109.51 KB, image/jpeg)
2017-10-20 15:38 UTC, Nate Graham
Details
Mockup of proposed new design (369.51 KB, image/png)
2017-10-20 15:38 UTC, Nate Graham
Details
Discover with the sidebar forced to 280 pixels (376.46 KB, image/png)
2018-02-19 00:10 UTC, Nate Graham
Details

Note You need to log in before you can comment on or make changes to this bug.
Description Nate Graham 2017-10-20 15:38:25 UTC
Created attachment 108477 [details]
Current too-wide sidebar

Discover's sidebar is really wide, and mostly consists of whitespace. This issue, along with https://bugs.kde.org/show_bug.cgi?id=385973, causes Discover's main window to take up a lot more space than it needs to, making Discover's brand identity feel wasteful and not respectful of your limited screen real estate.

I propose dropping the default width of the sidebar by a bit. Mockup attached.
Comment 1 Nate Graham 2017-10-20 15:38:56 UTC
Created attachment 108478 [details]
Mockup of proposed new design
Comment 2 Aleix Pol 2017-10-23 15:50:52 UTC
This is something to discuss with Kirigami overall. We can't be randomly overriding widths in Discover. Especially on such subjective matters, especially discussing just in bugzilla.
Comment 3 Nate Graham 2017-10-23 16:04:53 UTC
I discussed this with Thomas Pfeiffer in #kirigami and we discovered that the sidebar automatically sizes itself to accommodate the widest element, which is currently the top graphic: banner.svg. That graphic could be reduced in width, which would make the sidebar narrower.

Alternatively, we could get rid of the header graphics entirely, which would make this a duplicate of https://bugs.kde.org/show_bug.cgi?id=385973

How should we proceed here?
Comment 4 Nate Graham 2017-10-23 20:51:18 UTC
Actually I tried reducing the width of the SVG by 25%, but it was just scaled up to match the original width of the sidebar, so I don't think the width of the header graphic alone is what's causing the excessive sidebar width.
Comment 5 Nate Graham 2018-01-24 15:27:46 UTC
*** Bug 389362 has been marked as a duplicate of this bug. ***
Comment 6 Nate Graham 2018-01-28 21:36:18 UTC
I think this might be the problem: https://cgit.kde.org/kirigami.git/tree/src/controls/GlobalDrawer.qml#n215
Comment 7 Nate Graham 2018-02-19 00:07:31 UTC
Yep, that's it. In src/controls/GlobalDrawer.qml, root.parent.width is getting set to an absurdly low value, so it falls back to the minimum value of Units.gridUnit * 20 (which I believe works out to 360 pixels). This results in a sidebar that's far too wide and also doesn't adjust to wide values (the worst of both worlds).

It seems like there are a few bugs here:
- Units.gridUnit * 20 is too high a minimum width.
- root.parent.width is getting set incorrectly, which could be a bug in Kirigami, or a bug in Discover; maybe we're not using the GlobalDrawer correctly.

A trivial workaround in Discover for this bug is to simply override this logic and hardcode a smaller width in discover/qml/DiscoverDrawer.qml with `width: 280`. This looks good in English, but may look less good in languages with longer words like German.
Comment 8 Nate Graham 2018-02-19 00:10:26 UTC
Created attachment 110796 [details]
Discover with the sidebar forced to 280 pixels
Comment 9 Christoph Feck 2018-02-19 01:52:27 UTC
Please do not use absolute pixel sizes. The number of pixels could be computed relative to the font size. I think using the Plasma grid units does exactly that.
Comment 10 Christoph Feck 2018-02-19 01:53:20 UTC
relative to font size == font height in pixels, not points.
Comment 11 Nate Graham 2018-02-19 01:53:51 UTC
Right, I wasn't suggesting that as a real fix, just as something that illustrates with the issue is and how we might work around it if necessary (yes, we'd use gridUnits).
Comment 12 Nate Graham 2018-02-22 23:02:36 UTC
So the root cause of the issue here is that we're using the wrong UI element for Discover's sidebar (see Bug 390928). We use a Kirigami GlobalDrawer for the sidebar, which is problematic because the GlobalDrawer's width is 360 pixels (possibly due to to bug in how we implemented it?) on the desktop--far too wide for our use case (see Bug 390927).

Replacing the GlobalDrawer with a more appropriate UI element is going to be a lot of work, so until then, let's not torture our users with the humongous sidebar any longer and just force it to be a smaller size for now.

Submitted a patch: https://phabricator.kde.org/D10756
Comment 13 Nate Graham 2018-02-22 23:03:02 UTC
Git commit bfa25177805fcb3b57b5db3de063d96b5bfec2e3 by Nathaniel Graham.
Committed on 22/02/2018 at 22:49.
Pushed by ngraham into branch 'Plasma/5.12'.

Reduce sidebar width

Summary:
FIXED-IN: 5.12.3

This is a hack to work around the fact that we're using the wrong UI element for Discover's sidebar (see [[https://bugs.kde.org/show_bug.cgi?id=390928|Bug 390928]]). We use a Kirigami GlobalDrawer for the sidebar, which is problematic because the GlobalDrawer's width is always a minimum of 360 pixels on the desktop--far too wide for our use case (see [[https://bugs.kde.org/show_bug.cgi?id=390927|Bug 390927]]).

Replacing the GlobalDrawer with something more appropriate is going to be a lot of work, so until then, let's not torture our users with the humongous sidebar any longer and just force it to be a smaller size for now.

I think this is a vast visual improvement because it returns the focus to the content, rather than the navigation. It makes Discover feel less "fat."

Test Plan:
Before, small window:
{F5726133}

After, small window:
{F5726132}

Before, medium window:
{F5726113}

After, medium window:
{F5726114}

Before, app page:
{F5726115}

After, app page:
{F5726116}

Before, default view:
{F5726137}

After, default view:
{F5726138}

We may want to consider changing the default window size to be less wide if this patch lands, since with a narrower sidebar, the main view doesn't need to be so wide.

Reviewers: #discover_software_store, apol

Reviewed By: #discover_software_store, apol

Subscribers: acrouthamel, plasma-devel

Tags: #plasma

Differential Revision: https://phabricator.kde.org/D10756

M  +4    -0    discover/qml/DiscoverDrawer.qml

https://commits.kde.org/discover/bfa25177805fcb3b57b5db3de063d96b5bfec2e3