zsty.us

Before / After · Case Study

Porto Verde — a parked domain to a procurement-grade cannabis-lab site, in one build

  • Hemp / CBD

Porto Verde is a licensed Long Beach cannabis & hemp micro-processor — extraction, co-pack, and branding for other people's brands. It had a registered domain and a real lab, and nothing online: no brand, no services, no way for a brand to reach them. This was a greenfield build, not a rebuild — a from-scratch Next.js 15 site with an industrial-premium design system, nine in-house service pages plus equipment / compliance / packaging / facility / about, a 100 MB browser-direct artwork-intake pipeline, and lead email wired straight into the owner's own self-hosted mail server. Built loud and honest: every unverifiable number — throughput, MOQ, the DCC license — ships as a visible TBC instead of an invented fact.

You own the brand. We run the line. — a co-packer's site that says exactly what it is, and marks everything it can't yet prove.
🔒portoverdelab.com
jackiej.events — modern site

Receipts — measured

Numbers that moved.

0
Routes shipped (from an empty repo)
was 0
0
In-house service detail pages
was 0
0 MB
Max artwork upload, browser → bucket
was 0 MB
1
Third-party email / data vendors in the lead path
was 1
0
Co-pack & extraction formats offered
was 0
0
Max files per artwork submission
was 0
  • 0 pages → 21 routes shipped in one build (11 core pages + 9 service detail pages + 404)
  • 100 MB browser-direct artwork uploads (presigned to object storage, past Vercel's 4.5 MB function cap)
  • Lead email runs on the owner's own self-hosted Stalwart server — zero third-party email vendor
  • Honest engine: DCC license + throughput/MOQ ship as visible TBC, never invented

The pixel diff

Overview, then the walkthrough.

Left: everything the legacy site shipped — frozen in place. Right: an auto-scrolling tour of the rebuild, from hero to booking. No slider to fight with.

Before — the overview
🔒portaverdelab.com · parked
Before — the overview

This is everything the legacy site had to offer above the fold. No pricing, no calendar, no booking — the funnel ended at a mailto.

After — scroll through what shipped
🔒portoverdelab.com
After — scroll through what shipped

Auto-scrolls through the modern site so you can see the booking surface, the package grid, the pricing table, and the calendar inline — without leaving this page.

Tap a pin. The story is in the pixels.

Before — what was broken
🔒portaverdelab.com · parked
Before
After — what shipped
🔒portoverdelab.com
After

The four beats

Problem · Insight · Build · Outcome.

Scroll past the legacy frame. The four beats land in order. At the end, the modern site fades into the same window.

🔒portaverdelab.com · parked
Legacy
01 · Problem

A licensed lab with a real floor — and no way for a brand to find it.

Porto Verde extracts distillate, live resin, and diamonds and co-packs pre-rolls, gummies, and carts for other people's brands. It had the equipment, the license, and a registered domain — and zero web presence. In a saturated 2026 California market, a co-packer that can't be found, can't show its capabilities, and can't take a brand's artwork is invisible to exactly the buyers it needs.

02 · Insight

A B2B manufacturer needs a procurement surface, not a dispensary microsite.

Brand owners and their ops teams want to see the services, the equipment, the compliance posture, and how to hand over artwork — fast. The build is organized around that: nine service pages, an equipment page grounded in the real machines on the floor, a compliance page, and a quote flow that takes 100 MB of print-ready files. The voice is industrial-premium and exact: "you own the brand, we run the line" — a processor that never competes with the brands it serves.

03 · Build

Empty repo to live in production — design system, 21 routes, real intake, in one build.

From-scratch design system → home + nine service detail pages + equipment / packaging / compliance / facility / brands / about → a 100 MB browser-direct artwork-intake pipeline (presigned PUT to a Railway bucket, leads to Postgres) → lead email wired to the owner's self-hosted Stalwart server with MX/SPF/DMARC provisioned in Cloudflare → full SEO + OG + JSON-LD + 21+ gate + Prop 65. Real facility photography was processed and placed; an unusable low-res walkthrough clip was flagged for a reshoot rather than shipped pixelated.

04 · Honest engine

Ship loud — and mark everything you can't prove.

The whole build runs on an honest-engine rule: never invent a number or a credential. Adversarial verifier agents stripped a fabricated equipment feature before launch. Throughput, MOQ, and fill-tolerance specs render with a visible TBC chip. The DCC license number stays a placeholder — an authoritative DCC search found no record under the brand name or the 646 W PCH address, so the licensing entity is surfaced to the owner to confirm, never guessed.

05 · Pending

What's honestly still open — surfaced, not hidden.

The DCC license number ships as a visible "TBC — pending partner confirmation" until the owner confirms the licensing entity; throughput, MOQ, and fill-tolerance specs carry the same TBC chip. The /about page exists but isn't yet wired into the nav or sitemap, and the facility walkthrough clip was left out rather than shipped at an unusable low resolution. Every gap is on the page as a marker — the honest engine applies to the roadmap too.

06 · Outcome

Live on portoverdelab.com — and brand inquiries land in the owner's own inbox.

The site is in production on its own domain. A brand can read the capabilities, walk the (photographed) floor, and submit a quote with 100 MB of artwork; the lead is stored in Postgres and emailed into the owner's self-hosted portoverdelab.com inbox, reply-to set to the brand — no Resend, no third-party email or data vendor anywhere in the path.

🔒portoverdelab.com
Modern

Architecture

One chain replaced by another. Receipts above.

Old stack
  • No site
  • Parked domain
  • Text / DM inquiries
  • No services surface
  • No artwork intake
New stack
  • Next.js 15 + React 19
  • Tailwind v4 + framer-motion
  • Railway Postgres + S3 bucket
  • 100 MB presigned uploads
  • Self-hosted Stalwart SMTP
  • next/og + JSON-LD
  • Vercel + Cloudflare DNS

What changed

Grouped by what kind of system shipped.

Each claim ships with concrete evidence — env vars, table names, cadence chips. No marketing fluff.

Design

Greenfield design system — pharma manufacturer × craft cannabis, not dispensary kitsch

From an empty repo: a dark industrial-premium system (deep-green / brass-gold / near-black, Space Grotesk + IBM Plex Mono), a single confident facility hero, and nine in-house service detail pages — distillate, live resin, THCA diamonds, THCa, plus pre-roll / infused-preroll / snow-cap / gummy / vape co-pack — each tied to a real photo from the Long Beach floor. The positioning is exact: a micro-processor that doesn't cultivate or sell its own flower, framed sitewide as "you own the brand, we run the line."

Before
No brand, no services list, no facility imagery — a licensed lab that was invisible online.
After
21 routes, 9 service pages, real floor photography, and a procurement-grade capabilities surface.
Agent backbone

100 MB artwork intake — browser → object storage, around Vercel's body cap

Brands upload print-ready artwork (PDF / AI / PSD / EPS up to 100 MB) with their quote. A Vercel function can't accept a 100 MB body (4.5 MB cap), so the browser requests a presigned PUT and uploads straight to a Railway S3-compatible bucket; only the object keys come back through the API, which writes the lead to Postgres and emails download links. No file ever passes through the serverless function.

  • POST /api/uploads/presign → per-file presigned PUT (10-min TTL, type + size validated)
  • Browser PUTs directly to the bucket with XHR progress bars
  • POST /api/contact persists the lead to Railway Postgres + emails 7-day presigned download links
Real-time push

Lead email on the owner's own mail server — zero third-party vendor

Instead of Resend or SendGrid, the contact form submits over SMTP to the owner's self-hosted Stalwart server (mail.oglife.app:465), authenticating as a real portoverdelab.com mailbox and delivering locally into the lab's own portoverdelab.com inbox. Four mailboxes (info / accounts / sales / no-reply) were provisioned on Stalwart with MX + SPF + DMARC in Cloudflare, so brand inquiries land in the owner's own inbox with no SaaS in the path.

  • nodemailer SMTP submission (465 implicit TLS) → Stalwart local delivery
  • Reply-To set to the submitting brand so replies go straight back to them
  • MX → mail.oglife.app + SPF (v=spf1 mx include:amazonses.com) published in Cloudflare
Retention

Honest engine — built by adversarial agents that strip invented facts

The build ran through multi-agent passes where a verifier adversarially checks every factual claim. It caught and removed a fabricated equipment capability a drafting agent had invented (a non-existent CTM "scan-and-eject" feature) before it reached production. Every number the lab hasn't confirmed — throughput, MOQ, fill tolerance — renders with a visible "TBC" marker, and the DCC license stays a placeholder: an authoritative DCC search returned no record under the name or address, so the license entity is flagged for the owner, never invented.

  • Verifier removed a fabricated CTM scan-and-eject spec from the title + body
  • Throughput / MOQ / potency render with an inline TBC chip until confirmed
  • DCC license # left as a placeholder pending the real licensing entity
Agent backbone

Full launch surface — SEO, OG, structured data, age gate, Prop 65

Complete Next.js metadata: robots.ts, a sitemap enumerating all routes, a dynamic /opengraph-image (next/og) brand card + generated favicon, LocalBusiness JSON-LD, and a Twitter card. Compliance is built in: a 21+ age gate, Prop 65 warnings by product format, and METRC / C1D1 / COA trust signals — without claiming a certification the lab doesn't hold (GMP/ISO are framed as "pursuing").

  • robots.ts + a sitemap enumerating all 19 public routes
  • Dynamic 1200×630 next/og share card + generated favicon, rendered at the edge
  • LocalBusiness JSON-LD + Twitter summary_large_image card on every page
  • 21+ age gate with 30-day localStorage + cookie persistence
  • Prop 65 warnings by product format; METRC / C1D1 / COA signals with GMP & ISO honestly framed as "pursuing"
Agent backbone

A facility gallery that maintains itself

The facility page reads /public/facility at build time — drop a new floor photo into the folder and it ships in the next build, captioned and ordered by a small metadata map, with the hero poster auto-excluded. No CMS, no code edit. Images render as a responsive CSS-column masonry with a click-to-open lightbox, next to a lazy-loaded Google Map of the Long Beach floor.

  • lib/facility.ts scans /public/facility at build, applies a caption + order map, excludes the hero poster
  • Gallery.tsx: CSS-column masonry (1 / 2 / 3-up) with a click-to-open lightbox + captions
  • Drop a file in the folder → it appears on the next deploy, no code change

While she sleeps.

Autonomous surfaces

The agent backbone keeps the brand earning between gigs. Jackie approves; the system runs.

  • Captures brand inquiries 24/7 into the owner's self-hosted inbox

    on each submission

    Every quote submission — including up to 100 MB of artwork — is persisted to Railway Postgres and emailed into the owner's own Stalwart portoverdelab.com inbox with the brand set as Reply-To. No third-party email provider is in the path; the lab replies straight from its own mail server.

  • Serves a dynamic share card + structured data on every link unfurl

    on every unfurl / crawl

    next/og renders a 1200×630 brand-gradient OG image at the edge and the layout emits LocalBusiness JSON-LD, so every shared link and crawler sees a branded card and machine-readable business data without a static asset to maintain.

  • Screens spam and records lead provenance on every submission

    on each submission

    The quote API drops bot submissions via a hidden honeypot field, then persists each real lead to Postgres with a JSONB artwork manifest and request provenance (IP, referer, user-agent). The leads table migrates its own schema on first write — no manual migration step.

  • Expires artwork links on a fixed lifecycle

    per upload / per email

    Upload URLs are presigned for 10 minutes; the download links emailed to the lab expire after 7 days — so print-ready brand files are never left publicly reachable indefinitely.

← All rebuilds

Porto Verde — a parked domain to a procurement-grade cannabis-lab site, in one build — zsty.us