top of page
The UK's largest gifting site

Our mission

For everyone in the UK to create unique memories that last a lifetime.

Our vision

To be the most trusted platform in the UK gift experience market.

Our company

We are the UK’s leading gift experience provider. Our core focus is to deliver happiness to our customers, partners, our team and retail partners - we aim to do this by providing industry leading products.

Dealing with a large and complex site meant that there were often more hours spent firefighting urgent issues than being able to carry out user testing and usability studies. However, when time allowed the classic User Experience methods were carried out to improve consistency, clarity and perhaps a more clear & simple means of enjoying the large variety of UK's most enjoyable experiences.

Competitor Analysis

Research into both direct and indirect competitors to assess the UI, and the UX and how responsive the site was.

 

Noting the usability of the site particularly around journey navigation and the capability of their search engines gave us a measure of the maturity of the site and its general ease of use.

 

Behaviourally, we looked at how they approach similar issues that we were experiencing and the methods they might or might not employ to solve them. For instance, allowing users an upfront opportunity to view their availability with hotel bookings or days out experiences was always an issue. Looking at 'booking.com', 'Expedia' and various airlines helped us create several solutions that improved the user experience and journey NPS scores.

Google Analytics - Data

User behavioural trends were captured through opening rates, click through rates, drop-off rates and conversion rates.

 

Data, however, has a tendency to show what is happening but not the why or the how.

Design Studios

Crazy eights with team members and stakeholders for the purpose of developing design ideation, granting ownership, buy-in and collaboration to design and journey pathways.  

Brainstorming Sessions - Miro

Collaborative brainstorming with an online MIRO board amongst Stakeholders and Team members was often used to better define user issues, how they might be solved or create solution framing.

 

Agreement on prioritisation by degrees of difficulty, time, expertise and tools required  could be gained expediently during the same session whilst everyone attending was in the same headspace.

 

This could pave the way for changes to the roadmap and the sprint backlog in the agile environment we were using.

Handover to Front-end Developers

Prototypes in Sketch, Figma or InVision with documentation. Often inspect in Zeplin proved to be the better option than InVision.

Close collaboration with the developers was essential for good handover and the best  interpretation of the designs and functional UX journies.

User Testing & Usability Studies

Qualitative research was carried out with unmoderated and moderated testing methods with users by means of a staging site or shared prototypes on Sketch or InVision. Iterating with users and retesting strengthened our ability to improve usability.

Persona Creation

From user testing and usability studies the persona were created and tested to gain important information on the most likely demographics, behaviour and device types being used on the site.

 

For instance, a high percentage of users explored the site on mobile but would often revisit the site several days later on a laptop or desktop device to confirm an experience or a booking. Driving or certain sports were more popular with men than women and of a particular age group. However, this could also change, depending on the occasion and the relationships they shared.

 

It helped us to target our journey behaviours, the UX and UI requirements, in line with a specific user aim. This led to a growing need for site evolution and greater personalisation.

 

It also allowed for changes and trends in user persona throughout changing health, social and financial environments.

 

