CorpFlow

The Brief

A B2B SaaS product needed both a marketing site that explains the product clearly, and the actual in-app UI components (kanban board, project timelines) the product runs on.

The Approach

1. 01Designed a small component system first (buttons, cards, form patterns) so the marketing site and the product UI share a visual language instead of feeling like two different products.
2. 02Built the kanban board around real project states (Ready, Active, Blocked, Complete) rather than a generic to-do list.
3. 03Backed tasks, boards, and timelines with Firebase so a card moved by one teammate updates on everyone else's screen without a refresh.
4. 04Mapped the onboarding flow around the fewest steps to first value, not the fewest steps to a completed signup form.

What We Built

• Next.js and React front end for both the marketing site and the product's core UI.
• Kanban board and Gantt-style project timeline built as the product's core interactive views.
• Firebase (Firestore) as the database, syncing task, board, and timeline state in real time across a connected team.
• Shared design tokens (color, spacing, type scale) used across marketing and in-app surfaces so they read as one product.
• Full technical journey: Next.js/React frontend, Firebase Firestore database, real-time sync across every connected team member.

The Result

A consistent product experience from the first marketing page through onboarding into the live app.