The demo: Brinewood Boardworks, a store for a fictional paddleboard workshop

Drag the board, change anything, scroll inside the frame.

Go to the demo
brinewood.exampleConcept · fictional
Brinewood Boardworks, a concept store for a fictional paddleboard workshop: a wooden stand-up paddleboard in a 3D studio view, beside the options for building it (model, deck wood) and a running price with an Add to cart button.

Things to try

  • Build a board

    Change the model, wood, rails, pad and fins. The board reshapes in 3D and the price follows.

  • Engrave it

    Type up to 16 characters and watch them burn into the deck near the tail.

  • Take it apart

    Scroll through How they’re made and the board separates into its layers.

  • Check out

    Add a board or two and go through a three-step demo checkout. Nothing is charged.

If it were yours

What a real shop would get.

Brinewood is invented. These are the parts I’d build for a real one, with your products, your prices and your photos.

  • Product pages search engines can read

    Essentials and up

    Each model on its own page in real text, with prices and structured data, so it can turn up in search.

  • Real payments

    Professional and up

    Checkout handed to a payment provider such as Stripe, so card details never touch your site.

  • A catalogue you can edit

    Professional and up

    Change prices, options and lead times yourself, without calling me.

  • A 3D configurator

    Custom and up

    Your product built from its real dimensions and options, right in the browser, with the price following every change.

  • Cart and checkout

    Custom and up

    Several configured items in one order, shipping or pickup, and a confirmation with a build sheet your workshop can work from.

  • Customer accounts

    Custom and up

    Saved builds and order history for people who come back.

  • Your product, measured

    Shapes, woods and finishes taken from your own workshop, not guessed.

Built with

Next.js · React · three.js · React Three Fiber

The same stack I use for client sites, plus three.js for the 3D. The demo and its 3D engine load only when you reach them, so they don’t slow down the rest of this page.

Kind
Concept · fictional business
Sections
Navigation, the 3D configurator, how the boards are made, the models compared, ordering and care, footer.
Interactive
A board drawn in real time from code (no 3D model files): change the model and it morphs, change the wood and the new grain wipes along it, type an engraving and it burns into the deck. Scroll through how it’s made and it comes apart. A cart, a three-step checkout and a build sheet. None of it is connected to a real payment system, and nothing can be bought.

Want this for your shop?

Your products, your options and your prices, in a store built the same way. It starts with a free mockup of your homepage.