Forest Holidays

Combining forces with Forest Holidays’ team, we fixed a number of issues in a short time-frame leading to major improvements in the UX & UI, site performance and time to market.

Scope

UX/UI & Development

Industry

Travel & Hospitality

Services

Team Augmentation

Technologies
React
Next.js
TypeScript
Redux
Node JS
Adobe XD
forest-frontforest-back

Forest Holidays

Combining forces with Forest Holidays’ team, we fixed a number of issues in a short time-frame leading to major improvements in the UX & UI, site performance and time to market.

city-guidecity-guide
Scope

UX/UI & Development

Industry

Travel & Hospitality

Services

Team Augmentation

Technologies
React
Next.js
TypeScript
Redux
Node JS
Adobe XD
INTRODUCTION

About the Project

Forest Holidays is a lodging provider with multiple locations around UK’s forests. They cater to people who are looking to create memorable outdoor experiences and reconnect with nature. Visitors can find hand-picked content and forest guides as well as benefit from an interactive booking journey to find their perfect cabin. After our collaboration, Forest Holidays saw a:

162%

increase in visitor conversions

12.5x

increase in performance & scalability

90

dev hours saved every month

Before

An outdated website that wasn’t mobile-friendly with a slow booking process. The site was customisable only by devs.

after

A clean, modern & mobile-friendly web app. A highly-customisable booking journey with a smooth user experience.

forest holiday

Partnership

We worked closely with Forest Holidays’ internal team to create detailed UX & UI mockups for all the features and assist with implementing them.

User Experience Design

User Interface Design

Front-end development

Back-end development

PROCESS

The Challenge

Forest Holidays’ internal dev team was facing a number of technical challenges - from long build times to slow testing. Design-wise, they were looking to revamp the website and improve the user journey.

Development & Testing

The delivery of new features or any updates to the system was a long and tedious process. Unit testing was also running slow resulting in a large amount of stale bugs and issues with the app.

Site Performance

There was a significant drop in site performance caused by complex pages with a great deal of content and high-quality images. As a result, loading times were slow, hurting the user experience.

Design & User Experience

The client wanted to make their booking process more flexible. The user journey had to be comprehensive, but intuitive while new screens stayed consistent with the flow of the old system and in line with branding.

PROCESS

Our Approach

Throughout, we followed a solution-oriented approach, tackling issues one by one in a quick manner.

approach-image
SOLUTION 1

Infrastructure & architecture

To address the slow implementation of changes, we upgraded to a modern mono-repo architecture, moving the internal NPM to a NX. Although this change was challenging, the end-result introduced speedier development for engineers.

Having one depository instead of working on two fronts makes it easier to test and view local changes. Developers could now run projects locally as well as optimise code for specific browsers. At the end, a running example with NX was achieved in just 3 days.

approach-image
SOLUTION 2

Development

We helped Forest Holidays launch a number of features, using a modern stack: React, Next.JS, NX, Typescript, Node & Redux. We also used GraphQL to power the data layer, giving us a lot of flexibility when it comes to retrieving and manipulating data. One of the benefits of this stack is the performance and stability it offers.

The new stack also allowed us to build a reusable component library. This means that we can easily create new pages and features quickly without having to start from scratch each time.

approach-image
SOLUTION 3

Testing & Code Quality

By improving pipeline and unit test speed, we were able to minimise frustration and long wait-times when developers had to commit new features. This improved team morale, speed and code quality. Together, the team was able to target all of the stale bugs and clean up the app.

approach-image
SOLUTION 4

User Experience & Design

Coming into the project, we had to improve existing screens to ensure they were consistent with the business goals and branding. Following the set of business requirements, we also created sketches for the new screens.

The sketches evolved to high-fidelity wireframes & mockups ready for user testing. With each iteration, we got closer to creating an intuitive and interactive user experience, without overwhelming visitors.

result

impact

SEO

Bundle size was reduced by 50% which greatly improved page loading speed and boosted SEO rankings. This gives Forest Holidays a competitive edge and better reach.

Time To Market

A running project was achieved in just 3 days. This meant the internal dev team at Forest Holidays had more time to focus on implementing new features, reducing time to market.

Productivity

Each developer saved around 30 minutes a day, resulting in 90 development hours saved per month for the company & boosting employee morale.

Marketing

The integration of new headless CMS allowed the team to quickly change content on the site as well as launch and update campaigns, without having to consult developers.

User Experience

In addition to improving site performance, users can now benefit from a new interactive booking process that is also flexible, simple but comprehensive, and easy to navigate.

Mobile-Friendly

The new and improved website was optimised for use on any screen, providing a seamless and consistent experience for all visitors. Navigation is easy, making it simple for users to find the information they need.

avatar
avatar

Peter Anderson

Forest Holidays CTO

avatar

All Front is able to bring in more developers when we needed them. They were self-managed and high-quality individuals, so they're able to fit in with our project management approach quite happily.

4.5star iconstar iconstar iconstar iconstar icon
avatar
CASE STUDIES

See More Of Our Stories

Payments

Learn more
case study cs_openpayd.png

Crypto

Learn more
case study cs_wexsel.png

Take a look at how we enhanced this gaming monitoring platform's app architecture with a fresh UX/UI and a number of first-rate features

Regtech

Learn more
case study cs_legalyse.png
arrow forward

Let’s start the process.

Let’s start the process.

It's time to partner with us.