I am working on an application for a client which has a "unique user interface" in which I want to improve.

Currently, when the user comes to this web page, there's only one drop down shown for region. As the user starts to select the region, the entire page submits and then shows the zone drop down. This repeats for each drop down until all values are selected. Region, Zone, District, and Dealer.

Clearly this isn't very usable or preferred for the user since the entire page refreshes and it requires a lot of clicks. I wanted to see if there's any way to improve the user experience here?

One solution I may do, if I can't improve the UI, is resort to AJAX calls to avoid the entire page refresh. But how can I improve the UI?

3 Answers
3

From what I understand, You already have the name of the dealership you want to bring up.

This particular UI design approach replicates the physical world way of getting to things. If I want to get to that dealership, how would I? Well, I gotta go to that region, get to the zone, get to the district and then find the dealership. In the physical world, there isn't much choice.

But for your purpose here, I think a search based approach would be not only more appropriate, but also much simpler and usable.

What I'm talking about here is along the lines of google suggest. The user starts to type the name of the dealership they want to bring up. If there is only one by that name, well and good. You have it. If not, we show a bunch of 'suggests' which incorporate the region, zone and district information and the user can pick the one they want to get to.

I totally agree. The objective is to select a dealer and they already know the dealer's name. We can inline additional meta data (Region, Zone, and District) in the autocomplete values as follows e.g., goo.gl/BCKZI
–
Richard L. Burton IIINov 21 '10 at 18:05

@Richard: You probably know your app and your users, but seeing this out of context I wouldn't be sure that existing users always knew the name of the dealer they are looking for. Some might be using it to browse the dealers in a district--or the districts in a zone-- etc. It's a lousy interface for that too, but a dealer name search box couldn't give those functions. BTW, a cool suggest widget here (for Freebase): freebase.com/docs/suggest
–
HostileForkNov 26 '10 at 0:39

The only thing I wanted to add to Vijay's response was that you can consider multiple techniques for wayfinding and searching - in other words, you can do autocomplete for the dealership name AND you can let the user drilldown from the opposite end - if they prefer to go through region, zone, etc. they can use another section of the form or another form entirely. You can learn more about wayfinding and search patterns, as well as how they influence web design, to understand the subject for a wide variety of sites. Some excellent books on the subjects include Search Patterns by Morville & Callender, Ambient Findability by Morville, and even a section of the Web Style Guide in the Interface Design chapter (this is available freely online as well as in print).

I have a suggestion, but first let me just say that it's a pretty well-known paradigm and if implemented well (without the whole page refreshing and perhaps showing all the droplists), can work nicely.
Unless vertical space is scarce, I would also consider arranging the droplists one beneath the other.

If you want to change the experience completely, you can for example try to add a map.
This might help some user to choose the place more easily, but might be a bit more cumbersome to those who prefer just to use the keyboard and type.

If you really want to take this to the edge, try to parse a free format, i.e. let the user just type something and deduce all the parameters from it (like Google maps).

I was looking at doing the latter, but there's no clean way to parse out the different elements since the names contain spaces. They went with the dropdown to reduce the amount of space taken up. Interesting problem to solve I think.
–
Richard L. Burton IIINov 21 '10 at 20:29