Start Menu Tile Enhancements?

[elsiehupp]

Note: this is kind of an extension of Issue #22.

Expected behaviour

When pinned to the main screen of the Start Menu, Nextcloud should show a full-bleed tile rather than an icon in front of a backdrop, at least when this is requested by Windows. (Microsoft has been redesigning the Start Menu, so the precise norms seem to be somewhat in flux.)

Actual behaviour

When pinned to the main screen of the Start Menu, Nextcloud shows an icon in front of a backdrop.

Steps to reproduce

1. Pin Nextcloud to the main screen of the Start Menu

Client configuration

Operating system: Windows 10 (probably also applicable on Windows 8 and 8.1 for the Luddites)

I'm actually basing this on other people's screenshots, specifically @pkrolkgp's on Issue #2903:

Notice how both the Nextcloud application and Nextcloud folder icons are circles floating in the middle of their respective tiles (and it's not clear which is which). The more "native" behavior is reflected in this screenshot by Logitech Options and one of the icons in the HP icon stack.

In order to implement the full-bleed icons, I'm pretty sure all that's necessary would be replacing the following with full-bleed images (i.e. forgoing the circular mask):

• 150-Nextcloud-w10startmenu.png
• 70-Nextcloud-w10startmenu.png

I should clarify that this is somewhat a question of taste, having the full-bleed icons rather than the circular ones, but it would also have the added benefit of cleanly distinguishing the application from the folder, which was the issue presented in #2903. In other words, the application would be full-bleed, while the folder would use a derivative of the Windows folder icon.

[elsiehupp]

Looking at this guide to VisualElementsManifest.xml:

https://www.askvg.com/tip-customize-start-screen-tiles-background-color-text-color-and-logo-in-windows-8-1/

It appears that the images linked as Square150x150Logo and Square70x70Logo don't actually have to have those pixel dimensions; they can be up to 1024x1024, so Windows can scale them for HiDPI displays. Additionally, the two keys can just reference the same file.

[jancborchardt]

@elsiehupp sounds good to me! :) Here is the source file for a square version of the logo: https://github.com/nextcloud/promo/blob/master/nextcloud-icon.svg

Even just using that one as-is should be fine, right?

[jancborchardt]

Ah, just realized you did exactly that in #2982 :D Sorry about that! :)

[szaimen]

I am not sure if this is the way to go.
If you have a look at the by Microsoft newly designed app icons in fluent design, you will see that most of them actually are just a floating app icon in the middle:

---

Though, the Nextcloud icon could be a bit smaller in comparison to the other apps and could use some shadow:

Maybe also the square Nextctloud icon would fit better than the circle one? I am not sure...

[elsiehupp]

I am not sure if this is the way to go.
If you have a look at the by Microsoft newly designed app icons in fluent design, you will see that most of them actually are just a floating app icon in the middle

I was aware that Microsoft had shifted away from full-bleed icons for non-Live-Tile pins, which is why I mentioned this in the pull request (but not here):

As for the stylistic merits of using a full-bleed tile versus a masked icon, I'm not a Windows user, and I don't have the strongest opinions, but at the very least this change makes a pinned shortcut to the Nextcloud application visually distinct from a pinned shortcut to the Nextcloud folder. I'll do some digging to see how (or if) the Nextcloud folder icon is assigned, as described in #2903.

Regardless of whether the icon should be full-bleed, though, it could still stand to be HiDPI. If the consensus is that a floating icon is preferable, the image could still be full-bleed; it would just have a transparent or solid-color background, and there would need to be two images for the two tile sizes.

That said, I do think it would be cool if Nextcloud supported some basic Live Tile features, even just a glorified status overlay that mirrors the status shown on the tray icon (though not necessarily the exact same image). This would require some additional coding, though, as well as design mockups.

[elsiehupp]

Fair Warning: this is a bit of a rabbit hole and probably isn't going to happen anytime soon, if ever.

I'm digging around the Microsoft documentation, and it appears they do specifically have a system for status-badging in the start menu, with a very small number of allowed badge types (scaled down here to fit inline):

• (none) <badge value="none"/>
• (activity) <badge value="activity"/>
• (alarm) <badge value="alarm"/>
• (alert) <badge value="alert"/>
• (attention) <badge value="attention"/>
• (available) <badge value="available"/>
• (away) <badge value="away"/>
• (busy) <badge value="busy"/>
• (error) <badge value="error"/>
• (newMessage) <badge value="newMessage"/>
• (paused) <badge value="paused"/>
• (playing) <badge value="playing"/>
• (unavailable) <badge value="unavailable"/>

Qt does not seem to have any direct support for UWP badging. Searching for "uwp badge" in the Qt docs just brings up the Application Icon page, which doesn't actually feature either of the search terms. According to this Stack Overflow answer, the way to access the Start Tile APIs is with Microsoft's C++/WinRT language projection. The blog post linked in the answer is a dead link, but it's still available on the Wayback Machine.

Alternately, an "Adaptive Start Tile" (AKA Live Tile) could show a very brief summary of any errors or alerts, though there are waaaaaaay too many of the existing notifications shown in the popover for those to translate well to this context. Instead, it might make more sense to summarize with things like "Sync Conflict in <Top Level Folder Name>", or "Sync Server Unavailable", things like that.

Here's a basic mockup from the Microsoft documentation:

(The way this is shown is extremely customizable, but that feels like even more of a rabbit hole.)

In this sort of context, it make more sense to use symbols from either Segoe UI or Fluent UI, rather than a badge. (In any case, the badge area in the lower right can also be set to show a logo when there are notifications in place of the larger Tile icon.)

Again, making use of these APIs seems like a fairly low priority, but it could be nice to have. In the meantime, @jancborchardt do you think the full-bleed icon in #2982 should get merged? I can start another issue regarding the icon norms within the context of the newer "Fluent Design" style.