3

The application I am designing is a large table of information that is updating in real time. The rows in the table are live orders in the companies system, our users scan through the list items, select order, read through the order details (which appears on the side of the table) and call companies to try and sell them that order.

Our current task is to lay out the information associated with that order as best as possible.

The goal for our users is to be able to read through the information and talk to companies as fast and as efficient as possible.

Here are two options that we are currently split between.

information

Option 1

Here is a more detailed image of the design (right click, open image in new tab will give you a better view of image)

Option 1

Option 2

Option 2

|improve this question
  • 1
    Can you show us an example of how multiple entries will be laid out? – Majo0od Sep 30 '13 at 15:47
  • What are the points which drive the decision? E.g. price, product, etc.? Also top rows use bold font style, what is the difference? – Alexey Kolchenko Sep 30 '13 at 16:12
  • It is hard to say because there are a lot of points that can drive the decision, but information in the table itself have the most effect in what drives the decision. – Jason Frade Sep 30 '13 at 16:15
  • Also how many records usually user need to monitor? – Alexey Kolchenko Sep 30 '13 at 16:17
  • Users are usually assigned regions in the country to monitor daily so it could be 4-5 orders per user a day, or they may watch all the orders that come in per day, which is usually in the 1,000's – Jason Frade Sep 30 '13 at 16:20
4

The problem is more deep than readability. I see some points of improvements.

Problem

The more important issue is uncompleted interaction which could break your business goal. The goal, as you mentioned, is to sell some product. So the interaction sequence should look like:

  1. Find product
  2. View product details
  3. Sell product

Instead you have only steps 1-2. Fast and efficient selling, which is your goal, is possible when you bring a value proposition for your clients. At least, operator's call to a client should sound for him as the most value proposition.

So an operator should very clear present to a client the proposition and answer client's questions fast. Consider here the phone dialog mode, which is limited to:

  • just one (audial) channel. There is no more channels (visual, etc.)
  • time duration, it's rather short
  • human's short term memory, the words could be forgotten soon

.

Solution

The solution for fast and efficient product selling is to create value proposition for a client. An operator should use some pre-defined scenario when talking to a client and ask his questions fast. This could be achieved by organizing all the product's information in accordance to some Value Proposition Template.

To create Value Proposition Template you need to perform user research and analytics and develop appropriate layout, which is based on:

  • frequency of the information usage
  • importance of the information
  • sequence of flow

Such layout will serve as the value proposition, which is formed automatically and should be delivered to a client by operator. The 3rd step of interaction (which brings money to your and which is missed currently in your interface), will look like just reading the screen!
enter image description here Current layout has a lot of "failed links", which are shown in red.

|improve this answer
  • This is very helpful, thanks. But this still does not answer my direct question of which layout lends itself to be more usable and functional for the user? – Jason Frade Oct 1 '13 at 17:45
  • 2
    @JasonFrade The second option looks more organized. Columns of element-value pairs provide more fast access and findability. – Alexey Kolchenko Oct 1 '13 at 18:26
  • GREAT diagram! This is a far more superior explanation (also visually) than mine. Thumbs up my friend. – Majo0od Oct 2 '13 at 20:40
3

I think the major issue is that there is so much information attacking the reader at once. You need to dull down the immediate amount of information to the necessities. When the user clicks on the row, then the full amount of information will be displayed on the right side.

The current layout is making it really difficult for the users to find what they want.

How about a search that will enable the user to look for order number, name, company, CEO, location, etc. That'll make it far more simpler to have the user discover what is needed quickly and efficiently.

As for being updated real time, doesn't that cause issues if someone were looking at a field then all of a sudden was shifted one, two, or even 10 rows down? It is highlighted yes, but it can get easily frustrating, especially if the user has a small screen and it gets bumped off of the fold of the page. Why not have a bar at the top that says "20 more entries added, click to update."

I hope that helps.

|improve this answer
3

If not going with Majed's suggestion, I'd choose number 2.

The reason is simple: With so much information, I need to quickly find what I'm looking for. With elements using the exact same vertical space (they are all aligned), I find this much easier to do in the second case. I can scan the labels really quickly, and from there I know it's just moving to the right to find what I need.

If I had to draw it, the difference would be (highly exaggerated):

enter image description here

|improve this answer
  • Great feedback on how the eye follows the information. As duly noted by @Yisela the eye is jumping too much. I'd go with number 2 AND my suggest, but I'm biased :-p – Majo0od Oct 1 '13 at 19:55
0

Option 1 is more scalable, because you still able to add more groups of data. The other point is that you can make this groups initially collapsed, so user can expand only group which is necessary.

Option 3 could be depicting order form in real layout as it is in paper form if any.

|improve this answer

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.