Our SAML SSO server app uses the AUI iconfont for some of its icons. With Confluence 6.7 or so however, AUI 7 was introduced. It looks really nice and clean and I like the overall look of it a lot.
But one of the icons we used was changed so significantly, that I think it completely changes the semantics of the icon. I also don’t find a good replacement, so I thought I’d ask here:
For multi-element inputs in our app’s config (i.e. Arrays), the interface has add and remove buttons to do this:
Semantically, I would think this icon closes something, but it’s still available under the list-remove alias. What’s a bit dangerous about this is that when we use it in tab titles like we used to, the user might be lead to believe that they can “close” this tab without any consequences, while in fact, they would delete something.
The list-add and list-remove icons also disappeared from the docs (they were there in 7.4).
Is there a good solution for this problem? Ideally a solution would work consistently from AUI 5.8 on (since Bamboo and FeCru are stuck on that).
I agree with you that there’s a difference here, and there’s a chance the change may cause users to assume it behaves in a certain way and come to the wrong conclusions.
The problem would occur if a user has the expectation that ‘x’ means “go away, but I can bring this back later” by performing a specific action. I am not entirely convinced this is the mental model users will have, but I can see it being possible.
I also perceive a usability problem with use of the ‘-’ icon. The ‘-’ is only comprehensible when contrasted with ‘+’, and may be understood to mean “remove” and “add” respectively. I could see the same interpretation as above being applied to these icons.
We could debate the semantics, but that doesn’t help you in the short term.
I have two thoughts on how to remedy this.
My recommendation is: Consider using the “trash” icon instead of “list-remove”. That icon is used throughout Jira and Confluence, and understood to mean “delete this thing”. It is the same between AUI 6.x and 7.x versions. That trash icon shouldn’t allow a user to arrive at an incorrect mental model of “this is only being hidden for now”.
If you absolutely must keep the existing icon in the short-term, you can hack around AUI’s current implementation. Note: I won’t officially support this as API, so you are accepting an additional maintenance cost if you choose to do this. Here’s how you’d do that:
Add a CSS class to the icon’s span with a name specific to your app – e.g., “myplugin-icon-list-remove”.
To reiterate, this is a hack, and I won’t officially support this in AUI. Supporting this kind of hack would mean we’d need to support implementation details – e.g., 2 icon fonts – forever, which is bad for both performance and user comprehension in the long run.
With all of that said, I have contacted our design team and am discussing the semantics with them.
