User Feedback: 'collapse' and 'close' on panes

I’ve gotten a developer-friend on Wolfery and their first feedback was that the ‘x to close’ buttons and the collapse arrow are non-intuitive. I think you get used to them pretty quickly, but thought I’d make a thread to discuss.

I feel the same way, keep clicking the wrong thing, and it’s hard to unlearn 30 years of UI training, but I don’ t know what would be a better icon to use. Maybe more keyboard shortcuts?

Keyboard shortcuts would be nice! But they would be outside the scope for touchscreen users… Of which we have a surprising number.

Of course, some people want to have a go at a mobile app so maybe that’s a thing.

1 Like

I can barely stand texting on smart phones. Give me a full keyboard. How about instead of an X icon in places that take you back, adopt the left curly arrow like on phone touch controls?

@Accipiter? What do you think?

I guess my question, is this a universal criticism, or one aimed specifically at mobile users?

Oh no, the user who brought this up was on a desktop. I’m just pointing out that a keyboard shortcut isn’t a universal solution to it.

1 Like

I guess as someone who uses office and graphics programs with heavy interfaces that more or less need collapse functionality to get rid of visual clutter at times, I take for granted my familiarity with the interface arrows pointing left and right for closing and opening tool panels/panes.

I’m possible confused so just to be clear, are you referring to looking away from another character being displayed in the look view panel to go back to looking at your own profile contents, and wanting to change the X to a ⮌ arrow so it clarifies returning instead of closing?

If so, that sounds perfectly sensible since smashing the X doesn’t really close the panel as much as return you to not looking at somebody when you press it.

Yes, this exactly. I think it captures the intent more readily. Also, is that curly arrow a Unicode character?

It is actually! ^^ I went and hunted one down while looking for a match the the example but found that one at least!

1 Like

That “Return” icon sounds like a good idea.
And yes, I can see how “closing” might not signal the exact event.

However, I can’t find any such icon in Font Awesome - 4.7 which is the one I use for icons, including buttons. Mmm. I’ll see what I can do.

1 Like


image

I want a reason to use this character in the pack. XD

2 Likes

image
image
This might work?

I don’t know if I’m just used to the close button, but I think we should do an A/B test side by side with some previews just to make sure we’re making the right aesthetic decision.

I guess its not that big of a deal to change it, but I imagine it’s not just the look function that it needs changed on, and the close character it looks more sensible in some places than others.

Other candidates are maybe:
image
image

or

image
image

or

image
image

Wow, they don’t even have it in the latest version, except as an icon with a person. That’s weird. In 4.7, they have a skip backward icon:

But I doubt anyone but us oldies would know what it was, confirmed by Fontawesome calling it ‘fast backward’. :smiley:

1 Like

For what it’s worth, I’m the user who originally mentioned this to Talonstrike, and I’m still having some trouble with my instincts.

The arrow-to-collapse metaphor is actually perfectly reasonable to me, but it’s conflicting with the “I want to go back” sense I have when I’m on a pane. I think part of it is that I don’t feel like I’m trying to close a pane when I dismiss a character; I feel like I’m trying to return the pane to its prior list-state.

Given that, I think maybe the question is “what is the UI metaphor for the side-panes, and how can we clearly convey to users what’s going to happen on click?” Right now, with the “X” behavior, I somewhat feel like sometimes a pane is open “over itself” until I close it, and I don’t have a good underlying sense of how the sidebars behave from a linking-and-transitions perspective.

Ugh, rewind already! slaps VCR

I don’t know anything about UI design. but I was looking at KDE’s HCI stuff the other day and of course I lost the link to the UI research firm they cited. I’ll try harder to find it, 'cos it was somewhat interesting. My browser history is failing me.

Uh, maybe we could have “stacked” panes, like in Android’s application switcher? (I’m perennially behind on technology, I just upgraded my phone to Android OS6, so this is my reference point) I can’t find a good screenshot of what I’m talking about, though. Still learning this phone, but I guess you can take screenshots of the phone’s display somehow.

It looks like material.io has a ⮌ as simply “undo”

image

Which would be equivalent to font awesome’s

image

Which looks a lot more Undo-y and may be confusing.

Oh and @Talon, it looks like material has our back,

image

Google still knows it’s called rewind :grinning_face_with_smiling_eyes:

1 Like

Yes! That’s good. …though the one I quoted also has the bar so it should be ‘skip backward’. :smiley:

Yes, I can totally see what you mean.

The panels works like a stack, where “closing” the top most page will return you to the one below. Once you are at the bottom, you will see the ‘default’ page for the panel, without any close button.

But yes, I can agree that some sort of “return” icon would be better, as it is in a sense “returning” you to the previous page.

@Jagrabbit, I would like to try out the chevron-circle-left, but … does it seem a bit odd when used on the room panel which is on the other side?

chevron-close

Hmm. Maybe that works.
A/B test? Nnngh… Too much effort :wink: Let’s try this out in the next release and see instead :smiley:

Hmm. But, maybe “Close” icon feels more logical in some cases?
Especially the “Edit” pages (Edit room, Edit character, etc.).