Thinking caps on please... I need suggestions

Okay, I freely admit that my UI/UX skills are terrible… which is why I need some suggestions on this problem.

Disclaimer:
The following description is made up but it does offer the clearest analogy I can think of…

Scenario:
Let’s pretend I’m doing an app called “Songs With Friends” and the premise of this mythical app is that you and a friend tune into a channel and both listen to the same songs just like you would if you were in the car together.

Now, let’s pretend that YOU are tired of listening to the channel (country music) and you want to change channels (to jazz). Just like in the car, just because YOU want to change to jazz doesn’t mean your friend does. They may want to stay on the same channel or they may want an entirely different channel.

And once YOU chose the channel you want, my app will ask your friend if they agree to the channel change. If they do, you both get switched to the new channel. If they don’t then you’re stuck on the channel you’re currently listening to or, perhaps, they will suggest an entirely new channel and give you the option of accepting their suggestion or declining and staying where you are until you can both agree on the new channel.

Help Needed:
I need an easy to design way to change channels. I will display the options - let’s say

  • Country
  • Jazz
  • Rock
  • Heavy Metal
  • Classical

Question 1: Given the constraints of the controls available (buttons, sliders, divs, images etc.) what kind of channel change control would you suggest?

Question 2: If you could imagine any set of controls (besides a car radio) what would you design?

I’m open to any suggestions as obviously the following isn’t good enough.

I don’t have a definitive answer, but here are a few thoughts…

  • The obvious choice is to use a Select. It works, but may not be the most visually attractive treatment.
  • As you mention, you could use a RadioButton - even style it like an old-timey car radio. That’s an example of Skewmorphic Design. Here’s a great article about how this has come, gone and may be back again: https://www.interaction-design.org/literature/article/skeuomorphism-is-dead-long-live-skeuomorphism
  • The number of categories will make a difference. What works for 5 may not work for 10.
  • If you’re thinking of making this into a commercial product, it’s worth talking to a professional designer. We have one on our team and it’s made a huge difference for both AppStudio and our contract work.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.