Wear OS play screen suggestions

I’m really enjoying the phone app and was delighted to notice there was an app for my new Wear OS 3 smart watch. While it does the job just fine, I feel there’s some room for improvement in the middle tile and to pull it more to the current design of the phone app.

(I think there are also some small bugs in Wear OS 3 as the half transparant background behind the title text doesn’t show up.)

I focussed on what you’d use the watch app mostly for (see the progress and times, and to do quick tasks like FF and pause to go to the restroom/get some snacks.)

I hope some or all of the functionality will be considered.

There’s plans to revisit this now that compose for wear OS start to mature, but the Google Play store Wear review team is a fucking pain in the ass and last time blocked the app from release for a long time for some pixel that did not please them leading to current half solution. (And still hoping to see some Pixel Watch)

With that said since you have some skills, would appreciate if you could revisit the other screens too so I do not have to think too much when the time comes :slight_smile:

Do you also by luck have some skills to create app icons?

Thanks for the prompt reply. Nice to hear a refresh is on the table.

The other two screens are generally fine, but I’ll take a look at those as well.

As for icons, I do have the skills but not the time to do too much. If we’re speaking the icons in the Wear OS app list, they are fine and don’t look out of place. For the icons in the app itself you could probably use much of what’s already there in the phone app. If you do need the odd icon I’m not against the idea of making those.

It’s for my second new app https://symfonium.app/ (can offer some compensation) quite a few people say it’s really ugly :frowning: But I can’t do better :stuck_out_tongue:

You could try fiver or look around at stock sites like Shutterstock. That might not get you the most original logo, but a fair bit cheaper.

That one is from Fiver :stuck_out_tongue: But at least you confirm it’s ugly :frowning:
It’s hard to find someone trustworthy and with skills.

About your proposal after looking at current implementation it lacks the pager indicator so that the users knows there’s another page to change provider. Don’t know how it could fit in that one.

Here’s the rest of the screens. i tried to keep it limited to the standard elements that I could find in the documentation. You could also put the current time at the top (you can alter the start and end angle of the progress indicator) and only have the end time under the play time/total play time. Press and hold on the the round navigation button could be opening Kodi’s context menu.

I currently have the rotary input set to the volume, but scrolling down in the screens would also be a logical option. For the first two screens the scrolling should be discreet and snap to the centre of the next set of controls in stead of a smooth scroll.


As for your logo, it’s not necessarily ugly, but the colours aren’t the best choice. Making the S white and the waveform a brownish red, or vice versa, would go probably a long way. An other option would be just to choose a nice elegant font and stick to a pure text logo.

Thanks for the mockups will probably work on that on September will ping if need more details.

No more blurry image as background when playing? Maybe have some indicator on the first screen that something is playing? Or have the page number dynamic and hide the now playing when not playing?

For the logo text does not work for launchers and some places :frowning:

Will try to play with colors but I’m bad at choosing and people I ask usually say it’s not nice but can’t tell why so not very helpful.

Of course it’s up to you, but I think in this case non-blurred fanart with a 50% black overlay works nicer. In the other screens it doesn’t add much and IMO would be better of without.

That would be a nice solution.


I wouldn’t write it off just yet. There are a fair number of big companies that have text logos, also in their launcher icons. E.g. Samsung has Galaxy shop, Wear and Pass. Then there’s Dyson, Disney+, HBO Max, Prime Video and Philips Hue to name a few.

For the blurry I was talking about the secondary screens on the now playing it’s already not blurred. Will remove.

For the icon the app name is long and even doing that nicely is out of my competences :slight_smile: If the app works I’ll seek a proper designer on real places.

So doing some quick real tests and I’m not sure the 50% black overlay works properly in all cases :frowning:

image

image

image

Nice to see progress :slight_smile:

I think the main culprit here would be the transparant text. IMO you could just have it opaque. The size difference should make the hierarchy clear. Another option would be to make the smaller one the same as the accent colour.

If you want people to be able to admire the artwork an option would be to hide the controls and overlay when the user taps on an empty space (and return the same way). Like some watchfaces allow you to hide the hands to be able to make the complications better visible.

Another suggestion: If you put the clock on top I think the end time would be better presented as “ends: 10:12” (I assume 12H/24H settings will be taken from the system), or a clock icon and the end time. The brackets wouldn’t be necessary anymore either.

And I feel the time played/total font could be a bit bigger. That should be the main focus as the user knows what they’re watching., at least when movies and series are concerned. If you can detect if music is played you could make the title more front and center for that. Bring the top text block down to a third of the screen so there’s more room for the song title, so that the top of the title is at where the bottom of the artist is now.

Anyhow, I like the way this is going, and these are just suggestions.

Well I told you I’d look in September :stuck_out_tongue:

Main text is not transparent and I find the Indiana jones text hard to read because of the underlying text.

Anyway I’ll see what I can reach an post APKs to test in a couple of days.

I see what you mean. What I often do in cases like these is put a very soft drop shadow with a distance of zero or one behind it. Subtle enough that you don’t really notice it as such, but it helps for contrast. Because of the small size of the end product you can probably get away with it being a bit too dark in the previews. Values between 50% and 75% opacity work well most of the time.

New attempt with 65% black and small drop shadow.

Only problem of the drop shadow is that I can’t really apply it to the icon :frowning:

image

image

image

This will work.

Btw, are you putting the fanart or the poster behind it? Fanart generally doesn’t have text so it would lessen the issue as well.

And to nit-pick, I would make the clock icon the same height as the text.

Here’s some APK to test :slight_smile:

– Outdated

1 Like

Looks great!

I would make the time elapsed/ total a bit bigger and have it also show on the AOD (just round it to the nearest minute or something.)

Cheers!

edit: I ran in one minor issue: When you swipe to or from the first screen sometimes it gets registered as a button press when you’re over the button when starting or ending the swipe motion.

How would you represent the rounding? Just replace with 00 at the end sounds odd, removing the last part is odd too and I tried “:–” it’s odd too :frowning:

It’s indeed a bit of a conundrum. I personally think just displaying 00 would be the most elegant as you’re glancing at it anyway, and when you lift the watch it switches back to the regular screen.