Why 3D and AR Views Matter for Jewelry Retail

Online jewelry shoppers can't touch or try on a piece before buying. Interactive 3D models and augmented reality (AR) views let them rotate a ring, inspect a pendant from different angles, or see how a necklace might look in their space. These experiences can increase confidence and reduce returns, though the research does not provide specific conversion or sales data for jewelry.

The good news is that you don't need to build a native app. Open web formats and viewer components let you embed 3D and AR directly on your e-commerce site, using the photos you already have as a starting point.

The Core Format: glTF and .glb

glTF is a royalty-free specification for efficient transmission and loading of 3D scenes and models. glTF 2.0 was released as the ISO/IEC 12113:2022 International Standard, making it a reliable choice for web delivery.

glTF content can be stored in a single binary file with a .glb extension. A .glb file can contain scenes and nodes, cameras, meshes, buffers, materials, textures, skins, and animations—everything needed to render a detailed jewelry model.

Displaying 3D Models with <model-viewer>

Google's <model-viewer> is a web component for displaying interactive 3D models on the web and in AR. It is supported on the last two major versions of evergreen desktop and mobile browsers, plus the last two versions of Safari on macOS and iOS.

You can embed <model-viewer> on your product pages to let customers rotate and zoom a piece. For AR modes that use WebXR, you may need additional APIs such as the WebXR Device API, HitTest API, and DOM Overlay API. These are only required if you enable WebXR in the ar-modes attribute.

Apple's Ecosystem: USDZ and Quick Look

Apple devices use USDZ files for 3D and AR. Built-in apps like Safari, Messages, Mail, and Notes use Quick Look to display USDZ files of virtual objects in 3D on iPhone, iPad, and Apple Vision Pro. Quick Look views can also be embedded in apps and websites.

To reach Apple users, you'll need to provide USDZ versions of your models alongside glTF. The research does not detail conversion requirements from glTF to USDZ, so you may need to consult Apple's documentation or use a conversion tool.

WebXR: The Browser API for AR and VR

The WebXR Device API specification describes support for accessing virtual reality and augmented reality devices—including sensors and head-mounted displays—on the web. It is the underlying technology that enables AR sessions in the browser.

For most e-commerce use cases, <model-viewer> handles WebXR behind the scenes when you enable it. You only need to work directly with WebXR APIs if you require custom AR functionality beyond what <model-viewer> provides.

From Photos to 3D: What to Expect

The research does not document any specific photo-to-3D conversion pipeline for jewelry. Accuracy of reconstruction from flat product photos is unestablished, and challenges like reflective metal, small scale, and gemstone transparency are noted in the opportunity rationale but not verified by the provided sources.

In practice, you will likely need to use authoring or conversion tools to create a 3D model from your photos. The quality of the result may vary depending on the complexity of the piece and the photos you start with. It's wise to test a few pieces before committing to a full catalog conversion.

Device and Browser Support Considerations

AR viewing depends on device and browser support. <model-viewer> works on recent evergreen browsers, but its WebXR features require specific APIs and Safari support is limited to recent versions. Apple AR Quick Look requires iOS/iPadOS 12 or later, or visionOS 1 or later.

Plan your implementation with fallbacks in mind. Not every visitor will have AR-capable hardware, so ensure that a standard 3D view or static image is available as a baseline experience.

Frequently asked questions

Do I need a native app to show 3D jewelry models on my site?+

No. You can use web components like <model-viewer> to display glTF models interactively and in AR directly in the browser, without building a native app.

What file format should I use for 3D models on the web?+

glTF, particularly the binary .glb format, is the ISO-standardized runtime 3D asset delivery format. It is efficient and widely supported by web viewers.

Will my 3D models work on iPhones?+

For AR on iPhones and iPads, you need USDZ files displayed through Quick Look, which is supported in Safari and other built-in apps on iOS/iPadOS 12 or later. You may need to provide both glTF and USDZ versions.

Can I convert my existing jewelry photos into 3D models?+

The research does not document a specific photo-to-3D conversion pipeline for jewelry, so accuracy is unestablished. You will likely need to use authoring or conversion tools, and results may vary depending on the piece and photo quality.