3

I'm currently working on a taxi booking application and have got to the stage where I need to design the "Book" page where the user can create a new advance taxi booking.

The features are as follows:

  • The user can set the start, waypoint (optional) and destination of their taxi booking
  • The user can select the date/time of the taxi booking (it has to be an hour in advance from now)
  • The user can specify the number of passengers currently on the journey
  • The user gets an estimated fare, which they can increase/decrease (within a particular range)

Currently the form design looks very web-formish, any idea on how I can improve it and streamline it for mobile?

enter image description here

| improve this question | |
6

For a 'web-form' it already looks like you're already asking the bare minimum. You're not asking for any information you won't need creating a booking. Based on the mock-up I have some suggestions:

Improvements

The number select input fields are not recommended for mobile apps. The up and down arrow are to small to correctly select with a finger.

Streamlining suggestions

  • Geo location: pinpoint the users location and fill it in automatically based on the assumption most users want to book a ride from the location they are at that time.
  • Current date and time: Fill in the current time and date automatically
  • Popular destinations: remember the entries the user makes and add an option where they can choose from a list of previous entered destinations.
  • Round trip: After booking, or at the end of this list, add an option where the user can quickly enter a round trip. The start and end destination you already know. It can be a fair assumption to fill in the same day and a couple of hours after the first trip.

If you dislike the web-formish look of the app you'll have to think outside of the box and give the user an entire different experience. This is what I could come up with:

  • Google Map-like: Let user select their destination on a map. It works intuitive, but isn't always as exact as filling in a destination.
  • I left this bullet point blank in the hope I could come up with something else, but I'm, like the bullet point, blank.

I hope this answer is of some help to you.

| improve this answer | |
  • 1
    doesn't the number select field render a numeric kaypad for entry as oppose to a full text keyboard? I would add, the affordance of the up and down arrows may convince the user they can't enter text, rendering entry of anything more than 10 a real chore ! – Toni Leigh Feb 1 '14 at 16:16
8

Since its a mobile app, you want to make things bigger. My suggestion is not to take all of the form data at once but take it step by step.

In the first screen, just ask for the source and the destination. Give a next button and then ask the date and time etc. This way, you can give a rich experience as there would just be a couple of things to focus on at a time. In any case, don't make more than three screens for data input. I think you can do well with just two!

enter image description here

| improve this answer | |
2

Is the "Via" field required? Why not replace the "Add Stop" option with a "Via" button, which would let you cut down on screen clutter.

| improve this answer | |
1

Trying to restore user's goal from the showed UI (reverse engineering) I find it isn't clear.

Taxi booking, ...

Taxi booking taskflow requires setting point A and point B and boarding time setting. Price is the choice criterion, so taxi offerings could be ordered by price. The boarding time is close to current time, in real life people usually book the taxi in the rather narow time range: from 20 min to 2 hours before the boarding. Also people can easily catch a taxi on streets. Additional steps (using booking system) could make the activity more complex. So the interface doesn't reflect the essence of a taxi booking activity.

... or route planning, ...

Route planning task shoud be supported with a map, a list of interesting plases, photos, pre-defined routes, etc. As route planning assumes complex interaction, the task should have own interaction space (separate screen or screens). The parameters settings like date and time is separate task within planning activity. So, again, the interface doesn't reflect the planning activity flow.

... or something else?

Anyway, the user interface, which is based on a carefully researched and developed task flows, brings the better user experience. To inspect the current desing against the user goals and task flow in quick and dirty way, you could imitate user flow by yourself. This cheap and quick walktrough will give you some insights and let you to detect some pain points.

So from UX point, the most significant improvements could be done in task flow design rather than in layout design.

| improve this answer | |
1

Am not sure about "add stop" is required or not? I think it is unnecessary option and I would suggest you to remove. User interface is good however you could replace expected fare into taxi fare calculator for particular source to destination. You may find some additional features at Taxi Mobility, where they providing advanced features of cab tracking and payment options.

| improve this answer | |

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