Landing, Conversion Architecture[Launched]

A Conversion System for an Education Product

A Conversion System for an Education Product preview

System Architecture //

Next.jsTypeScriptGA4Google Tag ManagerMeta PixelMicrosoft ClarityTelegramPayment Flow

1. Project Overview

The education product acquired most of its audience through mobile advertising, but the old landing page was overloaded with content, images, repeated CTAs and technical wrappers. It was meant to sell education, yet it did not give visitors a short, obvious path from the first screen to an enquiry or payment

The task was not simply to redesign the page, but to rebuild the conversion path: explain the offer clearly, remove friction, make booking and payment coherent, and make every important step measurable

My role covered UX audit, funnel architecture, a new mobile-first website, integrations, consent-aware analytics and an internal dashboard for advertising and commercial performance

New education product landing page

2. Starting Point

•The old page contained more than 80 images and roughly 606 KB of HTML before external resources loaded
•Mobile LCP was around 9.2 seconds and the performance score was 66/100
•Average scroll depth was only 15.9%, so most visitors never reached the lower sections
•Almost half of mobile taps landed on images and wrappers instead of a clearly isolated CTA
•Advertising, the website, Telegram, booking, payment and analytics did not form one transparent chain

3. Objectives

•Rebuild the page as a concise mobile-first funnel with a clear value proposition
•Put the primary CTA on the first screen and add a separate final CTA
•Move visitors from landing page to booking, format selection and payment without unnecessary detours
•Make self-study, curator support and mentorship easy to compare
•Measure hero CTA, final CTA, enquiries, bookings, payments and revenue
•Respect consent: analytics and marketing scripts only run after the relevant permission

4. Solution

UX audit and information architecture

•Audited the old page, mobile heatmaps, scroll depth, recordings and performance metrics
•Replaced the endless landing page with a compact route: hero → explanation → proof → audience → final CTA
•Removed repeated copy, excessive timers and decorative noise that did not help the next decision
•Rebuilt the site in Next.js with controlled structure, stable layout and faster loading
Booking page

Learning and payment funnel

•Built a dedicated booking page that explains the reservation and how it is credited toward the programme
•Added a clear comparison of self-study, curator support and mentorship
•Separated checkout from marketing content so payment happens in a calm, predictable context
•Added a dedicated success flow with clear next steps after payment
Learning formats
Payment confirmation

Analytics and conversion control

•Added separate hero CTA and final CTA events to identify where visitors make decisions
•Connected GA4, GTM, Meta Pixel and Clarity through consent-aware logic
•Added server-side event queuing and event_id deduplication
•Built an internal dashboard combining spend, clicks, leads, bookings, payments, revenue, CPL, CAC and ROAS
Internal conversion dashboard
•Published a GTM version with consent guard and a Lead tag for a controlled, auditable event lifecycle
GTM event control

5. Result

•Replaced an overloaded Weblium page with a controlled mobile-first product and a clear funnel
•Made the path from advertising to CTA, booking, checkout and success page coherent and measurable
•Gave the team a system for seeing acquisition cost, lead volume and movement toward payment in one place
•Created a reliable basis for further conversion optimisation based on real events rather than assumptions

6. Technical Outcome

This was not a redesign of one landing page in isolation. It was a rebuild of the contact point between advertising, the education product and sales. The new site removed user friction, while the internal analytics made the commercial outcome visible in one system

Ready to solve a similar challenge?

Building reliable systems requires precision and experience. Let's discuss how surgical engineering can restore pace to your product