3D product viewer or configurator
Visitors rotate a product, change colours and materials, see the price and add it to the cart.
Concept demo · Nord & OakNord & Oak is made up. The demo is live and runs in your browser.
What you get
What is included.
This is for online stores that sell products people want to see from every angle and in their own colour: furniture, bags, bikes, anything with options. Photos show one angle in one colour. A configurator lets customers see what they are actually buying.
We build with three.js, so it runs in the browser and on phones, with nothing to install, and we connect it to your store’s real variants.
- A 3D viewer to rotate and zoom your product
- Swatches that switch colours, fabrics, finishes and parts
- Live price updates for each option
- Add to cart with the chosen options
- Embeds for Shopify, WordPress, Webflow or a custom site
- Model cleanup and compression, so the page stays fast
What we did before
Our own demo, live in your browser.
Nord & Oak is a concept product page we built for a fictional furniture store. Customers turn an armchair around, switch between six fabrics and three leg finishes, watch the price update and add their choice to the cart. It is concept work: the store, prices and cart are made up, and the demo is live so you can try it. We have no client project to show for this service yet.
How it works
Four steps, in plain terms.
01
You send your product and your store link
And what customers should be able to change.
02
We check your 3D files
Or tell you the best way to get a model.
03
We prepare the model first
Split into the parts that change, and you see the viewer in the browser early.
04
We add options, price and cart, then hand over
Embedded on your product page and tested on phones.
FAQ
Common questions.
I do not have a 3D model. Can you still help?
Yes. You can bring one from a 3D artist, use a free licensed model, or send an AI-generated one that we clean up. If you only have photos, we tell you the best option.
Will it work on my Shopify store?
Yes. We add it to your product page as a section or app block, and the chosen options can go into the cart as a variant or line item properties.
Will it slow down my product page?
No. We compress the model and textures, and the viewer loads after the rest of the page. We test on a normal phone, not only a fast laptop.
Can the price change with the options?
Yes. Each option can add to the price, and the total updates live. In your store, we match it to your real variants so checkout shows the same price.
How many options can it have?
As many as make sense for your product. More options mean more model and texture work. Most products work well with a handful of colours or materials per part.
Do you use React Three Fiber?
We can. We use plain three.js, React Three Fiber or Svelte, whichever fits your site best.
Ready to start?
Order on the platform you already use, or write to us first. Tell us what you need and we will say what is realistic.
Or message us directly at support@srwebstudio.com
Related services
Interactive 3D website or landing page
3D objects that react to the mouse, scroll effects and animation, built with three.js and GSAP.
See the service
Interactive 3D exploded view
A product that breaks into parts, with labels, details and scroll-driven motion.
See the service