This page is provided as is for project managers to use to plan a WebAR implementation. These example stories are based on our experience assisting many clients deploy WebAR to their websites.

Tickets in Excel Sheet format:


As a developer I need the 3D Cloud WebAR SDK libraries available within the website codebase to be able to add to the relevant sections of the website.

The SDK can be imported via node package manager or as a url import, see documentation here: WebAR SDK Integration Guide - 3D Cloud Manual (Public) - 3D Cloud™ Confluence (atlassian.net)

Acceptance Criteria:

  • 3D Cloud WebAR javascript library is available within website pages

  • 3D Cloud WebAR CSS is available within website pages

Estimated Time to Complete: 1 hour

Set up a staging environment using assetEnvironment: stage for testing prior to production so that issues can be caught before launches

Acceptance Criteria:

  • A staging/test environment is accessible by project team for testing outside of production

Estimated Time to Complete: 4 hours

As a user I would like to have a way to request an AR asset I can view in my room on a mobile device. If on a mobile device (iOS or Android) the button should retrieve the appropriate AR asset (USDZ for iOS or GLB for Android) through the correct URL to trigger the native AR viewer on the device to load the asset and show in room. If a user is on a desktop device the button should present a QR code to the user allow for them to load the product on a mobile device.

Acceptance Criteria:

  • On product details pages for SKUs that have webar assets available a “view in ar” button should be visible to the user

  • If clicked the button will load the correct AR asset in the native AR viewer on mobile devices

  • on desktops it should trigger a modal to show a QR code to send to mobile

Estimated Time to Complete: 8 hours

Link to UX story ticket

Set up view in AR button on product details pages per linked story ticket

Estimated Time to Complete: 8 hours

Link to UX story ticket

Test view in AR button on product details pages

Estimated Time to Complete: 4 hours

As a user on the website I want to be able to quickly find products that have AR assets available by filtering product list pages by a AR or view in AR filter type and by having a label/icon on product cards for products available in AR.

Acceptance Criteria:

  • on product list pages a user can filter for products that are available in AR

  • product cards on product list pages that are available in AR have a UI element that visually identifies those products as ones that can be viewed in AR

Estimated Time to Complete: 8 hours

Link to UX story ticket

Set up view in AR filter on product listing pages and available in AR UI element on product cards

Estimated Time to Complete: 8 hours

Link to UX story ticket

Test view in AR filter on product listing pages and available in AR UI element on product cards

Estimated Time to Complete: 4 hours

As a user on a desktop browser I want to be able to transfer a product to my mobile device via a QR code so I can view it on AR on that device. The QR code should appear in a modal when a user click the view in AR button on a product and the QR code generated should be specific to the product sku and link straight into the AR asset on the mobile device.

Acceptance Criteria:

  • When view in ar button is pressed on a desktop browser a modal should open with a custom QR code

  • When QR code is scanned on a compatible mobile device the native AR viewer should open with the correct AR asset

  • When the QR code is scanned on an incompatible device an error page will display

Estimated Time to Complete: 4 hours

Link to UX story ticket

Set up dynamic QR code display when user is on desktop

Estimated Time to Complete: 8 hours

Link to UX story ticket

Test dynamic QR code display when user is on desktop

Estimated Time to Complete: 4 hours