Design feedback

@pinheiro offered some 1:1 feedback about Discover during Akademy 2023 that I will summarize here. This list is quite rough, mostly taken from my hastily-jotted notes. Some of these ideas will not work or will need to be changed, or maybe even be revealed as bad ideas after we've all sobered up. That's okay. The idea is to try as many of them as possible to see what works, what's an improvement, etc.

General

• Constrain everything to a 16px grid
• Move transaction progress view closer to the button you click to make it appear, so it feels connected
• Don't have three-column view in wide mode; it just doesn't work visually. Get rid of the middle column - !996 (merged)
• Move the bottom item group in the sidebar up to the top - 453999c3
• Make the line between the two sidebar sections not span the full width, so it looks more like a menu separator - 453999c3
• Move "Updates" higher up within its section since it's more relevant - f12c640a

Homepage

• Change title to say "Home", not "Discover"; it needs to match the list item text - c880c2cb
• Spacing between cards doesn't match margins - 2be980af
• Use slightly smaller font in the app cards? Maybe?
• Play around with the idea of using a giant blown up, lightened, and blurred app icon as the card background, then reduce the size of the main app icon. Maybe. See if it looks good. If it does, repeat it on the app page
• Maybe reduce size of the app icons in the cards, especially if the above idea works out
• Remove dead space on the top of the view where the scrollview doesn't touch the bottom of the toolbar - 8c9c4a31
• Spacing between homepage sections not the same as the top margin - acb01378

App list page

• Make install buttons on cards be icons-only toolbuttons, but once the icon is nicer
• Use the exact same card layout and layout as on the homepage (i.e. the same delegate in the same grid)

App page

• Main column's variable-but-limited width is bad; it doesn't align with anything - 8831f954
• Screenshots view sucks; try something better lol. Maybe copy GNOME Software's big image and column of thumbnails?
• Buttons that open links should just be links, using Kirigami.URLButton
• Use PlaceholderMessage instead of InlineMessage to communicate errors on the page - 0b28505b
• Install and source buttons feel global in scope because they're disconnected from the page itself; experiment with making them float on the top-right corner of the page, where some of the metadata currently lives. And then that stuff would move elsewhere
• App caption text should be bigger - 9f777f16
• Deal with ugly Ubuntu version numbers by fading out the version string past a certain width

Kirigami

• Get rid of horrible little line in the toolbar separating the panes, or bring back the old separated style: https://bugs.kde.org/show_bug.cgi?id=435481
• Change UrlButton to have a little "whoo, go over there" icon. Probably need a new icon for it since nothing we currently have seems to fit - frameworks/kirigami!1693 (merged)
• Change BasicListItem to top-align the icon when the text is multi-line
• Make explanation property mandatory in PlaceholderMessage
• About page: Developers are ugly, don't show their pictures, so then we don't need that silly "show pictures" checkbox
• About page: spacings and alignments look totally random; don't intent text, align vertically, etc
• Default Card corner radius is too large and not consistent with the corner radius of other things
• Card shadows are going against the otherwise flat design language; make them more subtle or even just remove them

Breeze Icons

• Make install icon better; maybe more round? Or maybe just like update-none but without the round spinny arrows or something?

@teams/vdg @carlschwan @pinheiro

Starting point as of 17897fe0:

Reference to old mockup: https://phabricator.kde.org/M187/717/