Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Hotel Tonight in the Age of Context


Published on

I was asked by Hotel Tonight to reimagine their browsing experience, reduce friction and increase conversions.

I started from the assumption that it is possible to capture users preferences and understand their future plans. This way the app could focus on a smaller number of hotels more likely to be chosen by the user.

After exploring a revisited version of the hotel list, I moved to an idea that the app could get rid of the list all together and use a cards based interface.

For that I explored both a vertical and a horizontal swiping options, settling on the latter and creating a hi-def mockups.

Published in: Design, Technology, Art & Photos
  • Hi there! Get Your Professional Job-Winning Resume Here - Check our website!
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

Hotel Tonight in the Age of Context

  1. 1. Hotel Tonight in the Age of Context by Davide Di Cillo
  2. 2. Exercise Redesign the list view with a revolutionary upgrade while preserving Hotel Tonight’s brand image
  3. 3. Goals Increase conversions ! ! ! Reduce friction ! ! ! Maintain HT style
  4. 4. Assumptions Focus on key choice factors ! ! ! Integrate email and calendar ! ! ! Get social and contextual data + + +
  5. 5. List view - Top feature Pros: ‣ Familiar look and experience ‣ Current animations can be maintained ! Cons: ‣ Doesn’t look very well with too few results ‣ Empty space after last result is awkward ! Possible solutions: ‣ Use the empty space after last result for other purposes City Name # night< Cities
  6. 6. Card view - Vertical swipe Pros: ‣ More real estate ‣ Most of the current animations can be maintained ! Cons: ‣ Swiping to see next card less intuitive ‣ Swiping down to see full screen pics 
 won’t work ! Possible solutions: ‣ Instruction “Swipe for more” ‣ Tutorial ‣ Position indicator City Name # night BOOK NOW
  7. 7. Card view - Horizontal swipe Pros: ‣ Very intuitive ! Cons: ‣ Horizontal swipe conflict with image swipe ‣ Challenging image transition to full screen ! Possible solutions: ‣ Card could zoom in and the tapped image would expand City Name # night BOOK NOW
  8. 8. Card content Wish list: ‣ Focus on decision making attributes ‣ Bigger picture ! Question: ‣ What does the user really care about?
 (I.e. Is the address/map more important than the geo context of the hotel’s position?) City Name # night BOOK NOW Hotel Name 65% ratings from HT Decision factor 1 Decision factor 2 Decision factor 3 More… Best price $000 $000
  9. 9. Visuals
  10. 10. Visuals Super-sized and blurred main image as background for ambiance Swipe on picture to see more pictures or tap to see full screen Icon to trigger the classical list view City name used for changing city Tap on info area to see more info including address and map Improved image cut
  11. 11. Transition Card swipe: ‣ Blurred background should fade into the blurred background of the next card ‣ Book button’s color should fade into the color for the next card ! Tap on picture: ‣ The card should zoom out to feel the entire screen ‣ Card elements should slide out similarly to the current animation ‣ Close button and page indicator should slide in ! Swipe on picture: ‣ Blurred background should fade into the blurred background of the next picture