Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 5 down vote favorite
1

I'm designing a user interface for a Flash-based enterprise-level business application. I am restricted to using a corporate theme, so have limited ability to play with colors and so on. The application has several "object" types (reports, "plans", data objects, etc. - there can be many instances of each type), and the pattern for working with a particular object type is always virtually the same: 1) Bring up a table of these objects that can be sorted/filtered in order to find the objects of interest 2) From the table, open an object (or objects) in an editor to work on it. Typically, most of the user's time in the application is spent in the editors (this is the real content)

The problem I'm facing, is that all the tables and editors look virtually the same and I worry about the lack of orienting cues. Sure there are labels above the tables/editors, but I'm not sure these are salient enough.

So my question is this - what have others of you done in order to provide orienting cues in user interfaces, to help people determine where they are in a user interface that is otherwise quite homogeneous?

share|improve this question
How many object types are there? Also, what's the navigation like? Does the navigation give clues as to the user's location? – Matt Obee Oct 22 '12 at 15:13
Four or five object types, everything opens in tabs (the "object managers" tabs are always there, the "object editor" tabs are added as needed). Each tab contains an icon and the editor tabs contain name of the object itself, and there's a label at the top left of the page, right above the tabs, that names the object manager when an object manager tab is selected, and names the object type when an object editor tab is shown. – Paddy Oct 22 '12 at 15:35
Just a thought: if the screens are all so similar, does it make sense to separate them at all? – André Oct 23 '12 at 12:02
Thanks. That's an idea that I'm going to have to give some thought to... there is one case where one table is actually a drill-in of another table (first table is a list of "packages", drill-in is a list of package content) but it could certainly reduce the problem – Paddy Oct 23 '12 at 13:34

4 Answers

up vote 1 down vote

Have you considered color coding the tables? If there's some style guidelines already present to differentiate each entity, you could color code the tables based off of that. Or you could come up with your own color scheme, for example, claims = blue, sales = green, customers = yellow, products = purple, etc.

If it's tab based interface, you could also color code the tab headers as shown below

enter image description here

(Screenshot taken from Fabtabs Firefox add-on).

Maybe you can draw some inspiration from the Microsoft Excel table formatting schemes as shown below.

enter image description here

share|improve this answer
Thanks for the suggestions. Color coding might be ideal, but the themes are quite tightly locked down and I'm not sure how much I can get away with. Coloring the tabs might work - perhaps something like a band of color across the top of the tab (or even the tab area) just to provide a cue that they're in a particular area, or that the area has changed. – Paddy Oct 23 '12 at 0:24
up vote 1 down vote

The use of tabs, as you mentioned in your comment, really helps to highlight the current object, as it naturally promotes the active tab, and the others recede but are still available.

Since it sounds like the colors and formatting are all very similar, can you make any use of icons to differentiate the object types? I'm not sure how much of a role they could play on each page as I'm not familiar with your application, but even a single one next to each heading would help the users to quickly identify each page.

share|improve this answer
Thanks. I can use icons, and plan to, but unfortunately the theme we're having to use has resulted in all icons being monochrome, which reduces their discriminability. It's really too bad... – Paddy Oct 23 '12 at 13:37
up vote 1 down vote

A (long) while back I designed an Intranet for the company I worked for. I employed a concept I called "Consistent Variety".

Basically, Keep an identical composition of working elements, particularly in navigation. Then make one or two of those elements a distinct visual that changes noticeably. Color or graphic changes. This is a visual hook to identify the section they are on. Think of it as an internal "brand" for the section.

You could also use transitions to identify where they are going and breadcrumbs will be useful too.

Sorry, this is a very conceptual answer. I could post images for example but they are ancient. I am worried you might not see past their age, and I am very sensitive :) Post a comment with a contact and I'll send you a link.

share|improve this answer
Not too conceptual, I get what you're saying. You could send a link, if you wouldn't mind, to 104723 at gmail dot com - I'd like to see an example, though I'm afraid that the themes we use won't allow enough latitude to made a difference – Paddy Oct 23 '12 at 12:49
up vote 1 down vote

I work in a similar situation - boring tables and more tables and adhering to a brand. We create many tables so the user can find the relevant info, but as you say they are all the same and they are not the main part of the task. To simplify the user interaction one suggestion is to use a more faceted UI. By designing the facets (e.g. Amazon, eBay) to allow the user to search within the different categories of information, you provide one user defined customized table. This makes it quicker for the user to find what they are looking for rather than trying to find the right table first. You can then focus on the next part of the task - the editors etc.

share|improve this answer
Ha, maybe we work at the same place... We do have faceted search on the individual tables, so what you suggest could be done by extending the faceted search to include the object types themselves. It's similar to @Andre's suggestion, thanks – Paddy Oct 23 '12 at 13:35

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.