GoStudent - CRO Landing Page

Creating a landing page that converts 🤑

I was tasked with re-designing a low performing CRO page for GoStudent, who provide one-to-one, online tuition. I was given full creative freedom to think beyond the constraints of Storyblok, the platform on which the original page was built. We had just completed a brand update, so I incorporated the new guidelines while introducing new graphics to elevate our user experience and amplify our voice in a crowded market.

“Jodie went above and beyond to deliver a very high-quality landing page template that combined the best of CRO and brand, which is usually a tricky challenge. The CRO team was impressed with not only her design skills but also the thoughts, research and reflections she has put into the design of each component (she even added some audios of her user interviews to demonstrate and back up her design choices!). Her professionalism, dynamism and rigour make her one of the best designers I’ve worked with. Hire her!” - CRO Manager

Scope

UX & UI
User testing
Video creating

Tools

Figma
Afte effects
User Testig

Timeline

2 weeks

Live design

My analysis identified several elements of the website which fail to establish trust in the company, decreasing the sign up rate for a trial session of the service. For example;

Asking for personal information before giving any information about the company.
Providing no clear value proposition or differentiator against competitors.
Low quality imaging.

Image of user group one: the wellness enthusiast and one-off purchaser.

Low fidelity wireframes

Below are the low fidelity designs proposed to me from the CRO team. I did not design these, but they demonstrate the starting point for this project. We adopted a mobile first approach as the majority of new customers were discovering us this way.

Design style iteration

I designed in a block method, whereby each section [e.g header, services, how it works] was it's own block with various design iterations. This enabled us to piece different blocks together to assemble the final page.

Shown below are the two brand styles:

'On brand' : Incorporates the new brand elements like the updated logo, new colous, and images while staying true to the GoStudent voice, using elements inspired by previous designs.
'Expanded brand' : Utilises new iconography and the full spectrum of colours to appeal to children and their families, making it fun, engaging, and distinctive.

Of course, this 'expanded brand' would require sign off from various teams, which is why I still designed an 'on brand' CRO page for immediate implementation. However, myself and the lead designer preferred the 'expanded brand' and pushed for this in stakeholder presentations.
‍
To see the various iterations of both style options, go to Figma (theres lot's to see 😉)

Expanded brand final design

This is the final page assembled using the 'expanded brand' elements. This was presented to and approved by the CRO team for further development.

Key elements in the design

A/B Testing

Using the platform User Testing, I set up an A/B test to compare customers reaction to the live design and the new design (above). The questions were set up within the platform and 5 user participated by recording ther screens. They were asked for;

Design feedback (first impressions, likes, dislikes, improvements)
Rating of likeliness to book a trial session (scale 1-5) from each desgn
Which design they prefer

The core insight from this testing was that likelihood to book a trial session of the service increased by 40% with my proposed design.

Project Outcome

The design and CRO team were impressed with the 'expanded brand' design and requested that I create a pitch to present to our strategy and branding teams, highlighting its benefits. To showcase the value of these updates, I produced a short promotional video.

The original video featured impactful voice quotes from user testing, but I have removed them to maintain user confidentiality (so you'll have to trust me on that).

After I left the company, a CRO designer picked up these designs to continue development.