You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
**Note:** You should replace `<version-number-of-bitbybit>` with an actual version number (e.g., `0.20.6`). You can find all the official versions of Bitbybit.dev here:
124
+
**Note:** You should replace `<version-number-of-bitbybit>` with an actual version number (e.g., `0.20.7`). You can find all the official versions of Bitbybit.dev here:
Copy file name to clipboardExpand all lines: docs/learn/3d-bits/faq.md
+4-3Lines changed: 4 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -24,7 +24,7 @@ As 3D Bits makes its way into Shopify stores, we’ve started getting some recur
24
24
**Yes, absolutely!** If you can click buttons and copy-paste, you’re good to go for basic 3D model display.
25
25
26
26
**Here's the simple process:**
27
-
1. Install 3D Bits app, subscribe to Annual Base plan to begin your trial and pin the app.
27
+
1. Install 3D Bits app, subscribe to Base plan to begin your trial and pin the app.
28
28
2. Go to Metafields sections within the app admin page and hit create button.
29
29
3. Upload your 3D models to Shopify via **Content > Files**.
30
30
4. Copy the link to your uploaded 3D model.
@@ -76,7 +76,7 @@ For more complex configurators (e.g., where parts change dynamically beyond pre-
76
76
You have a couple of flexible paths, depending on your needs and your team's skills:
77
77
78
78
-**Want to do it yourself?**
79
-
Our Base plan includes No-Code and Low-Code editors, so you can create 3D product experiences and even basic configurators without writing any code. If you’re comfortable with simple setup steps, you can get started on your own.
79
+
Our plans include No-Code and Low-Code editors, so you can create 3D product experiences and even basic configurators without writing any code. If you’re comfortable with simple setup steps, you can get started on your own.
80
80
81
81
-**Have a developer team?**
82
82
If your developers are comfortable with coding, they’ll get the most out of our Pro plan. It unlocks advanced features and tools designed for building fully custom 3D experiences.
@@ -92,6 +92,7 @@ While you *could* build your own 3D integration from scratch (handling WebGL vie
92
92
93
93
**3D Bits takes care of the essentials:**
94
94
* Simple 3D model embedding.
95
+
* No-Code solutions that your clients will appreciate.
95
96
* Seamless Shopify metafield integration for 3D assets.
96
97
* Easy mapping between product variants and 3D models.
97
98
* The Runner block, which lets you run your own JavaScript/TypeScript to control the 3D scene and respond to store events.
@@ -154,7 +155,7 @@ This is where our **Pro** plan really shines, but you can also use the **BITBYBI
154
155
155
156
### Does 3D Bits offer fancy UI controls for product pages (like custom sliders, color swatches, etc.)?
156
157
157
-
**In general - no. 3D Bits is not here to reinvent the dropdown or the color swatch.**
158
+
**In general - no. 3D Bits is not here to reinvent the dropdown or the color swatch. But we do provide fancy 3D linked UI elements that improve product experience, such as points of interest - when users click on them camera flies to pre-defined position in fluid cinematic motion.**
158
159
159
160
There are many excellent Shopify apps and theme development techniques dedicated to creating sophisticated UI controls for product options. Having said that Pro plan does have the ability to use frameworks such as React, Angular or others to create UI elements. However keep in mind that we do not offer any special technologies to alter the prices. If you need such functionality you'll need to build it yourself.
Copy file name to clipboardExpand all lines: docs/learn/3d-bits/intro.mdx
+51-30Lines changed: 51 additions & 30 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,37 +10,38 @@ tags: [shopify, 3d-bits]
10
10
11
11
## What is 3D Bits?
12
12
13
-
**3D Bits** is a Shopify app that lets you add interactive 3D product configurators and visualizations to your online store. With 3D Bits, your customers can see and customize products in real-time 3D, making shopping more engaging and helping them understand exactly what they’re buying.
13
+
**3D Bits** is a Shopify app that empowers you to add interactive 3D product configurators and visualizations directly to your online store. Imagine your customers exploring and customizing products in real-time 3D – that's the immersive shopping experience 3D Bits delivers, helping them understand exactly what they're buying.
Traditional online stores use static images, but modern shoppers want to see products from every angle and try out different options. 3D Bits makes this possible by letting you build interactive 3D experiences for your products—no advanced coding required.
29
+
Traditional online shopping relies on static images, but today's customers demand more. They want to see products from every angle and visualize different options. 3D Bits makes this possible, allowing you to create dynamic 3D experiences for your products without needing advanced coding skills.
@@ -64,44 +65,64 @@ Traditional online stores use static images, but modern shoppers want to see pro
64
65
65
66
</div>
66
67
67
-
68
68
## How Does 3D Bits Work?
69
69
70
-
3D Bits is built on the [bitbybit.dev](https://bitbybit.dev) platform, which provides powerful 3D and CAD tools for both beginners and professionals. You can:
70
+
3D Bits is powered by the [bitbybit.dev](https://bitbybit.dev) platform, offering robust 3D and CAD tools for all skill levels:
71
+
72
+
***No-Code:** Quickly set up interactive 3D product pages.
73
+
***Low-Code:** Use visual programming for more detailed control.
74
+
***TypeScript:** Write custom code for advanced functionalities.
75
+
***Developer-Friendly:** Integrate with popular 3D engines and professional tools like VSCode.
76
+
77
+
## Our Plans
78
+
79
+
We offer three subscription plans: `Base`, `Standard`, and `Pro`, designed to fit various needs and complexities.
71
80
72
-
- Use **No-Code** configurators to quickly set up 3D product pages.
73
-
- Try **Low-Code** visual programming for more control.
74
-
- Write custom logic with **TypeScript** if you want advanced features.
75
-
- For developers, connect with popular 3D engines and use professional tools like VSCode.
81
+
### Base Plan
76
82
77
-
## Plans
83
+
Ideal for beginner merchants, the Base plan provides No-Code and Low-Code solutions to build dynamic 3D experiences. Whether you're using static 3D assets or implementing more complex parametric designs, this plan simplifies 3D product presentation.
78
84
79
-
Currently, we offer 2 subscription plans: `Basic` and `Pro`.
85
+
* Create interactive 3D scenes with No-Code and Low-Code tools.
86
+
* Write short scripts for custom behaviors.
87
+
* Supports the BabylonJS game engine.
80
88
81
-
### Basic Plan
89
+
### Standard Plan
82
90
83
-
The Basic plan is designed for most merchants and offers a lot of No-Code and Low-Code solutions for building 3D experiences on your Shopify storefront. You can easily configure static and dynamic 3D scenes, and use visual or TypeScript code snippets for extra logic. This plan is ideal if you want to present configurable products in 3D and only need to handle some, but not huge amounts, of logic and complexity. Most technically-minded merchants will find the Basic plan covers common use-cases for 3D product pages.
91
+
The Standard plan expands on the Base features, perfect for merchants seeking enhanced visual effects and dedicated support.
84
92
85
-
- Use No-Code and Low-Code tools to create interactive 3D scenes.
86
-
- Add short scripts for custom behaviors.
87
-
- Built to simplify 3D product presentation, but flexible enough for moderate customization.
88
-
- Supports the BabylonJS game engine.
93
+
* Includes all `Base` plan features.
94
+
* Utilize advanced navigation, such as 3D points of interest in No-Code editors.
95
+
* Benefit from Standard support, including expert consultations to optimize performance.
89
96
90
97
### Pro Plan
91
98
92
-
The Pro plan is for merchants with professional development teams or those who hire programmers. Some 3D experiences can become very complex, and even our Low-Code editors or built-in TypeScript environment may not be enough. If you want to set up projects inside game engines such as ThreeJS, BabylonJS, or PlayCanvas, or if your team wants to host code on their own GitHub repositories, use VSCode, or write unit tests, the Pro plan is for you. We provide access to pre-built Vite TypeScript templates and support for advanced workflows.
99
+
Designed for professional development teams or merchants requiring premium support, the Pro plan offers flexibility and power.
100
+
101
+
* Includes all `Standard` plan features.
102
+
* Build complex 3D experiences with your preferred engine (e.g., ThreeJS, BabylonJS, PlayCanvas).
103
+
* Use your own codebase, GitHub repositories, and professional development tools like VSCode.
104
+
* Access pre-built Vite TypeScript templates for advanced workflows.
105
+
* Receive premium support, including assistance in building your first No-Code configurator.
- Build complex 3D experiences with your choice of engine or framework.
95
-
- Use your own codebase, GitHub, and professional tools.
96
-
- Ideal for custom solutions, advanced logic, or large-scale projects.
97
-
- Access to Vite TypeScript templates and more.
111
+
**By Support Level:**
112
+
***Base:** Self-learners who need guidance to tutorials and documentation.
113
+
***Standard:** Teams looking for expert advice tailored to their product.
114
+
***Pro:** Those who want our direct help in building their first No-Code configurator.
98
115
99
-
**How to choose?**
116
+
**By No-Code Features:**
117
+
***Base:** For products that switch & control static 3D assets based on user options.
118
+
***Standard:** To add beautiful 3D effects that make your products stand out.
100
119
101
-
It depends on your needs and preferences. As a guideline: if your configurators start reaching 5000 lines of code, managing them with simple inline scripts becomes difficult—consider moving to the Pro plan. Also, if you want to use a custom game engine or install different NPM packages, you'll need Pro. The Basic plan is built on BabylonJS; for other technologies, go Pro.
120
+
**By Configurator Complexity:**
121
+
***Base:** For configurators with custom logic that can be handled by low-code visual scripting or short TypeScript programs.
122
+
***Pro:** For complex configurators (e.g., over 5000 lines of TypeScript code), custom game engines, or the need to install different NPM packages.
102
123
103
124
## Why Shopify?
104
125
105
-
Shopify is one of the world’s most popular e-commerce platforms. It’s easy to use, flexible, and has a huge ecosystem of apps and developers. That’s why we chose Shopify as the home for 3D Bits—so you can easily add cutting-edge 3D experiences to your store and stand out from the competition.
126
+
Shopify is a leading e-commerce platform, renowned for its ease of use, flexibility, and vast ecosystem. We chose Shopify for 3D Bits to ensure you can effortlessly integrate cutting-edge 3D experiences, helping your store captivate customers and stand out in the competitive online market.
106
127
107
-
We’re excited to help you create amazing, interactive product pages with 3D Bits!
128
+
We're excited to help you create amazing, interactive product pages with 3D Bits!
Copy file name to clipboardExpand all lines: docs/learn/3d-bits/plans/subscription-plans.md
+80-82Lines changed: 80 additions & 82 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,88 +10,86 @@ tags: [shopify, 3d-bits]
10
10
11
11
## Plan Comparison
12
12
13
-
| Feature | Annual Base | Annual Pro |
14
-
|---------|-------------|------------|
15
-
|**Price**| 142$ yearly | 900$ yearly |
16
-
|**Trial**| 14 days | 21 days |
17
-
|**Target Audience**| Store owners, small teams | Professional development teams |
18
-
|**Setup Complexity**| Easy, no coding required (optional scripting) | Advanced, requires development skills |
19
-
|**Custom Development**| Optional | Mandatory |
20
-
21
-
## Annual Base Plan
22
-
23
-
Perfect for store owners who want to add 3D capabilities to their products without complex development work.
24
-
25
-
### Core 3D Features
26
-
- ✅ Add 3D models to unlimited products
27
-
- ✅ Upload and display 3D files (GLTF format)
28
-
- ✅ Show realistic 3D product scans (Splat format)
29
-
- ✅ Let customers customize products in 3D
30
-
- ✅ Mobile-friendly 3D viewing
31
-
- ✅ Fast loading and smooth performance
32
-
33
-
### Product Configurators
34
-
- ✅ Create simple product configurators without coding
35
-
- ✅ Build configurators with [bitbybit.dev](https://bitbybit.dev) visual programming tools
36
-
- ✅ Build advanced configurators with dedicated [bitbybit.dev](https://bitbybit.dev) TypeScript editor
37
-
- ✅ Create interactive 3D experiences
38
-
- ✅ Add realistic physics to product demos
39
-
- ✅ Design parametric and custom shapes
40
-
41
-
### User Experience
42
-
- ✅ View products in full screen mode
43
-
- ✅ Show loading animations during processing
44
-
- ✅ Connect with pricing and UI apps
45
-
46
-
:::tip Who is this for?
47
-
Annual Base is ideal for merchants who want to enhance their product pages with 3D models and simple configurators without needing a development team.
48
-
:::
49
-
50
-
## Annual Pro Plan
51
-
52
-
Designed for professional development teams who need complete control and advanced customization capabilities.
53
-
54
-
### Everything in Annual Base, Plus:
55
-
56
-
### Professional Development Tools
57
-
- ✅ Develop professional Single Page Applications (SPA) for product pages
58
-
- ✅ Embed SPA apps to product page via Theme App Extension block
59
-
- ✅ Use ThreeJS, BabylonJS, PlayCanvas or other web 3D engines
60
-
- ✅ Write custom Vite based TypeScript apps for 3D & 2D product presentations
61
-
62
-
### Development Workflow
63
-
- ✅ Use the tools & editors that your team loves - VSCode, GitHub, etc.
64
-
- ✅ Ensure quality of your apps via unit tests
65
-
- ✅ Use configured local host development environment
66
-
- ✅ Emulate production environment in preview mode
67
-
- ✅ Easily embed build output via single JavaScript file to product page
68
-
69
-
### Exclusive Access
70
-
- ✅ Access & clone opinionated example templates from our private GitHub repository
71
-
- ✅ Access private `bits-pro` NPM package allowing communication between product page inputs & your app logic
72
-
73
-
:::warning Development Skills Required
74
-
Annual Pro requires technical expertise in JavaScript/TypeScript, 3D web development, and modern web development workflows. This plan is designed for development teams, not end users.
75
-
:::
76
-
77
-
## Getting Started
78
-
79
-
### Annual Base
80
-
1. Subscribe to the plan
81
-
2. Start adding 3D models immediately
82
-
3. Use our visual tools to create configurators
83
-
4. Publish to your store
84
-
85
-
### Annual Pro
86
-
1. Subscribe to the plan
87
-
2.**Wait 24 hours** for access tokens to be sent to your email
88
-
3. Access our private GitHub repository and NPM package
89
-
4. Follow our [BITBYBIT APPS Pro guide](/learn/3d-bits/theme-app-extensions/bitbybit-apps)
90
-
5. Start developing custom 3D applications
91
-
92
-
:::info Access Token Delivery
93
-
Pro plan subscribers will receive access tokens within 24 hours of subscription. If you don't receive them, contact us at [info@bitbybit.dev](mailto:info@bitbybit.dev) and we'll extend your trial period by 3 days.
|**How We Help**| We help mostly by providing links to documentation and tutorials | We actively guide your team by explaining how to set 3D products | We become part of your team and help set up first no-code configurator with your 3D assets |
24
+
25
+
26
+
## Plan Differences Per Shopify Theme App Extension
27
+
28
+
### BITBYBIT VIEWER (No-Code)
29
+
30
+
BITBYBIT VIEWER theme app extension supports building 3D configurators without writing code. It provides advanced editor user friendly editor that helps you load 3D models, configure loading indicators, scene, lights, camera settings and link 3D models or materials to product options.
0 commit comments