Better solution for displaying a menu than hovering
Background Info
I created a web application which allows the user to configure a furniture system. (Base body in different colors plus extensions in different colors, etc.)
Currently, it looks like this:
As mentioned, the different products come in different colors, for which I implemented an options menu from which you can pick the color of your choice:
The menu appears when the user hovers over the product they'd like to adjust.
Now, you can test this yourself by checking out the beta version of this web app on our website. Beware, though: it's still a bit buggy.
In our iOS version of the app (which is not on Apple's App Store yet) you can tap on the product of your choice to bring up the menu, and you drag the item to the left to dismiss it.
In the web, however, you click on the item to dismiss it, and hover over it to show the options menu to pick the colors.
Problem
My issues with how it works right now are:
- it's not very intuitive, the user will probably click on it to change the color which will remove the item, rather than showing the menu – I have actually experienced this myself wanting to click it rather than hovering, even though I programmed it, ha; also, beta testers reported the same issue
- it doesn't work with touch devices, since the user can't hover over the items
Approaches
#1
- clicking the item to show the options menu would probably yield the best UX
- that'd mean, I'd have to change the way I dismiss the item back to the product picker on the left
- maybe an
x
icon or something in the options menu to dismiss to item would be a solution- that could be irritating, though, because the user would have to understand that there's two
x
's: one for dismissing the options menu, and one for dismissing the whole item whatsoever
- that could be irritating, though, because the user would have to understand that there's two
#2
- leaving the options menu open the whole time
- then, how would I change the options menu for another product to change its color?
Question
Which events should I use for showing the options menu and dismissing the product?