Visit Website

Hofy SaaS-Based Marketplace with ERP and Logistics

Role: Front end Developer
Project: AI SaaS Landing Starter (marketing website + pricing)
Goal: Launch a high-converting landing page for an AI SaaS product with clear messaging, pricing, and a “get started” funnel.

The challenge

We needed a modern marketing site that:

  • Explains product value quickly (AI chatbot + personalized recommendations)

  • Converts visitors with clear pricing tiers (Basic vs Enterprise)

  • Stays fast (Core Web Vitals), SEO-friendly, and easy to customize for new copy/features

What I did
1) Built a modular landing page system

  • Implemented reusable sections (Hero, Features, Pricing, FAQ/Details, CTA) so content could be rearranged without rewriting layout code.

  • Created a consistent component API for headings, badges, feature lists, and icons to keep the design uniform across sections.

2) Shipped a pricing section optimized for conversions

  • Built Basic and Enterprise plans with feature checklists and prominent CTAs (“Get started” / “Contact us”), matching what the product communicates. 

  • Designed pricing cards for easy iteration (switching price copy, highlighting a recommended plan, adding annual/monthly toggle if needed).

3) Improved performance + SEO foundations

  • Ensured semantic HTML structure (proper headings, descriptive sections) for search engines and accessibility.

  • Optimized images/assets and enforced good defaults (lazy-loading where appropriate, minimizing layout shift).

  • Set up metadata and share previews to make the site look good when posted on LinkedIn/Twitter.

4) Developer experience: easy to fork and deploy

  • Structured the repo so changing brand name, colors, copy, and plan features takes minutes.

  • Added clean environment separation (dev/prod) and deployment-friendly configuration (ideal for Vercel-style workflows).

Outcome

  • Delivered a polished landing experience that clearly communicates the product’s promise (AI chatbot + personalized recommendations) and pushes users toward a decision with strong CTAs and pricing clarity.

  • Enabled faster marketing iteration: new sections/pricing edits can be shipped without redesigning the whole page.

Tech stack 

  • Next.js + React + TypeScript

  • Tailwind CSS / component library

  • Deployed on Vercel (CI/CD)