0

I have a question very similar to this one. I'm designing a music player, and one of the screens is the Queue (or "Up Next" as other apps call it). I'm trying to figure out how best to allow the user to go back to the previous (music player) screen.

I'm thinking the best way might be to have some symbol that means "done". But unlike the post I linked above, the "done" I want is more like "I'm done viewing the queue" rather than "I've completed the task". This might mean the user did some re-arranging of songs in their queue, but it could also mean they just wanted to see what was coming up next. Because of that, I don't think a check mark is the right icon.

Below is a screenshot of my Queue screen. Just for some context, I'm imagining an original OS where the bezel at the bottom is adaptable to the screen. So the home button stays in the middle, but the buttons on either side can change. In this case, I just have the word "done", but I'm trying to stick to icons rather than words.

I was also thinking of possibly using an X icon. But I also previously used the icon in an email app (part of the same imaginary OS) and in that case the X icon means "cancel writing this email". As a result, using the X in the case of the Queue to mean "done with viewing the queue" might be confusing. I also thought that an X might confuse users by leading them to think that it will close the whole player slide-out screen.

Does anyone have any ideas? Thanks!

enter image description here

Edit: Adding a photo of the screen prior to the Queue Screen. The user would tap the list icon (far right icon) to get to the Queue.

enter image description here

  • If you could post an image of the previous window (when the Queue is collapsed) maybe it will be easier to know which solution fits better. – Alvaro Nov 26 '16 at 20:37
3

As the User hasn't completed any task that needs confirmation there is no need of such an action button.


  • Queue is in a new screen:

I'm not that sure about iOS but in Android it is common the use of the "Up button" to go back to the previous screen inside the app.

up


In this case instead of the Up button, a Close icon should appear when the sheet is fully-expanded:

Fully-expanded modal bottom sheets provide an X in the app bar.

close

Also:

Bottom sheets can be dismissed by swiping the bottom sheet down, by touching an explicit control such as an X in the app bar, or by touching the system back button (Android).

Modal bottom sheets can also be dismissed by touching outside of the bottom sheet.


Confirmation

A confirmation asks the user to verify that they truly want to proceed with the action they just invoked. It may be paired with a warning or critical information related to that action.

(...)

Confirmation isn’t necessary when the consequences of an action are reversible or negligible.

Source: Material Design - Confirmation and Acknowledgement

Take a look at this question for more info and comparison between the Back and Up button. Also the Material Design site on Navigation will probably be helpful.

  • Ah, that's great! I didn't think to use a back or up button. But now I'm wondering if my two screens have a sibling or a parent-child relationship. I'm not sure exactly how to describe the interaction I'm trying to create, but the spotify app does what I'm trying to achieve. The user taps the top right corner icon, and the album minimizes to reveal a list of upcoming songs. Would you consider the list view to be a sibling screen to the player screen? – Julian Nov 26 '16 at 20:43
  • I guess it is a child. If the Queue appeared from the Player, I believe when closing it should go back to the Player. That is my impression but I would have to test it to be sure. – Alvaro Nov 26 '16 at 21:09
  • I posted an image of the screen that leads into the Queue. The user would tap the list icon (far right icon) to get to the Queue. So as you can see, they're kind of at the same level. The Queue doesn't quite overlap the player, it just kind of replaces the player. – Julian Nov 26 '16 at 21:50

Not the answer you're looking for? Browse other questions tagged or ask your own question.