Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

The holiday accommodations my company rents out have varying prices, depending on the day of arrival and the duration of the stay. Currently, these prices are charted in a scrollable table, with on the horizontal axis all dates, and on the vertical axis the duration, in number of night ranging from 3-21. Intersections that are booked don't show a price. This has the advantage of the customer being able to see what he/she would spend to depart one day later, or stay for two more days, or start their vacation a week earlier, etc. However, this also causes a pretty large grid of prices, displaying up to 7 dates * 12 durations = 84 different prices at a time. I fear this way of displaying might scare off customers, and I'd like to a/b test a new way of displaying these prices.

How could I simplify the price display, while keeping in mind the following things?

  • Prices differ with every departure-date, and every duration.
  • Being able to see the prices of nearby durations and departures is something that has worked very well in the past, and having no fixed arrival dates is a rare thing in the holiday business.

Thanks for your input!

share|improve this question
    
7*12 is it 7 days and 12 hours or is it 7 days and 12 weeks? Not quite sure what the calculations are about... –  Igor-G Jan 23 '13 at 9:49
    
Updated that in the question. –  Lg102 Jan 23 '13 at 18:07
    
We have a similar issue too: ux.stackexchange.com/questions/34361/… –  Nick Feb 8 '13 at 15:55

1 Answer 1

up vote 5 down vote accepted

Perhaps you could consider a design where you have a bar-chart of prices over your period. I have seen a design like that on airline sites, and I liked it a lot. Horizontally, you'd set your arrival dates, and vertically the price. You'd start with a standard-length stay, that the user might customize. I am not sure if showing a single night would make most sense, or showing a lengthier period like a week.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Then, on hovering the bar representing a day, you could show an overlay or an area below the graph that shows prices for the different lengths of stay starting at that date, perhaps with both a total and a price-per-night for each of the stay lengths.

mockup

download bmml source

That way, you avoid drowning your price page in numbers.

share|improve this answer
1  
As a minor enhancement to this suggestion, I recommend highlighting Sat/Sun in a slightly different color. –  Brian Jan 23 '13 at 14:23
    
I like the basic idea here, but what would you say this does to complexity? Whereas there are no options now, in this solution the user has to select his desired stay-duration, and loses the ability to see what one night longer would cost him. How would you solve that, if I may ask? –  Lg102 Jan 23 '13 at 18:15
    
@Brian: good idea, added a bit of shading for 2 out of every 7 bars to indicate weekends (though the bar lenghts would in reality probably peak at those days)... –  André Jan 23 '13 at 18:37
    
@Lg102: The indicated stay length would only be used for the graph. The idea was that if you hover or select a day, you'd get an overview of the prices for the different lengths of stay so the user can easily spot the price difference for an extra night (or a night less). I'll try to add a mockup of that as soon as I figure out how to create a new mockup based off the existing one... –  André Jan 23 '13 at 18:40
2  
This looks a lot like the Google Flights UI: google.com/flights/… –  Sam Pierce Lolla Jan 23 '13 at 21:35

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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