AetherMind
Organize your work, track progress, and collaborate in real-time with a smart, clean task board for any team.
Client
AetherMind Inc.
Industry
SaaS
Timeline
6 Weeks
Technologies
React, Supabase, CSS
Overview
AetherMind is a mindfulness and mental wellness platform enhanced by AI. The product offers users personalized audio sessions, journaling tools, and emotional tracking powered by intelligent insights. Our team was brought in to create a soothing, user-centric landing page that communicated emotional depth, trust, and innovation.
The challenge was balancing a calming wellness aesthetic with futuristic AI capabilities—all while making the site conversion-focused and CMS-ready.
Research & Strategy
We explored leading platforms in wellness and therapy apps—like Headspace, Calm, and Wysa. We also spoke to AetherMind’s product team to understand user motivations and the emotional tone needed for the brand.
Strategy Goals:
Establish trust and safety with users through soft design and clear messaging
Highlight personalized, AI-driven wellness journeys
Include interactive previews of session types and features
Design & Development
The design uses gentle gradients, soft motion, and a muted color palette of lavender, soft blues, and off-whites. Rounded cards, microinteractions, and smooth scrolling reinforce the feeling of calm while maintaining professional clarity.
UX Features:
Audio session preview carousel
Interactive emotion check-in UI
AI insights explainer with step-by-step visuals
Development Highlights:
Built in Framer with custom interactions
Lottie animations for session flow previews
Firebase integration simulated for real-time updates
Fully CMS-driven testimonials and feature updates
Key Features
Mindfulness Audio Demos
AI-Driven Mood Tracker
CMS-Powered Blog & Tips Section
Mobile-First Layout with Accessibility Focus
Outcomes
After launch, AetherMind saw a 62% boost in trial signups, and the homepage bounce rate dropped by nearly 40%. Users responded well to the emotion-first design, and product trust increased—critical for the wellness space.
The site was also featured on Framer’s showcase page for its creative use of scroll interactions and calm motion design.
Tech Stack
Framer, Firebase, Tailwind CSS, Figma, Lottie, Framer CMS
Problem Occurred During Execution.
NovaAI’s initial web presence lacked structure, clarity, and impact. The brand needed a compelling landing page that could effectively explain the product, generate beta sign-ups, and establish credibility among early users and potential investors.
Challenges Identified:
Unclear product positioning and messaging
No visual hierarchy or design consistency
Low mobile responsiveness and poor performance
Absence of SEO and lead capture elements
Strategic Solution
I stepped in to create a polished, responsive, and conversion-optimized SaaS website using modern tools and design principles.
Key Actions Taken:
Built a dynamic, mobile-first layout using Next.js and Tailwind CSS
Integrated Framer Motion for smooth animations and user engagement
Developed reusable, scalable UI components
Deployed to Vercel with CI/CD, image optimization, and caching
Added lead capture via beta access form with validation
Improved SEO and accessibility for better discoverability
Takeaways
With AetherMind, we proved that wellness and AI don’t need to feel cold or clinical. By designing with empathy and flow in mind, we delivered an experience that supported both user emotion and product goals.
More Project
</
>
