(small) Music App Redesign

[tituscmd]

Heyo!
This PR is a small redesign of the Music app.

I changed the title to be above the artist, as done in most if not all music apps. I also made the artist text a bit darker than the title to differentiate them a little more.
I also changed the buttons to be gray (bgAlt). I think judging from the rest of the UI, the aqua buttons are outdated. I'm more than open to debate on that, tho—please share your opinion! :)

But there's one thing I don't know how to fix. As seen in the first image, the "Waiting for track information.." or rather "track information.. Waiting for" is also messed up. I couldn't find any reference of that text in the code, maybe someone can tell me where to switch those as well.

(First iteration)

[github-actions]

Build size and comparison to main:

Section	Size	Difference
text	378996B	-116B
data	944B	0B
bss	22536B	0B

Run in InfiniEmu

[tituscmd]

Here's another pic of it on-device

[minacode]

Not tested on device but looks good and I like it. Thank you for the contribution :)

[tituscmd]

Not tested on device but looks good and I like it. Thank you for the contribution :)

Thank you! I'm glad you like it :)
Do you have any idea how to fix the template text lines being flipped?

[minacode]

It's defined in src/components/ble/MusicService.h in lines 74-76.

[liamcharger]

Looks good!

Wouldn't mind seeing the template strings changed to just say "Not Playing" (by setting the bottom string).

At the bare minimum "This is a very long getTrack name" should be replaced, as you can see it flash when the app is opened.

[tituscmd]

Wouldn't mind seeing the template strings changed to just say "Not Playing" (by setting the bottom string).

This is the updated default screen now.

[tituscmd]

I've changed the way to toggle between the track and volume buttons from swiping to double tapping the screen. It also gives a little vibration when the buttons have switched.

I like this more than the swiping. What do y'all think?

[minacode]

I would rather stick to the same patterns as everywhere else to make the controls as intuitive as possible. Everything you have to discover and remember about the UI is something that people will miss or forget.
Why don't we use swipe with the page indicator on the right?

[tituscmd]

I feel like it doesn't make sense that swiping an entire page uses the same "mechanic" as toggling through 2 button states.

[minacode]

From my perspective we can break this down to two questions:

1. How can we make people realize that there are more, but currently hidden, features?
2. What would we expect people to do to get there?

I would solve the first a visual hint. Because otherwise you would have to read the manual and remember it.

My answer to the second question is that people try the thing that is most intuitive first. Which is in our case, what they are already doing all the time: swiping. I don't think that double tapping is intuitive at all and would suspect any non-techie to never find out about that feature.

[minacode]

But for the scope of this PR it's probably best if you only swap the two labels and leave out the new toggle. I am open to discuss this on another PR. In the meantime we can hopefully merge this one sooner.

[SteveAmor]

I would rather stick to the same patterns as everywhere else to make the controls as intuitive as possible. Everything you have to discover and remember about the UI is something that people will miss or forget. Why don't we use swipe with the page indicator on the right?

#1875 adds a page indicator

[tituscmd]

But for the scope of this PR it's probably best if you only swap the two labels and leave out the new toggle. I am open to discuss this on another PR. In the meantime we can hopefully merge this one sooner.

I've done this and reverted back to the original way of switching the labels. I think this PR should be all good now

[mark9064]

Had a quick look with InfiniEmu, the buttons seem darker compared to other bgAlt buttons. Could the shade of grey be made the same?

[tituscmd]

Had a quick look with InfiniEmu, the buttons seem darker compared to other bgAlt buttons. Could the shade of grey be made the same?

Yep! Looks like this now, I like it:

[minacode]

LGTM

[minacode]

Thank you, for your contribution, @tituscmd! :)

[tituscmd]

Thank you, for your contribution, @tituscmd! :)

You're welcome! Glad I could contribute :)