HelloData Website

Custom Webflow site for HelloData - an AI-powered automated market analysis platform for the multifamily real estate industry.

Tech Stack

• Platform: Webflow
• Custom Code: HTML, CSS, JavaScript
• Design System: Custom component library

Project Structure

HelloData-Website/
├── Webpages for HD site/    # Landing page HTML files
│   ├── _preview/            # Local preview tool
│   │   ├── index.html       # Preview application
│   │   ├── manifest.json    # Page list
│   │   └── README.md        # Tool documentation
│   └── *.html               # Landing page files
├── docs/                    # Project documentation
│   ├── audience-product-report.md
│   ├── web-best-practices.md
│   └── landing-page-optimization.md
├── library/                 # Component libraries
│   ├── hellodata-master-library-v40.html
│   ├── HDlibrary.zip
│   └── HDlibrary/
│       ├── hellodata-complete-library.html
│       ├── hellodata-design-system-webflow.md
│       └── hellodata-ai-session-prompt.md
└── assets/                  # Static assets

Design Tokens

The design system uses centralized CSS custom properties hosted via a public GitHub Gist for universal control across all Webflow pages.

Quick Links:

• Gist Page: https://gist.github.com/goov373/c688f2706b480dcc6099944d1c38e135
• Documentation: library/README.md

Webflow Setup: Add this to Site Settings → Custom Code → Head:

<link rel="stylesheet" href="https://gist.githubusercontent.com/goov373/c688f2706b480dcc6099944d1c38e135/raw/tokens.css">

Updating Tokens: Edit library/tokens.css locally, then sync to gist:

gh gist edit c688f2706b480dcc6099944d1c38e135 library/tokens.css

Documentation

See the docs folder for detailed documentation:

• Spacing Token System - 8px grid system, all token values, usage guidelines, and exceptions
• Audience & Product Report - Target audience profiles and product positioning
• Web Best Practices - Development guidelines and conversion optimization
• Landing Page Optimization - Performance and UX best practices

Getting Started

1. Clone the repository
2. Review documentation in docs/
3. Reference component library in library/ for Webflow implementation

Preview Tool

Preview and audit landing pages locally:

bun dev
# Open http://localhost:5151/_preview/

Features:

• Browse all landing pages by category
• View latest vs older versions
• Scan pages for brand compliance

See Webpages for HD site/_preview/README.md for full documentation.

Contributing

1. Create a feature branch
2. Make changes
3. Submit a pull request for review