3D & AR viewer
StarterGenerate a 3D model, style the scene it sits in, and embed it on a product page.
Mocart turns a product photo into an interactive 3D model, gives you a panel to style the scene around it, and hands the result off as an embed that renders through a <model-viewer> iframe — drop it into your product template and the same embed opens WebAR on a phone. (Video is different: the Mocart Player is aimed at ad and rich-media placements.)
Start with the goal
The panel opens by asking what the asset should do rather than what its numbers should be. Choosing a goal sets the backdrop, lighting, finish, and effects together, and marks what it touched — every one of those stays yours to change afterwards.
| Goal | What it goes for |
|---|---|
| Convert | Clean and true to the product — the safe default for a product page. |
| Stand out | Bold and eye-catching, for a feed or an ad where the model has to win attention. |
| Seasonal | Timely styling for a moment or campaign window. |
| Showcase | Premium detail — closer, richer, made to be looked at. |
If the model belongs to a campaign, the panel says which goal that campaign suggests and offers to apply it in one press.
Tune the scene and the model
| Section | What you control |
|---|---|
| Backdrop | None, a solid colour, one of your own photos, or a video. A photo backdrop can have the original product removed from it, so only your 3D model stands in the scene. |
| Lighting | Neutral, Studio, Daylight, Golden, Night, or Gallery, plus exposure and a ground shadow. |
| Effects | Reflection for a polished floor, rim light, spotlight, or snow — with strength and spread where the effect has them. |
| Pose | Size and turn as two plain controls, each naming its current value. Exact position, scale, and rotation per axis are one press away when you need them. |
| Finish | Matte, Satin, Gloss, or Metal as named finishes, with a tint — metallic and roughness sliders sit behind Fine control. |
| Interaction | How the model behaves for a shopper: Still, Spin on its own, or Follow the cursor — and whether AR is offered. |
360° · drag to rotate
View in AR
Copy
Embed a 3D asset
- Open the approved 3D asset and choose Copy Embed Link.
- Paste the snippet into your product page or template.
- On a phone, the same embed opens WebAR.
3D generation is available on Starter and above — it is the most expensive output Mocart makes, so it carries its own entitlement. The embed carries the scene you configured, so what a shopper sees is what you set up here.
Was this helpful?