How we plan and build a card website
Our five-stage studio process moves from initial brand sitemap architecture to bespoke Swiss UI/UX typography, lightweight CMS assembly, and foundational launch SEO.
Disciplined engineering without endless agency revisions
Bloated design sprints and vague moodboards have no place in our studio practice. Clients work directly with Alexey Smirnov across five concrete stages with defined deliverables, fixed timelines, and verified sign-off checkpoints.
| Stage Number & Title | Core Deliverables | Equipment & Tools | Typical Timeline |
|---|---|---|---|
| Stage 01: Strategy & Sitemap | Card hierarchy, inquiry route, item inventory | Brand strategy, card sitemap | Days 1–5 |
| Stage 02: Typographic UI/UX | Modular Swiss grid, font pairing, proofs | UI/UX design, Archivo and Syne | Weeks 2–3 |
| Stage 03: Content & Media | Botanical specs, harvest data, macro imagery | Content volume prep, WebP rungs | Weeks 3–4 |
| Stage 04: CMS & Front-End | Zero-bloat HTML/CSS, headless collections | CMS assembly, adaptive layout | Weeks 4–6 |
| Stage 05: SEO & Launch | JSON-LD, server caching, analytics storage | Base launch SEO, submit handler | Launch Week |
Stage 01: Product strategy & sitemap
Before a single pixel is arranged, we establish the editorial narrative: what is made, where ingredients originate, and how wholesale accounts place orders.
Cutting superfluous pages down to essential cards
Most natural makers arrive with bloated website drafts: an “About Us” page that wanders for six paragraphs without mentioning product origins, an empty blog tab, and three dead social feeds. We prune these ruthlessly.
The inquiry pipeline establishes clear ordering intent: retail availability, seasonal reserve allocations, or wholesale stocking case packs. Every section on the card receives an explicit commercial purpose.
Stage 02: Typographic UI/UX on Swiss grids
Layouts follow an architectural structure using strict column rules, zero border radius, and calibrated grotesque type pairings.
Calibrating Archivo, Space Mono, and Syne
Generic templates rely on interchangeable rounded cards and generic pastel fills. Our studio adheres to Swiss International design discipline: objective editorial structure, flush-left ragged-right typography, and disciplined optical rhythm.
Every layout is tested from 320px mobile screens up to 1920px studio monitors. Display headlines never wrap awkwardly, and touch targets are guaranteed at 44px minimum without sacrificing dense editorial character.
“A brand card does not demand attention through volume. It commands authority through exact typographic measure and quiet craft.”
Stage 03: Content & packaging asset prep
Natural product brands live and die by sensory honesty. We format macro photography, batch harvest notes, and ingredient tables with microscopic precision.
Editorial photography without digital mockups
We strictly ban floating laptop frames, 3D bottle renders, and generic stock photography. Physical goods are photographed on slate slabs, unfinished pine, or drafting linoleum under cool north daylight.
Copy is edited to eliminate empty corporate claims. General phrases are replaced by verified trade numbers: proof degrees, extraction hours, cure durations, and case counts.
Stage 04: Headless CMS & adaptive markup
Clean, hand-coded static HTML, CSS, and lightweight CMS endpoints free clients from brittle third-party plugins.
Sub-second page rendering and resilient forms
A card website loads in under 700 milliseconds because it carries zero unnecessary client-side framework libraries. Every form posts directly to a battle-tested server endpoint with honeypots and timestamp tokens.
Makers can easily update bottle availability, announce seasonal harvest drops, or adjust wholesale pricing without touching raw HTML or risking layout breakdown.
Stage 05: Launch SEO & ad platform compliance
Every card website ships with comprehensive structured data, Consent Mode v2, and explicit paid ad platform parameter handling.
Complete JSON-LD graphs and privacy adherence
Search engines understand exactly what your brand produces through explicit JSON-LD Organization, LocalBusiness, BreadcrumbList, and Product schemas. Nothing is left to automated scraping guesswork.
We perform a final live audit on Denver studio networks before handing over primary domain DNS records and server credentials.
Initiate a five-stage project sprint
Schedule your initial Stage 01 consultation directly with Alexey Smirnov. Fixed scope between $3,500 and $8,000 USD based strictly on pages, content volume, and speed.