HarvestHub Meal Planner
Conversion-focused marketing site for a fictional meal-planning SaaS, with clear value props, pricing, and product storytelling.
Project snapshot
A clean, wellness-focused SaaS experience crafted for clarity, trust, and conversions.
A marketing layer built in Next.js featuring scannable value props, pricing tiers, UI previews, and mobile-first optimization for founders ready to launch.
Overview
HarvestHub is a fictional SaaS tool that offers smart weekly meal plans, nutrition insights, and automated grocery lists. This project focuses on the marketing layer: a clean, conversion-oriented landing page designed to quickly communicate value.
Challenge
For SaaS marketing, visitors need to understand the product within seconds. The challenge was to balance a friendly, wellness-focused visual language with crisp messaging, clear hierarchy, and strong calls-to-action.
Approach
I developed a messaging framework built around four core benefits—save time, reduce waste, eat better, and make planning effortless. UI mockups of the product are woven into the page to show features like AI recipe suggestions, calendar planning, and grocery list generation.
UX & UI Design
The hero section pairs a strong headline with an app preview and a primary CTA. Below that, feature blocks, an example weekly plan, pricing tiers, and testimonials guide visitors toward signup. The layout is intentionally scannable, with clear typography and ample breathing room.
Engineering
The marketing site is implemented with Next.js and static optimization for performance. Feature data, pricing tiers, and testimonial content are modeled as TypeScript objects so they can be easily changed without touching markup. The design system reuses core components and spacing from the rest of the SmalCoda site.
Outcome
HarvestHub demonstrates how SmalCoda can support early-stage SaaS teams with clear, trustworthy marketing that’s ready to grow—starting with a strong landing page, scalable components, and room for product screenshots and demos.