Скачать или смотреть How To Make Parametric 3D Product Configurator Of Table With Plant 3D Scan Using Shopify 3D Bits App

3D Bits on Shopify app store
https://apps.shopify.com/3d-bits-1

In this tutorial, you'll learn how to set up a 3D table configurator on your Shopify store using the 3D Bits app. Matas Ubarevicius will guide you through the process, showing you how to create variants and add custom Liquid code for line items. This will let you control various aspects of the 3D model, such as the table's height and leg thickness, using easy-to-use sliders.

We'll also include a 3D scan of a plant in the middle of the table, created using a special technique called Gaussian splatting. By the end of this tutorial, you'll know how to handle more complex designs and showcase them on your Shopify store's 3D product page.

You'll be able to use these skills in other 3D projects on Shopify as well. Throughout the tutorial, we'll use the BITBYBIT RUNNER theme app extension to link the input controls with the 3D model, using the BabylonJS game engine and OpenCascade algorithms.

Read more about the app
https://bitbybit.dev/blog/3d-bits-app...

Tutorial page
https://bitbybit.dev/start/shopify/tu...

#shopify #app #3dbits #3d #table #3dtable #palm #3dpalm #liquid #customliquid #userinterface #UI #userexperience #ux #lineitems #ecommerce #tutorial #lecture #lesson #course #onlinecourse #settings #configuration #options #monetisation #sales #optimization #performance #gettingstarted #beginner #beginnerfriendly #introduction #setup #installation #howto #cad #application #3dscan #shopifyapp #3dshopify #shopify3d #3dscanning #3dprint #3dprinting #gaussiansplatting #3dgs #gltf #shopifystore #3dmerchandise #3dgoods #3dproduce #produce #goods #3dstock #stock #3dcommodity #commodity #javascript #typescript #blockly #rete #bitbybitdev #parametricdesign #computationaldesign #babylonjs #opencascade #occt #havok #physics #physicsengine #gameengine #jscad #computeraideddesign #shop #store #3dsoftware #software #webapp #3dassets #parametric #procedural #3dproduct #3dproducts #shopifydeveloper #merchants #customers #customization #3dconfigurator #3ddesign #design #webgl #webgpu #variants #adaptable #algorithmicdesign #gamedev #interactive #reactive #3dmodeling #webxr #immersive #immersiveexperience #playcanvas #supersplat #splat #mtb #bike #3dbikegame #canvas #htmlcanvas #canvaselement

00:00 Showing example product on 3D Bits demo store that we will be putting on your Shopify store
00:20 Explaining 3D table variants that we will create and custom Liquid line items to control height and thickness of the legs
01:15 Cart functionality of line items is explained by showing that only variants affect pricing in Shopify
02:20 Create a new product for parametric design of a 3D table
02:40 Add variants for numbers of legs to the Shopify product configuration page
03:05 Set up pricing information and availability for variants by indicating how much each variant will cost to the customer and how many items merchant has in stock
03:40 Apply the 3d-bits-app template to the product
03:45 Add Custom Liquid block on the Product information section in the template
04:45 Copy Custom Liquid code from tutorial page to the Shopify admin, this will make your metafield containing custom UI elements work correctly with Shopify product page section id
05:25 Add new definition of the metafield for line items and use custom.liquid-custom-line-items key in admin store settings
06:35 Past custom HTML and CSS code for inputs that will create range sliders on your product form
07:35 Testing if custom line items with range sliders for height and leg thickness are picked up when adding the product to the cart
08:35 Execute 3D palm table Rete script on bitbybit.dev platform
09:05 Checking how runner inputs are set up in the script for Number Of Legs, properties[Height], properties[Leg Thickness] names
10:12 Export the Rete script via copy button and import it to product metafield called 3D Bits Inline Script by paste command
10:40 Configure other product metafields for fonts, camera positioning, JavaScript and others that are required for parametric 3D configurator to function
11:25 Upload a picture for the product page
11:40 Preview the 3D table product configurator and play around with variant and line item input sliders, see the table adapt
13:33 Learn how to find out the names of inputs that are being sent via BITBYBIT RUNNER to you 3D model script