2

In one of my mobile apps there is an option to edit multiple photos at once.
At the initial screen, the users are presented with a picker view with all of their photos from the gallery. From testing I have made, I found out that people don't actually understand that the picker is a "multiple selection" picker; most of them think it's "single selection".

To try and solve this, I have added a mechanism to preview the users with the already selected photos, but still there is a UX gap that I can't figure out. Here is a illustration of the correct behavior:

Preview of the correct Behaviour

How can I make the multiple selection more obvious for the users?

2

Add signifiers to the photos to provide a clue for users, test it and measure the success rate, see the picture:
enter image description here

People need some way of understanding the product or service, some sign of what it is for, what is happening, and what the alternative actions are. People search for clues, for any sign that might help them cope and understand. It is the sign that is importance, anything that might signify meaningful information. Designers need to provide these clues.

Excerpt from Signifiers, not affordances by Don Norman

This is very unobtrusive way to convey multiple selection is possible.

P.S. You can also eliminate the row holding selected images on the top of the screen. Test if check/uncheck interaction is understandable for users.

| improve this answer | |
  • Hey Alex! Thank you for responding. That's actually very useful. I had another idea. Let me know what you think. Instead of showing a "disabled" selected state on each photo (which clutters the UI a bit). How about when ever use select a photo, instead of a "tick selected" image, we will show up a number (I.E 1,2,3,4), as the user keep selecting. So when he selects the first photo, it'll have a (1) marked with purple/white colors, and so on. This way we avoid appending a UI element for each of the photos. What do you think? – Roi Mulia Oct 21 '17 at 11:44
  • @RoiMulia, actually these are not disabled, it's just quick draw. Use non-selected state instead. While your idea is quite good in terms of clue, visualizing the controls for each photo is much strong and straightforward way to convey the idea of select/unselect interaction. And consistent one! Anyway try the options and choose one which works better. And please, share the result of the testing ). PS. I've updated the image. – Alexey Kolchenko Oct 21 '17 at 12:13
  • Perfect. Merging both of those will give the best results, I.E : Using your style for "none selected", and when the users selects a photo, using the numeric selection. I think it'll give the desired results. Thank you! :) – Roi Mulia Oct 21 '17 at 12:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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