Automatically reordering/hiding (navigational) elements

Question

I'm designing a self-service application for a tax office. The main screen looks like this:

I'm considering automatically reordering/hiding tiles based on certain conditions.

For example: when direct debit is requested, its tile can be moved to the bottom right since requesting direct debit happens way more often than cancelling it.

Another example: when there is an outstanding amount to be paid, it should be displayed in the top left corner so it grabs the attention. If there is nothing to pay, the tile should not be shown at all.

Some thoughts:

I've been reading about spatial memory lately, which means that users often try to find things by remembering their location, instead of their name. This is especially true for the top and bottom items, according to Jenifer Tidwell in her book 'Designing Interactions'. Automatically reordering items might disrupt the user's spatial memory.

On the other hand, why 'bother' users with page elements that are not relevant? In fact, moving the most important items to the top left could be perceived as considerate.

Each tile uses a distinct colour for the action buttons, so the user might remember the colour that is associated with a certain tile. However, on mobile the tiles are collapsed and displayed as an accordion view to make optimal use of the limited screen real estate; no colours will be displayed, so users will have to read the labels.

The question:

Is automatically reordering in this instance a sensible thing to do, or should it be avoided? Any thoughts/experiences/guidelines?

Answer 1

I think you kinda have the answer yourself when you say:

I've been reading about spatial memory lately, which means that users often try to find things by remembering their location, instead of their name. This is especially true for the top and bottom items, according to Jenifer Tidwell in her book 'Designing Interactions'. Automatically reordering items might disrupt the user's spatial memory.

This is completely true and a sound argument for NOT REORDERING.

However, there's a middle (better) ground between bot approaches: allow the users to have complete control of their experiences by letting them order elements as they wish and then save their preference. This way, not only they'll keep their locus of control, but they'll also learn and automate the flow of your site.

Keep in mind that it doesn't matter what they use the most, sometimes their spatial order will be irrational and many people will prefer to do an additional effort if it allows them to keep an already known behavior

Answer 2

In my experience the better option has proved to keep items where they are, and not moving them around. Doing so causes your end user to look around and sometimes even get frustrated if it is not where they expect.

Instead, fade out the irrelevant options, but keep them visible. Doing so not only allows all items to more easily remain in place (from a programming standpoint, which can save development time and improve troubleshooting) but also allows end users to see what other options are available for future use. This is greatly helpful to the end user as they may one day want to use the other options and by hiding these options from them, you may risk their ignorance and in turn cause them to gain the impression that those options simply do not exist. (Even if they were once on the screen, they may have not noticed them before. Never assume the end user noticed everything in the screen.)

If you want to make sure that the end user knows why the option is faded (preferably by altering the alpha or transparency of the object/option) simply add a small text below each item or an asterisk system (*, , *, etc) with small text at the bottom of the screen. As an alternative you can add a tooltip to each faded/prohibited option with the message you'd like them to see. This allows them to not only see that the option is there for them, but also makes them aware of the parameters in which that option becomes available to them.

I really hope this helps you!

PS: I've learned that in most cases and designs an opacity of 0.2-0.35 seems to do the trick!

Best of luck with your project!

Answer 3

I second Devin's answer for not reordering. Your users will feel lost if you rearrange the navigation automatically.

If this is something worth the try for you, then consider notifying the users of what is going to happen -- with a confirmation box for instance -- and giving them a chance to cancel.

What is the problem you really want to solve?

This idea of automatically reordering or hiding sounds like a solution for an underlying problem. Maybe the issue for the users is to know what has changed from last time or what needs special focus? If so, you could try adding signifiers to show that there is something going on or in need of attention.