LanceDB Marketing Site

The problem

LanceDB’s audience is developers, and the site wasn’t speaking their language clearly. The messaging needed to shift — away from generic positioning and toward something that made immediately obvious what the product does and why it matters to a technical audience. I’d helped shape the original site, so I understood what had worked and what hadn’t going in.

The design work

I redesigned the homepage, all product pages, the partners and customers page, the blog and its templates — a full overhaul of the site, building on the foundation of the previous version I’d also helped design (which included the pricing page, lead capture forms, and download flows).

Every animation on the site is original work. The homepage runs a continuous animation — a flowing stream of dots that brings the product concept to life. The inner page animations required more deliberate thinking: I worked through each one frame by frame, mapping out the sequence, sometimes creating separate asset files so the AI had precise references to work from. Claude and Codex handled the technical execution; I handled the thinking behind every frame.

Before

After

The brand system

Beyond the site, I built a dual-format brand system. A Figma file the internal team can reference for design decisions. And a set of MD files structured specifically for AI — defining brand voice, visual rules, and usage patterns in a format that any model can read and apply.

The idea: the team can prompt Claude with those files and generate pitch decks, ads, or image assets that stay on-brand without needing a designer for every request. It’s a starting point, and it’s meant to evolve as the brand does.

Figma brand guidelines

BRAND_GUIDELINES.md

# LanceDB Brand Guidelines

> Purpose: Reference for Claude skills and human team use.

## 1. Brand Essence
Tagline: The lakehouse for multimodal AI.
Voice: Technical but human. Direct, outcome-focused.

## 3. Color Palette
dark-800  #171513  Primary background
dark-700  #1e1b19  Cards, slide bg
offwhite  #f4ebe8  Light surfaces
orange-400 #ff734a  Primary CTA
lavender  #e7d2f6  Gradient start

## 13. Quick Reference
GRADIENT  linear-gradient(90deg, #e7d2f6, #ff734a)
HEADING   Aeonik Fono  |  400  |  -2% tracking
BODY      Aeonik Pro   |  400/500
DECK      Hanken Grotesk + JetBrains Mono
RADIUS    4px buttons  |  0px web containers

Brand MD file

AI-generated pitch deck slide

AI-generated ad asset