Week 3 @ Clearleft

So then I blinked and week three was over, how did that happen?

We started the week by critiquing our sketches from Friday and voting on our favourites with blue dots. We then discussed the elements we liked and summarised them into these categories:

  • Moods/presets (almost like playlists)
  • Maps
  • Open search (allowing open text search)
  • Travel avatars (which we nicknamed travatars)
  • Sliders/attributes (as a way to customise options)
  • Narrative/prose (using long form text with editable options)
  • Image-led
  • Weather/date (using the weather as the starting point dependent on time of year)

Once again we got the dots out and voted for our favourites. This is how the votes went:

  • Narrative/prose: 6 votes + CPO’s super vote (the project lead from Virgin Holidays was given a super vote which ensured that we included this element in our discussions)
  • Moods/resets: 4 votes
  • Image-led: 3 votes
  • Open search: 2 votes
  • Weather/date: 2 votes
  • Sliders/attributes: 2 votes
  • Maps: 1
  • Travel avatars: 0

Next we split into two smaller teams, with each team exploring one of the frontrunner ideas. My team was given the moods/presets approach. We decided to focus on how this might look on a small screen and did another couple of sketching exercises individually, which we then talked through as a group. I find these exercises a little challenging – a blank piece of paper can be a surprisingly scary thing – but they are a good way to quickly hone in on some ideas and evaluate what works or doesn’t work. My first attempt was a little rough around the edges but the underlying idea seemed functional:

My idea is for each question to be on a separate screen, almost like a wizard, with either imagery, sliders or a combination of both providing the input methods. I chose a double slider for the date as that makes it easier to select a wide range with the minimum of interactions required. For the images I have set the default as selected, with only the passengers one unselected initially. This seemed to be the approach that would place the least requirements on the user, allowing them to leave all options selected if they preferred. On the weather screen it felt difficult to combine temperature with rainfall so I split those out into two separate input styles. I did the same with journey, enabling the complexity and maximum time taken to be recorded separately.

We then looked at how this function would be accessed from the homepage. My idea was to have two options on the homepage, one to search for what you’re looking for and another to get inspiration through the wizard. This time it’s in desktop format:

My idea was to include the first question on the homepage to lead people into the wizard experience and give them a sense of what to expect. Then they are stepped through a series of questions, with all their answers so far stored in the panel on the lefthand side, enabling them to adjust their responses as they go and see what other questions they still have to answer. The content in the bottom panel would adjust depending on the answers. It’s not particularly elegant but again I think this would be fairly functional.

On the second day I swapped teams and took a look at the narrative/prose idea. I started off by looking at the sentence structure and considering all the possible customisable elements we might want to include. The full length sentence with all the possible options included was:

Show me holidays from London (All) to anywhere in June-July where I can do these things and enjoy the warm and dry weather. I’m travelling with my partner to celebrate our anniversary. My budget is on a shoestring and I like my holidays to be packed with adventure. I want my journey to be under 10 hours and super easy and I’d like my hotel to be near the beach.

This gave 12 separate options, so I looked at how each of these might be best presented. Some would need to be multiples, which I thought might present problems, while others were a little clunky from a prose perspective eg ‘travelling with myself’. I wasn’t sure on the technical constraints of this format, which made it tricky to narrow down the options. Myself and Declan from Virgin looked at this together and we both reached the conclusion that perhaps the prose style may not be the best approach. We focused our efforts on the open search option that he had been looking at, to see if we could combine these styles to greater effect. We did some more sketching and came up with slightly different approaches:

In my versions above I chose to split out the where and when questions, as I felt this would be easier for people to comprehend easily. I kept the what do you want to do/experience open to enable people to search on activities, location attributes or the type of weather they were looking for. In the first version I also showed how the other attributes could potentially be combined, as in some cases there was only one piece of information in that category that was useful in terms of generating search results, eg understanding if someone was price sensitive by selecting cheap/value as a priority is all you actually need to know about their budget. I think this is an interesting way to look at this, although the execution here may not be the best way to present it. Declan’s approach was a little more open, although he still split out travelling from, dates and passengers into separate boxes, with the main search box capturing everything else.

We reviewed both options with James Bates (creative director at Clearleft) and together we mocked up a new version that included the best parts of this approach. I then took that rough mock and increased the fidelity a little. Here’s my version:



I embellished the design and tweaked the microcopy to give a little brand personality and also provide some useful feedback to users on how their input would be interpreted. The design needs a lot more polish but I like the flow. The questions could all be on the same page if that felt like a sleeker user experience, although with only 4 questions this step by step process would probably not feel too arduous over separate pages.

The next task I looked at was the profile page. I chatted about the elements it would need to contain with Declan and then mocked up a rough version in Sketch. After further discussion I stripped out a couple of the features as they were unnecessary or a little too complicated for this project, and tightened up the rest. I also added in saved searches and gave more thought to the wishlist section which I think works better in the second version below:

My next task is to lay this out in mobile device format, considering how to split the sections up and navigate between them.

This week was so chockful I feel sure I’ve missed something important in this write-up. It’s been hard to capture everything and produce the required work at the same time, but I’ve found it a really valuable and educational experience.

It’s exciting to be part of this project team with such a fun, talented bunch of people. Hopefully the input I’ve been providing has been useful to the team. I’m looking forward to polishing up our concept next week and seeing it come to life.

Leave a Reply

Your email address will not be published. Required fields are marked *