ALPHA LABZ
Service 04

3D Stores

Immersive storefronts and 3D product configurators that let customers explore products from every angle, on desktop and phone.

The stack

The tools behind 3D Stores.

The platforms we connect to, and the developer tools we build with. We pick what fits your project and document all of it.

Stores & 3D

ShopifyShopifyThree.jsThree.jsBlenderBlenderWooCommerceWooCommerceStripeStripeWebflowWebflowFramerFramerShopifyShopifyThree.jsThree.jsBlenderBlenderWooCommerceWooCommerceStripeStripeWebflowWebflowFramerFramer

Developer tools

ReactReactTypeScriptTypeScriptViteViteNext.jsNext.jsTailwind CSSTailwind CSSNode.jsNode.jsGitHubGitHubVercelVercelReactReactTypeScriptTypeScriptViteViteNext.jsNext.jsTailwind CSSTailwind CSSNode.jsNode.jsGitHubGitHubVercelVercel
Signature · 3D configurator

Spin it. Restyle it.

A real-time 3D configurator running in your browser. Pick a colourway or open the anatomy view.

Loading 3D model…

Colourway

Model © Shopify · CC BY 4.0

Watch it work

Customers spin it, style it, buy it.

Watch a shopper explore a product in 3D, change its colour and material, and check out, all on one page.

See the Forma concept →
Example · Product page
1/3
How it works

How a 3D store works.

Real-time 3D on the front, your existing store and checkout behind it.

01 · Trigger02 · Context03 · AI step04 · ActionsShopperphone · desktop✓3D storefrontNext.js + Three.js✓3D modelscompressed GLB✓Configuratorcolours · parts✓Fallbacksimages · AR✓Shopifyproducts · cart✓Checkoutsecure✓
Now running

Shopify

Products, inventory and cart stay in Shopify.

Run log · exampledone ✓

  • ●TriggerShopper
  • ●Context3D storefront
  • ●AI step3D models · Configurator · Fallbacks
  • ●ActionsShopify · Checkout
Under the hood

What happens when a page opens.

Fast first view, full 3D a moment later.

Example

A shopper opens the sneaker page on a phone.

Image shown instantly, 3D model ready in about a second, configurator and Shopify cart connected.

Total time

0.00s

  1. PosterStatic image shown first—
  2. ModelCompressed GLB streamed—
  3. LightingStudio environment applied—
  4. OptionsVariants loaded from Shopify—
  5. ReadyRotate, zoom, configure—
What we build

What we build for stores.

Scroll through the 3D pieces brands ask us for.

01/ 04

3D product viewer

Rotate and zoom any product, on any device.

ViewerLive
  • ✓Drag to rotate
  • ✓Pinch to zoom
  • ✓Loads in ~1s

Example

02/ 04

Configurator

Colours, materials and parts, priced live.

ConfigureLive
  • ✓Upper: Suede
  • ✓Sole: Lime
  • ✓Price: 129

Example

03/ 04

Animated storefront

A scroll-driven brand story with 3D.

Home pageLive
  • ✓Hero product spins in
  • ✓Story on scroll
  • ✓Shop the look

Example

04/ 04

Headless Shopify

Your store's checkout with a custom front end.

ShopifyLive
  • ✓Products synced
  • ✓Cart + checkout
  • ✓Orders as usual

Example

Industries

Built for how you work.

Connects to your tools

Plugs into your store.

Keep Shopify for products, stock and checkout. We add the 3D experience on top.

Fast on phones

Compressed models and image fallbacks.

Live pricing

Options update the price instantly.

Shopify checkout

Orders, stock and payments as usual.

AR ready

View in your room on supported phones.

ShopifyThree.jsBlenderNext.js
StripeKlaviyoVercelWooCommerceCloudinaryGA4
3D store
Build · Launch · Improve

How we deliver your 3D store.

Models and design

  • ✓Collect or create 3D models
  • ✓Design the product page
  • ✓Prototype one product in a week

AssetsExample

  • Sneaker model1.4 MB
  • Materials6
  • Poster imagesdone
  • AR filenext
What you getHandover pack · 3D Stores
  • ✓Full source code in your accounts
  • ✓Tests and documentation
  • ✓Deployment to your hosting
  • ✓Handover call and video walkthrough
  • ✓30 days of fixes and tweaks

Yours from day one

Code · Docs · Accounts · Data

Built with
ShopifyThree.jsBlenderWooCommerceStripeWebflowFramerUnityFigma

We choose tools that fit your project and your team, and document everything so anyone can maintain it later.

Studio work

Related concept

Our own product in this area, built the same way we'd build yours.

FAQ

3D Stores: common questions.

1Will it be slow?+

Models are compressed and load progressively; phones get a lighter version.

2Do we need 3D models?+

If you have them we use them; if not, we can source or create them as part of the scope.

3Does it work with Shopify?+

Yes. Products, cart and checkout stay in Shopify.

Booking our first projects

Got an idea? Let’s build the first version.

Startup, shop or software team: tell us what you want to build. You get a working prototype in about a week, and pricing is agreed on the call.

NDASigned on request
IPYou own the code
7dFirst prototype

What do you want to build?

Describe it in a sentence. A founder reads every message.

Enter to send