CloudRift Landing Rebuild

01

The Trigger

Agency-designed site: polished surface, no UX, no system. Investors and enterprise buyers read it as immature. I had just joined the team, knew design but not the GPU-cloud domain.

02

Research

Two parallel streams. Domain immersion with the founding engineers, because I did not have enough domain knowledge to make assumptions. That meant asking the engineers far more questions than a domain expert would have needed; the extra time bought a page free of unexamined assumptions. User testing on the existing site to find actual friction. Three root causes emerged: missing design system, primitive sprawl (dozens of one-off colors and spacing values instead of a shared token set), no codified decisions.

03

What I Tried First

April 2025: a first redesign. Basic style guide, cleaner sections, dark dev-product aesthetic. Time-pressed and domain-thin, the surface was coherent but the system underneath was missing.

04

What Broke

Still a generic GPU-cloud landing page. The deeper problem was a blurry product story: the page addressed every possible audience at once, datacenter providers on the supply side and AI teams on the demand side. Stakeholders kept asking the same questions. That diagnosis split in two. The positioning had to be articulated before any page could carry it, and the craft problems needed a system rather than another one-off design pass. My research had covered craft and friction; the positioning gap only surfaced once stakeholders reviewed a finished attempt.

stakeholder

"What does the process actually look like? The site lists features and benefits, but what does the service entail? Is it consultation? Is it a software platform?"

stakeholder

"Who are you talking to? Datacenter providers? AI startups? Small GPU owners who want to sell capacity? Are you just a GPU marketplace?"

stakeholder

"Do you actually sell your own compute, or are you a broker?"

stakeholder

"What does the process actually look like? The site lists features and benefits, but what does the service entail? Is it consultation? Is it a software platform?"

stakeholder

"Who are you talking to? Datacenter providers? AI startups? Small GPU owners who want to sell capacity? Are you just a GPU marketplace?"

stakeholder

"Do you actually sell your own compute, or are you a broker?"

05

What I Changed

February 2026: rebuild on new tooling. Leadership's sovereignty repositioning landed alongside; "The Operating System for Sovereign AI Deployments" was my translation, refined over a good handful of rounds with the CEO. This time design and implementation ran in one loop: I shipped the page myself, and the founding engineers corrected technical claims before launch.

The setup

Claude Code runs inside Cursor with Figma's MCP server attached, so the agent reads the design file and writes frames back into it. CLAUDE.md holds the token tables and usage rules; every design prompt is checked against them before any code is written.

Component library

The Figma file carries a full component library built on a PalmUI base: navigation, heroes, cards, bento grids, buttons, badges, forms, and icons. Every homepage section is assembled from these components, and each component only uses semantic tokens.

Quiet design choices

• Figma tokens propagate to CSS variables via the MCP loop, not by hand
• PalmUI base enforces semantic-token-only usage at the component layer
• Max font weight 500 across the entire marketing surface
• Borders only appear when Figma shows them, never as a code-side default
• cloudrift-landing/CLAUDE.md is the gate that judges every new design prompt

06

Result

Final product

Defensible numbers

• Organic search grew from a few dozen to over 2000 monthly visits in 4 months
• The rebuild shipped in about two weeks; the first attempt took around six
• Design tokens codified in Figma and propagated to CSS variables through a bidirectional MCP loop
• Component library enforces semantic-token-only usage at the component layer
• Shipped at cloudrift.ai with SOC 2 and NVIDIA Inception credibility, named partner logos, and press features
• Adding new sections and elements is now mostly mechanical. The component library, tokenized design conventions, and a trained Claude Code agent do most of the work; cost per addition has dropped substantially since the rebuild

Qualitative

Stakeholder read shifted from "immature startup" to "credible platform." Demo-booking lift is real but inconsistent, so it stays qualitative.

What I didn't measure (and won't fake)

• Demo-booking conversion impact, not isolated from other changes during the same period
• Long-term brand perception shift, no clean measurement available
• Direct attribution of the organic-search lift to the redesign alone; other content and SEO work ran in parallel

07

What I Learned

Smart use of AI tools lets a solo designer operate at team scale, but only when paired with the research discipline that compensates for missing domain assumptions. The reframes below carry that pattern forward.

Carried over to the next system

• Domain knowledge gaps close with research discipline. Asking the engineering team and testing with real users takes longer than domain expertise would, but it avoids building on guesses, especially for a designer new to a vertical.
• AI tools as multiplier require a gate. Without CLAUDE.md (or an equivalent), Claude Code generates whatever feels right, not what the system permits.
• Design-system tooling pays compounding dividends. Cost shifts from per-page implementation to one-time gate setup, and every new section after that is mostly mechanical.
• A design system is only as useful as its gate. Without the token check between prompt and code, the system erodes one pixel value at a time.
• Tokens in Figma and tokens in code need to match by name as well as by value. Name matching is what makes the MCP loop bidirectional rather than one-way.

What I'd do differently

• Compress the gap between first and second attempt. April 2025 taught me what I lacked (system and domain); reaching that lesson would have been faster with a tooling-first frame from the start.
• Codify tokens before designing any page. The first page should test the system, not define it.
• Set up the bidirectional MCP loop as the first deliverable. One-way design-to-code wastes round trips and lets Figma and code drift before either is stable.