Landing Page Redesign

Finding Focus's original landing page had been around since the company's early days. It no longer matched the audience we needed to persuade. Because teachers are the ones who decide whether Finding Focus gets brought into the classroom, the page needed to speak directly to them. Instead, much of the messaging and framing centered the student experience.

The goal for this project was simple: create a kick ass landing page that helps teachers understand the value of Finding Focus and gets them to sign up.

Reviewing other edtech landing pages gave me a better sense of what strong pages in the space were doing well and how we could improve our own. It helped me think through how we should introduce the product, communicate its value, and build trust with our audience.

To kick off the re-design of this page, my team and I sat down and began to work on defining Finding Focus's visual identity – which was lacking. It's hard to create a compelling landing page without a sense for what the visual identity should be and what the page should visually communicate. We knew we wanted our visual identity to convey: cool, modern, mature, and science-based – but we still needed to settle on a design style. One of the ways we as a team were able to tackle this was by sharing our existing assets and going over possible design styles we could lean into.

As I began working on the page, I kept coming back to a few simple questions: What is Finding Focus? Why should a teacher care? And why should they trust it? One activity we did as a team to help answer these questions was to imagine ourselves as teachers and map out their story from the ground up — identifying their goals, their frustrations with student distraction, and what it would take for them to trust a solution like Finding Focus.

I used the hero section as an opportunity to frame Finding Focus around outcomes teachers care about, highlight the product's credibility, and put a clear sign-up path front and center. That way, teachers could quickly understand the value of the platform without having to piece it together themselves.

I placed credibility signals directly below the hero so teachers could quickly see Finding Focus's legitimacy. By mentioning the university backing, educator involvement, and US DOE funding - the page is able to build trust early instead of making users question the legitimacy or search for it later.

One of the biggest problems with the original landing page was that it described Finding Focus without really going over the full product offering. I decided to show off the different offerings Finding Focus has by creating abstracted versions of the interface. These assets helped make the product easier to understand at a glance by showing the core parts of the platform in a way that felt clear, cohesive with the rest of the page, and easy to scan.

Finding Focus is grounded in research, and we really wanted to highlight that. Creating a research section helped us surface our measured outcomes in a way that demonstrate our value and would be relevant to teachers.

Testimonials were one of the clearest missing pieces from the original landing page. Bringing in real perspectives from both teachers and students helped make Finding Focus feel more credible, more human, and more proven in practice — all important for getting teachers to sign up.

Talking with my co-founder, we decided on a few ideas that were important to clarify and get across to our audience. The FAQ section helped us answer practical questions around who Finding Focus is for, why it matters, and how easy it is to get started — all of which helps reduce hesitation before signing up.

After spending the page building clarity and trust, I wanted to use the final section to really push conversion. I treated it almost like a second hero section — giving teachers one clear action to take, while reinforcing that getting started with Finding Focus is free and easy.

The complete landing page — all sections, from hero to footer.

Animating different assets gave me another way to make the page feel more engaging and delightful. Rather than using motion everywhere, I focused on a few places where it could support the content, improve the experience, or create a strong brand moment.

The product overview section was already quite attractive, but animating the different assets really helped elevate the overall experience. Because I created each asset from scratch as an SVG, I was able to use Claude Code to animate them on scroll. The goal was to make the section feel like a standout moment.

We wanted to show three testimonial cards at once, then bring in three new ones with each click rather than swapping them out one at a time. I used animation to make that transition feel more intentional and engaging, while also helping the section stand out. I prototyped the interaction in Claude Code, then shared it with my SWE so it could be implemented in the final page.

For the final CTA, I reused a pulsing animation of the Finding Focus logo to create a stronger brand moment at the point of conversion. Because the animation was built as a Lottie, it felt polished and high quality while adding a bit more life to the end of the page.