 Image Added
| The Create Trip interface was designed to be very clean, simple, learnable, yet very powerful and was inspired by Google's homepage. Originally, we had multiple lines of input fields arranged vertically, but paper prototyping revealed that a simpler version with just three boxes would be much better in terms of learnability, leading to a major design overhaul.
However, heuristic design revealed that we may have gone too far - with just one line there was confusion around whether the address was a starting point or destination. This was alleviated somewhat through better labeling and the ability for the user to CRUD the ordering of entered locations using direct manipulation, but the initial user confusion upon entering the interface remained up through user testing. We considered using two lines, as a heuristic evaluator suggested, but we wanted to see if we could make the one line work and the verdict is "sort of".
Our general design approach was to have a lot of artificial intelligence on the back end in terms of suggesting an optimal ordering of legs for the user, and the ability for the user to use direct manipulation to make adjustments to the suggestion (a la Google). We didn't quite get to implement the back end completely, which weighed somewhat on user testing. |
 Image Added
| The Approve Trip interface was designed around efficiency (while still maintaining CRUD) because from our interviews a manager spent very little time on a Friday approving expenses. Thus, the "front page" is designed for the user to quickly scan high level details of the trip (who, what, where, when, how much $$) and approve/reject from this page alone. This functionality did not change much from the paper prototyping beyond minor changes to labeling. During heuristic evaluation, an expert recommended having a "select all" widget, which made a lot of sense considering the efficiency goal.
During user testing, an actual sales manager found this interface very easy to use. In general, this was a highly successful design pattern. |