3D Assets for Shopify's '3D Bits' App
Learn about the 3D asset formats supported by the "3D Bits" app and how to prepare your models for interactive configurators and static displays on Shopify.
Our Shopify app for adding interactive 3D product visualization to online stores.
View all tagsLearn about the 3D asset formats supported by the "3D Bits" app and how to prepare your models for interactive configurators and static displays on Shopify.
Common questions about 3D Bits: building configurators without code, pricing what shoppers configure, the app embed, and working with your existing theme and apps.
3D Bits is a Shopify app for building interactive 3D product configurators. Design the scene and the options your shoppers pick, set your prices, and publish to your product pages.
Learn how to add 3D models to your scene, including supported formats and hosting requirements.
Reference for the 3D Bits app embed, the two settings that still live in the theme editor, and the ones a published project overrides.
Critical information about how 3D assets are hosted and accessed in 3D Bits, including public accessibility, intellectual property considerations, and best practices for protecting sensitive information.
Your library of 3D models, images and textures, how files get in, and where they actually live.
Learn how to use the BITBYBIT APPS theme app extension block to develop and deploy professional 3D & 2D product presentations on Shopify
Learn about various settings that BITBYBIT APPS theme app extension block provides to develop and run custom TypeScript applications.
Host one area of your configurator's option panel exactly where you want it in your product template.
Learn how to use the BITBYBIT PREVIEW theme app extension block in Shopify's "3D Bits" app to embed publicly available Bitbybit project scripts into your product pages.
Learn about various settings that BITBYBIT PREVIEW theme app extension block provides to embed full bitbybit.dev projects via iframe.
The legacy RUNNER theme block, what it still does for existing setups, and what to build instead.
Settings reference for the deprecated BITBYBIT RUNNER theme app extension block. New configurators are built in Composer instead.
Place a published project's 3D view in an exact spot in your product template, and the older by-hand metafield route it grew out of.
Learn about various settings that BITBYBIT VIEWER theme app extension block provides to configure the 3D canvas, models and environment configuration.
How tall the 3D view is, how wide it goes and where the options panel sits, set per project from Storefront settings.
The summary card 3D Bits draws under each configured line on the cart page, and how to make it match your theme.
Change materials, colors, and textures of your 3D products on Shopify with 3D Bits app - in 41 minutes you’ll learn everything you need to know!
Learn the four ways 3D Bits turns a configured price into a real Shopify charge, and how to choose between them.
The settings shared across the 3D Bits app embed and theme blocks, what each one does, and which of them your published project overrides.
Composer is the visual editor where you build a 3D Bits configurator. No code, and everything about a configurator lives in one place.
Learn how 3D Bits builds a price from the options a shopper picks and charges it through Shopify at checkout.
Learn how to think like a game designer when creating 3D product configurators for Shopify using the "3D Bits" app.
A video tutorial explaining the key settings of the "3D Bits" Shopify app, including how to position the 3D canvas on your product page and other relevant configurations.
The dropdowns, swatches, sliders and fields your shoppers use to configure your product.
A video tutorial demonstrating how to create a basic 3D configurable product (a cube) on Shopify that responds to product variant inputs using the "3D Bits" app.
Measurement annotations drawn on the model itself, from fixed dimension lines to a bounding box that re-measures as the configuration changes.
The contract between your own product form and 3D Bits - what each element reports, how a change is noticed, and how field names become keys.
What the editor shows you, what only Play shows you, and how to preview each kind of behaviour while you are still authoring.
Turn the 3D Bits app embed on once, and every product you publish shows its configurator automatically.
What each section of the 3D Bits app in your Shopify admin is for.
Merchants often have product files created for manufacturing in professional CAD software such as FreeCAD, Fusion 360, CATIA, SolidWorks, Rhino, and others. But preparing these precise CAD models for web configurators is not straightforward.
Learn what to test before selling a configured product, how to sell in several currencies, and how to review configured orders.
The CAD converter, the 3D inspector, and the metafields page you need once at the very end.
What happens on your product page, the two ways to drive a configurator, and how to keep it working when your theme or apps change.
How many parts and priced options a configurator can carry, which choices are cheap and which are expensive, and what to do when publishing is refused for being too complex.
Learn how to install the 3D Bits app for Shopify on your store and confirm that the installation was successful.
Arranging your controls into sections, tabs and accordions, and placing parts of the panel elsewhere on the product page.
Learn how to charge an option through the real products you already sell, link several of them to one choice, and keep the links healthy when prices change.
Rules that connect choices to each other, so the configurator only ever offers combinations you can actually make.
What Composer's Logic rules still do when 3D Bits draws no option panel and every choice comes from your theme or another app.
The original per-product setup, kept for stores that already use it.
Every setting on a model - transforms, transform variants, glTF nodes, material variants, materials, textures, animations and instancing.
The three file size limits in 3D Bits - Composer's warning bands, the iPhone Safari block on the storefront, and the upload cap - and exactly what each one does.
Markers your shopper can click to see a detail, and camera moves that fire when they choose an option.
Learn how to create interactive 3D product configurators on Shopify using 3D scanned Gaussian Splatting (.splat) assets and Composer, all without writing any code.
Learn how to create interactive 3D product configurators on Shopify using GLTF assets and Composer, all without writing any code.
See exactly what each shopper configured, and confirm the price on the order is right.
Learn how to pack multiple product variants into a single glTF file and use it with the 3D Bits app for Shopify. Discover features for parsing 3D nodes from Blender and auto-setting up the GUI from your product page.
List what the configured product is made of, charge for the pieces you ship, and record the ones you only need on the works order.
A summary your shopper can download, and a production document attached to the order.
Putting a shopper's own text or image onto the product itself, printed or engraved on the surface.
Learn about the best practices and solutions when preparing 3D GLTF assets for your 3D configurators.
The Pricing tab in Composer - the base price, formulas, the floor your product's own price sets, and where to read about charging properly.
Creating configurators, linking them to products, publishing, and reading the warnings the project page raises.
Why talking to us improves your 3D product experience, what support your plan includes, and where to find us.
The difference between saving, publishing and exporting a file, and why they are three separate things.
Camera, lighting, background, canvas frame, skybox, the loading screen and parameter bindings. Everything around the product rather than the product itself.
Linking a parametric program into a project, for products whose shape has to be calculated.
Parametric programs that calculate geometry, how they connect to your configurators, and why one cannot be deleted while a project uses it.
Learn how configured prices behave in Shopify Markets, which markets can be priced exactly, and what to publish again after changing your Markets setup.
Learn how to turn on configurator pricing, set a base price, price your first option, preview it and publish.
A step-by-step video tutorial on installing the "3D Bits" Shopify app, approving subscriptions, creating metafields, setting up product templates, and linking the BITBYBIT RUNNER block.
The Settings tab - an image of the configured product attached to the order, and a link that reopens the exact configuration.
Add interactive 3D product viewers and configurators to your Shopify store with the 3D Bits app.
Switching 3D on for your store, checking whether it is actually on, and what to clear up before uninstalling.
Making the option panel look like your store, in light and in dark, and offering it in the languages you sell in.
Your current plan, what your storefront has been told about it, and what to do when the two disagree.
The three 3D Bits plans, what each one includes, and how to work out which one your products need.
Complete reference for supported 3D file formats, their features, and when to use each.
Check that your configurator charges the right amounts on your real product page, without creating helper products in your Shopify catalogue.
How Composer is laid out, what edit mode and Play mode do, what the buttons along the bottom are for, and which bar is telling you something is wrong.
Learn what the 3D Bits Fee products in your catalogue are for, and the rules for living with them safely.
When to use the app embed, when to place theme blocks yourself, and what each 3D Bits block does.
Learn what to do when a shopper cannot check out a configured product, or a publish is refused.
Learn to create a 3D laptop holder configurator for Shopify using TypeScript on Bitbybit, driven by multiple product variants and integrated with the "3D Bits" app.
Learn to build an advanced 3D palm table configurator for Shopify, combining 3D scans, parametric CAD models, product variants, and custom Liquid UI elements with "3D Bits".
Learn to create a Shopify product that allows shoppers to customize 3D text using product variants (for font) and custom Liquid line item inputs (for text content and height) with "3D Bits".
Learn how to 3D scan a bike, process the scan, upload it to Shopify, and display it as an interactive 3D product using the "3D Bits" app.
Learn how to use the BITBYBIT PREVIEW block in Shopify's "3D Bits" app to embed a Bitbybit project featuring a 3D scanned product onto your e-commerce store.
Learn how to use the BITBYBIT VIEWER block in Shopify's "3D Bits" app to display a 3D scanned product (Gaussian Splatting model) on your e-commerce store.
Get started with the "3D Bits" Shopify app through our series of video tutorials, covering installation, setup, 3D model linking, and custom model creation.
The seven ways a 3D scene can change in response to what your shopper picks, and which panel each one lives in.
How long a first configurator takes, what the 3D model needs to be like, and where the real effort goes.
The handful of things that go wrong in Composer, and what each one actually means.
3D Bits builds your option panel and prices it. Here is when a separate product options app still makes sense, and how to run one alongside.
Every reason 3D Bits refuses to publish a project, and what to change to clear it.
Take one product from a 3D file to a live configurator on your storefront, start to finish.