Importantly, changes to software (AI) and other technology (API's) meant that we could take some steps to addressing these changing user expectations. With usability testing we could regularly assess and adjust to the user need and goals appropriately. 

Stakeholder Presentations

Frequent meetings with stakeholders to establish and maintain relationships by regular meetings or presentations, maintaining communications, transparency, knowledge sharing & updates. Representing the user view to gain stakeholder buy-in and improving team ownership.

Agile Sprint Dev/ops

Pushing projects forward from the backlog into 2 week sprints with a scrum-master. Setting out the aims of the tasks, the requirements, the end scenarios, the scope and the deliverables. Making use of Sketch or Figma to create various wireframe examples, low fidelity screens and gaining stakeholder approval to iterate and take them through into Hi-fidelity designs. Creating responsive designs for mobile, tablet and desktop versions. Producing consistency from styleguides, and clear documentation for prototype journeys of required end-scenarios, including error messaging. Prototyping in InVision and using Zeplin for dev inspect.

Projects were created to the improve the design and functional consistency, seeking to highlight and improve the overall site usability in as many ways as possible.

On the voucher redemption part of the site, the user redeems their gift voucher by first entering the voucher details and hopes to have a clear and simple journey that is informative and pleasurable. 

  • To this end, various projects were undertaken to improve the UI & UX consistency by means of

  • Updating the design system style-guide and implementing it via front-end development. 

Styleguide_1x.png
Typography_1x.png
  • Improving consistency to design responsiveness using base grids for better developer handover.

Mobile.png
  • Consistency of horizontal and vertical spacing for screen components and elements.

  • Establishing set border corners and shadows for site cards and components.

  • Gaining balance within a screen, ease of visibility and hierarchy.

  • Improving the overall information architecture. 

Spacing_1x.png
Component Details_1x.png
  • Footer and Header Elements and Components were made consistent and responsive for large screens, desktop, tablet and mobile.

Header_1x.png
Footer_1x.png
  • Buttons Toggles and Badges

Buttons_1x_edited_edited.jpg
  • Filters for the Product Page including Date Picker

There are two parts to the site:

  1. Purchasing of an experience voucher for gifting purposes and

  2. Redemption of the voucher by the gift receiver.

  3. This project was aimed at the redemption part of the site within the 'Days Out' category

  • Designed to account for both single location vouchers (SLV's) and multiple location vouchers (MLV's) in a single flow that had previously required separate and often inconsistent journeys.

  • Research showed his had caused confusion to users resulting in a high level of drop-offs and poor conversion. 

  • Brainstorming amongst stakeholders, and the team led to a redesign of the user flow such that it was prioritised by 'date first' rather than the previous 'location first' entry to voucher redemption. 

  • This would accommodate both single and multiple location experiences with a simpler, clear and consistent UI and (UX) functionality.

  • There was a need to help the usability further by the better resourcing of availability from suppliers and also, in-house improvements to the back-end API, to source up-to-date data, reducing false positives or situations of no availability.

Date Modal Availability 5 Circle Unselected (D).png
Date Modal Availability 5 Circle Selected 11.png
1. Search Page (D).png
2. Search Page (M).png
  • Clicking through on a specific date took the user to the product landing page (PLP). 

  • The PLP gave the user a selection of 'available experience options' for the selected date for that voucher experience.

  • The choice was 'within voucher price' or for 'upgraded experiences' with upgraded prices.

In Voucher price.png
Upgrade price.png
6. Shard Product Display Page Options.png
6a. Product Page Time Open Selected (M).png
  • Clicking a (product) experience option on the PLP carried the user through to the product display page (PDP).

  • On the product page the user has the flexibility to increase the number of people for the experience, including, in some instances, the ability to add children.

  • Clicking on the date and time filters allowed for editing and refinement of date & time.

  • Clicking on the 'Continue' CTA allowed for a final check with the API for the availability of any changes made. 

  • If the availability had changed or there was no availability the date-picker would reopen and offer alternative dates & times that were available from the extra changes.

  • This functionality is similar to examples seen on hotel and flight booking sites and only possible with good dev and back-end collaboration.

  • With B-2-B involvement that means good collaborative work with the experience provider also.

Group 5a Final.png
  • Once the user has chosen an available date and time to suit the number of people attending the experience the 'Continue' CTA would be available to proceed to the 'Checkout Page'.

  • All parts of the journey experience are fully visible to the user including all costings.

  • It displays the original voucher details and price.

  • The added upgrade option selected by the user and its price.

  • The number of people that were originally included with the voucher and that price.

  • The extra number of people and that price.

  • The date and time that the experience has been selected for.

  • The total price to be paid by the user.

  • Agreement to Terms & Conditions.

Checkout Summary 2ad.png
  • Once this page is complete the user can click through to the Confirmation Page and subsequently Email Confirmation.

  • As part of the header/Top Navigation, there is an onsite link to a help section offering FAQ's and the ability to chat with someone directly.

  • The Confirmation Page clearly displays all the information about the experience, the purchasing steps taken, the pricing at each stage and the total price to the user.

  • In addition it confirms that these details have been sent by email - a choice of email, post or both are available earlier earlier in the cycle during the voucher validation process.

  • There is a booking confirmation number and a supplier reference number.

  • At this point in the user's journey they are also offered the chance to rate the experience they have had.

24. Shard Confirmation Page (D).png
  • The Email Confirmation Page with a barcode feature for paper and digital scanning.

bottom of page