Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Explanation

Design #2

Create Trip

Storyboard
This panel is where Phyllis would create her new trip. It is a lot like the multi-city mode for Kayak.com First she would log in, which would bring up her view and automatically start her in this tab. Then she would enter her starting address in the first textbox at the top (which has address autocomplete). In the next textbox to the right she would enter her preferred departure date by typing it in or using the standard calendar widget. She would also choose a time from the dropdown menu, whose default option is "anytime" but also includes options like "early morning", "evening" and then specific hours. 

She then proceeds to enter all of her planned stops along the way, using the same functionality as the starting point. She also chooses a "type" for each location using radio buttons which include "client", "hotel" and "other" which will aid in later auditing. She can add additional stops by clicking on the "Add destination" hyperlink which always appears at the bottom of the list. She should be able to delete legs of the trip as well (delete button not pictured!)

She can also view previous trips by clicking on an item in the list of links on the right, which includes a scrollbar if she has many trips. This may help her fill out the current trip if she visits many of the same clients and can't remember an address, for example. The scrollbar is in a separate view.

When she is done entering stops, she clicks the "Generate Trip" button, which will display a map of the trip and suggested meeting times along the way in a separate screen (not shown).  

Visibility
Some good aspects of visibility is the navigation state is provided by tabs at the top so she knows what mode she is in. There is good information scent by using standard widgets like calendar icons, radio buttons, dropdown menus and hyperlinks.

Some problems with the visibility may be the list on the right of the page obscuring lots of previous trips. Also, it does not show the map or suggested times of the trip until the user presses "Generate".

Learnability
The main positive of this interface is that that it is consistent with familiar travel websites like kayak.com or expedia.com.

A bad part of the interface, however, is that the user cannot build a trip through trial and error because they have to press generate every time they make a change, wait for a map to load, and then shuffle back and forth; thus feedback is poor.

Efficiency
The interaction style is menu and form and tries to balance learnability with efficiency. For example, the address textboxes are all autocomplete. She can also view previous trips easily if she can't remember an address. In addition, expert users can simply type in dates rather than using the calendar widget.

That being said, it is not quite as efficient as something like Google maps, because there is a "Generate" trip step in between user input and the trip being displayed to the user.

Also, there may be a Fitt's law issue with the embedded scrollbar, but the plan is to eliminate the web page scrollbar so there is only one scrollbar available to the user.

Errors
Sources of potential error in this interface are that the user enters the wrong address, type of location, or perhaps enters a sub-optimal sequence of trips.

The autocomplete function should help prevent incorrect addresses. In addition, the engine behind the interface should optimize for the trip even if the user enters a sub-optimal sequence. 

Finally, errors are recoverable because the user is able to undo and redo *CRUD *legs of the trip easily.

Approve Trip

Explanation

Storyboard
This interface is where Mary would approve trips for Phyllis and her other direct reports. The tab is titled "approve trips", so she would first click on that tab which is only visible to people in the company with permission to approve trips. The scrollpanel on the left of the page (which is consistent with the Plan a Trip tab) shows a queue of all trips that her direct reports have submitted for her approval, including total dollar amount of each trip. Checking a trip will cause the "Total" box in the panel to update with the sumtotal amount she is about to approve. Mary can use the checkboxes to the left of each trip to mark them for batch approval. If she wants to dig into the details of a particular trip, she can click on the trip in the scrollpanel, which will bring up a google map in the left view with outlines for the travel path of the direct report, along with the stops and the type of each stop. The two panels are independent, and the default view on the left will be the trip at the top of the queue. Once Mary has made her choices using the checkboxes, she can press "approve", which will remove those trips from her queue.

Visibility
The visibility features of this function are similar to the "Create Trip" function. 
An attempt is made to make important information, like the requested amount for each trip and the total amount to be approved, visible to the user without requiring the user to do anything on their part.

Learnability
The learnability of this interface should be helped because the map widget is consistent with google maps. In addition, there is instant feedback to the user when they click on a trip (the map changes) and when they check a box (the total amount changes).

Efficiency
This interface balances visibility of details of each trip with the number of trips the manager can view at any given time. In other words, if the manager has many trips to view, they may not see every one of them unless they use the scrollbar. On the other hand, there is no shuffling between screens if she wants to dig into a particular trip.
In this sense, this design may be better for managers who have few direct reports and like to snoop around before approving anything.

Errors
The main error source for this interface is if the user has a lapse regarding which trips they checked off, especially after they have done a lot of scrolling. The sum total box gives some abstract feedback on this, but it may be a common problem.
The user may also potentially get into a mode error if they are confused about whether they are in the "Approve" mode or the "Create" mode because of the similar scrollpanes on the right.

Analyze Trip

Explanation

Design #3

...