0

I've recently run into a dilemma while searching for icon ideas for sorting UI elements. The issue is that the icons for sorting items in ascending order by price and ascending by name (alphabetical order)'s icons that have arrows will not be consistent.

To be more specific, an icon indicating alphabetical order might have an icon with "A" on the top and "Z" on the bottom, with an arrow pointing downwards, indicating A to Z order:

enter image description here

Conversely, assuming I want to use the same design and concept with characters to the left, an icon indicating ascending by price (cheapest to most expensive) will have a dollar sign to the left, however the arrow will be pointing upwards, indicating the highest price on the bottom and the lowest price on the top:

enter image description here

These two similar sort types will have opposite-pointing arrows which seems inconsistent, icons that represent similar things should be similar, correct?

So I guess my question is: what other approach can I take to make arrows that represent similar sort types point in the same direction, if any?

1 Answer 1

0

I think it's a conceptual confusion, in the alphabetic case the arrows indicate the position in a fixed order from first to last and vice versa. While in prices it's a position based on a quantity increase, from higher to lower or vice versa.

To find a solution, I would start from the abstraction based on the exact meaning of each option.

Change of position order in a fixed list from A to Z:

enter image description here

Position order change from the price quantity:

enter image description here

Once the exact definition of each function is clear, look for the abstraction or graphic systematization of both. Example:

order

To make the concept clearer, you can do a button switch when changing from one option to another:

enter image description here

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.