Overview
When we began crafting the marketing website for Florin, a personal finance app, our goal was clear: to educate users about the app and build excitement around its community-driven mission. We wanted a site that was not just functional but engaging—a simple SaaS marketing site with a vibrant personality.
🧗♂️ The Challenge
Problem Statement
We needed a marketing site that was:
- Easy to navigate and visually clean, emphasizing Florin’s simplicity
- A gateway for users to access the app while learning about the product and community
- Dynamic enough to feel lively and engaging, avoiding a static, boring experience
- A Blog that was SEO optimised and easy to manage
📝 Design Process
Our Approach
To achieve these goals, we:
- Designed a mobile-first, accessible layout with a clean flow from exploration to app login
- Integrated Ghost CMS to manage our blog, enabling education and community building
- Added Framer Motion animations for a lively experience, from button effects to smooth transitions
Framer Motion entrance animations add subtle liveliness to the site
Key features and interactions of the Florin website
👨🏻💻 Technical Implementation
Engineering Challenges
One of the most significant challenges was integrating Ghost CMS with Next.js. After exploring various GitHub repositories combining Tailwind CSS, TypeScript, and Ghost, we successfully built a robust and flexible content management system.
Performance Optimizations
- Leveraged Ghost CMS’s SEO capabilities for blog content
- Implemented mobile-first responsive design
- Optimized assets and implemented lazy loading
- Integrated PostHog analytics for user behavior tracking
💥 Results and Impact
The Outcome
The Florin website successfully sets the stage for our alpha launch, creating a vibrant, engaging platform that reflects the app’s values. We are currently tracking engagement with PostHog analytics to understand how users interact with the site and identify areas for improvement.
🎯 Conclusion
Florin’s marketing website is more than just a landing page—it’s a dynamic, user-focused gateway that educates, engages, and connects users to the app. This project showcases the power of combining thoughtful UX design with modern web technologies to create an impactful digital experience.
Explore Florin
Visit the Florin website to learn more about our personal finance app and join our community.