UI Design Discussion

[Guy-kun]

I've been straining over thinking of a proper UI for in-app but the one big hurdle is having no central content for what is in effect a media player.

What would be really great is to have a bigger minimum size for all DJ images, the current size is just too small. Up to 1024x1024 would allow a really great 'album-art' style central image with payer controls and metadata next to it, having the queue and recent accessible through a gesture/page.

Would this have bandwidth implications and be unrealistic?
If so, a second hi-res image field would be possible through the api to at least stop browser clients loading this unnecessarily

edit by Autumn - renamed issue

[Autumn]

I don't think the bandwidth would be a major problem. The DJ image is only downloaded once per run until it changes, and we should be able to do some sort of caching.

Do you have any design wireframes we can pore over? Discussing the UI would probably be the best way to decide on one.

[Guy-kun]

I'll throw one together, sure

[Guy-kun]

I love the Google Music UI, and familiar things are good, right? right???!?!?! So I've worked off that basically
The idea is that the main player interface such as this is pretty simple/eye-pleasing to be left as a decoration (who actually goes outside and uses their phone?) and other features lie off sub-menus/other sub-interfaces

Having the context menu bottom left may be weird, but having the queue/recent come out from the side in a yet undesigned UI would work best from top right, so I've positioned it there.

A 1024x1024 image should suffice in almost all cases and can be stretched to be lenient.

DJ Info would be found pressing the top-left icon

[Autumn]

I like it. I'm a fan of the Google Music UI as well.

Would you have the queue/last played information in the right side bar, with the DJ information?

For "other parts" of the app (favourites, chat?), I'm thinking a navigation drawer on the left.

For searching and requesting, I think a search widget in the Action Bar would fit in nicely in this design, rather than in the aforementioned nav drawer.

As for the DJ art, would an option to serve multiple resolutions be out of the question? A lot of users screens (granted, none of the seven installs right now have a screen >720p) could possibly be high resolution, and a 2x upscale on a device of that type would look...unsatisfying, I think.

[Guy-kun]

I'm not sure what you mean by right side bar but the idea was of either a modal scrollable popup with queue/last played or a drawer to the right. This would be overkill with a drawer for other parts of the app though.
The bottom left context menu thinking about it should keep only current-track related options such as favourite if this comes.

Maybe we can cheat a navigation drawer and use it as both navigation and a collapsible sub-category just for showing the queue/recent.

A search icon on the top 'action bar' would be easily doable, plenty of space on there

Honestly speaking, most devices with > 1280 width are likely to be compact/high-density devices, a 1024px image enlarged by x1.2 won't be bad I think, you use tablets at a further distance anyway. Might be overkill to serve anything over 1024 and scaling down in-client isn't an issue as a one-off

[ameliaikeda]

We'll force a resize on the main site and provide 1024x1024 DJ images, Caching/lazy loading would be a good idea here, too

[Guy-kun]

Implemented on the player-ui branch with a few adjustments to the design and main DJ image is static until 1024px images are provided
4a9111f

[Guy-kun]

UI looks as such:

Bottom left context menu can contain anything track-related such as favourites or more buttons can be added to the bottom bar.

Still undecided on the main method of navigation to other parts of the app.

[Bevinsky]

I'd just like to point out @hirotokun, while I can see large image sizes like that being great to have, it might not be possible in every case due to cropping/original image size. DJ images of that size might be hard to procure.

[Guy-kun]

Re-thinking, that's right. Only having one 1024x1024 image would mean dj images would be small and look like a down-sized wallpaper most of the time (unless a really high-res source is used).
Take as an example a face. A 1024px face would be hard to find, and a full-body shot may end up too small when used scaled-down.

A smaller size as currently exists to be used as a 'avatar' and a 1024px version to use where needed would be best.

[ameliaikeda]

@Bevinsky 1024x1024 would be really hard to actually procure properly for a high-res shot yes. But we can still try.