Tips and Tricks for Vibe Coding Websites

Boxmining's boxmining.com went from a 2016-era WordPress site costing ~$200/month to an Astro build produced in 24 hours using two AI-generated design docs and ~800 million tokens of inference.

Stack and cost baseline

The old site ran on WordPress and was "super expensive to run — almost around 200 US dollars per month" because of size, link count, and traffic. The stack is now Astro ("the code is actually relatively clean"), which the creator says is easy for agents to navigate. Boxmining's archive goes back to 2016 with 1,000+ articles.

Two docs before any code

The whole workflow is "get two documents, send that to AI, let it do its work." The creator screenshotted the existing site, told Claude what he disliked ("too AI," "not friendly," "stuck in the past"), and asked it to produce branding guidelines — Claude returned an HTML kit with color palette, fonts, and mock-ups. The second doc was an image guideline built with Opus, keyed to the site's topic categories. He calls these the two "professional guidelines" that tuned the rest of the output.

Model split: smart designer, cheap labor

For the design phase he used Claude ("Claude already blew through half of its usage credits" just on the planning) and Opus for the image guide. Implementation went to MiniMax-M3 inside the Claude Code harness: "you can basically get the MiniMax cost, but with like, you know, almost Claude code intelligence." He explicitly recommends "use the highest intelligence for design, and then you can hire your Chinese laborers." He warns that GLM 4.x produces bad-looking sites; GLM 5.1 and 5.2 are fine.

Token bill and what it saved

Total spend: "almost 800 million tokens" in roughly a day, requiring an upgrade to the Max plan plus extra API credits. He contrasts this with prior human spend — "we hired external consultants for branding before, and that cost us like… five thousand dollars" — and frames the AI pass as cheap by comparison, though tokens are "not cheap." He calls the result "M3 was 100% good enough for this," with ~$200/mo of WordPress hosting gone. A Higgsfield/Claude Code Design pass is teased for part two for pixel-level tuning.

What actually moved the needle

Three things: the branding guideline doc, the image guideline doc, and forcing one-to-one layout match ("match it one-to-one the theme, the style"). The first M3 pass kept old components and produced a "reskin"; explicit match-the-layout prompts fixed it. The site's color-coded topic categories and pastel/friendly direction came directly from referencing the Claude.ai look — "I like the Claude website, you know, it's like friendly… the kind of like wavy lines, like the pastel colors."