AR and QR Code Integration

This post explores the next phase of my project, where I integrate the 3D model created in the previous post into an Augmented Reality (AR) experience. This feature is fundamental to the app and its marketing strategy, providing users with an interactive way to explore camper van designs. By incorporating AR, I aim to enhance user engagement and offer a unique selling point that sets the project apart in a sector that has yet to embrace this technology fully.

Design and Software Selection

Initially, I planned to use Unity and Zappar for this project phase. My decision was based on previous experience with these platforms during the Emerging Technologies module, where I successfully implemented marker-based AR. As a development engine, Unity provides robust AR capabilities, allowing for seamless integration of 3D models and interactive elements. It supports image tracking, enabling users to scan a designated marker, such as a QR code, to trigger the appearance of a 3D model in AR. Zappar, on the other hand, is an AR platform that generates QR codes linking to AR experiences. My initial plan involved exporting the 3D model from Unity as a ZIP file and uploading it to Zappar, which would then create a scannable QR code. When a user scans this code with their mobile device, the camera recognises the image tracker and overlays the 3D model onto the real-world environment.

While Unity and Zappar appeared to be the most suitable tools for this project, I encountered technical challenges that made me reconsider my approach. Running Unity on my laptop proved difficult, causing workflow interruptions and slowing development. As a result, I had to either work on campus, which was not always convenient or explore alternative software that allowed for a more efficient process. Additionally, with Dan leaving his position, I lost a key source of support for troubleshooting Unity-related issues. Given these constraints, I shifted to a more accessible and user-friendly platform, Adobe Aero.

Adapting to Challenges and Implementing AR with Adobe Aero

Adobe Aero offers an intuitive approach to AR design, eliminating many of the complexities associated with Unity’s setup and scripting requirements. Unlike Unity, Aero provides a direct interface for importing 3D models and placing them in an interactive AR scene without extensive coding. This change streamlined my workflow significantly, allowing me to focus more on refining the AR experience rather than troubleshooting software issues.

The transition to Adobe Aero involved importing the 3D camper van model and ensuring the AR experience functioned smoothly across different devices. I needed to test how well Aero handled model scaling, interaction, and environmental placement. I also had to ensure that the QR code generated through this process led users to a stable and immersive AR preview. While Aero lacks some of the advanced customisation features of Unity, its ease of use outweighed these limitations for my specific project needs.

Figure 1: Showcases the process of exporting the 3D camper van model in GLB format from Blender, ensuring compatibility with Adobe Aero for AR integration.
Figure 2: Displays the experimentation phase in Substance Stager, where different materials and colors were applied to the model, testing various aesthetic and realistic finishes before finalizing the design.

Exporting the 3D Model from Blender

The first step in integrating my 3D model into an AR experience was exporting the model from Blender in the correct file format. After testing various formats, I found that the GLB (GL Transmission Format Binary) worked best for importing into Adobe Aero. The GLB format is particularly advantageous as it preserves textures, materials, and animations while maintaining an optimized file size, making it ideal for real-time AR applications. According to Cloudinary, “The GLB format is a versatile and widely-used 3D file format that has gained significant traction in recent years. It is a binary file format that is essentially a container for various 3D assets and resources. These assets can include 3D models, textures, materials, and animations. The GLB format is based on the glTF (GL Transmission Format) file format, which is an open standard for the efficient transmission and loading of 3D graphics.” This makes it ideal for Augmented Reality (AR) applications, where efficient performance and seamless integration are crucial.

Before exporting, I ensured that my model was appropriately scaled and had clean topology, a critical aspect of 3D modelling that impacts performance and visual quality. Swarna Paul emphasizes the significance of proper topology, stating, “Understanding topology is fundamental for any 3D artist aiming to create efficient, versatile, and visually stunning models. Topology refers to the geometric surface characteristics of a 3D model, dictating how polygons are arranged and interconnected.” Applying this principle, I carefully structured my model’s geometry to avoid unnecessary rendering issues in Aero. Maintaining a well-optimized topology ensures smooth surface transitions and efficient processing, which is crucial for achieving a seamless AR experience.

Once I confirmed that my model had the correct scale and topology, I proceeded with the GLB export and prepared it for import into Adobe Aero.

Importing the Model and Setting Up the Scene Anchor

After successfully exporting the model, I imported it into Adobe Aero, where I set up the AR scene. One key aspect of placing objects in AR is anchoring them correctly in the real world. Since my project involves viewing a camper van model in AR, I needed to ensure it would be positioned naturally on the ground rather than floating or misaligned.

To achieve this, I used scene anchors, a feature in Aero that determines how the digital object interacts with real-world surfaces. In my case, I selected a horizontal surface anchor point, the most commonly used type in AR applications when placing objects on the ground. This setting ensures that when a user scans the QR code and views the 3D model in AR, it will appear grounded and appropriately scaled relative to the user’s environment.

Aligning and Snapping the Object to the Grid

Once the anchor point was set, the next step was fine-tuning the object’s positioning to prevent rendering issues. In AR applications, models can sometimes appear sunk into the ground or floating slightly above the surface due to incorrect positioning. To avoid this, I selected my 3D model in Aero and used the “Snap to Grid” function. This function enables the model to be aligned with the ground plane by snapping it to the nearest grid point, ensuring perfect alignment and accurate display when viewed in AR.

Adding Interactive Triggers and Animation

I added a simple interaction mechanic to enhance user engagement, such as a rotation animation triggered when users tap on the 3D model. Adding animations in AR makes the experience more immersive, giving users a sense of interaction rather than just viewing a static object.

In Adobe Aero, I used the Trigger and Action system to set up this interaction:

  1. Trigger: When the user taps the model, I set the animation to activate.
  2. Action: The camper model moves in a circle, adding a dynamic and interactive feel to the experience, and the logo scales.

This small yet effective feature encourages users to engage more with the AR model, making the experience more interactive and realistic.

Figure 3: Showcases the placement of the 3D model and logo, as well as the triggers and animation setup within the AR environment. This highlights how the interactive elements are positioned to create an engaging user experience.
Figure 4: Illustrates the process of sharing the QR code, which allows users to access the AR experience seamlessly. This step is crucial in integrating AR into marketing materials effectively.

Testing the Animation and Final Adjustments

Before finalizing the AR experience, I needed to test how well the animation and placement worked in different environments. I conducted multiple tests using my phone’s camera to ensure that:

  • The horizontal surface anchor worked correctly, and the model appeared on the ground as intended.
  • The rotation animation played smoothly when tapping on the model.
  • The model is appropriately scaled depending on the user’s environment.

If any issues arose, such as the animation not triggering or the model appearing too large or small, I adjusted the settings in Adobe Aero accordingly to ensure the best user experience.

Generating the QR Code for AR Sharing

The final step was to make the AR experience accessible to users via a QR code. Adobe Aero allows creators to publish their AR experiences and generate a scannable QR code, which users can scan with their smartphones to view the model in their own space.

Once I finalized the model’s placement and interaction features, I shared the experience through Adobe Aero’s cloud publishing system. Aero then generated a QR code embedded in marketing materials, brochures, websites, or social media, allowing users to access the 3D camper van AR experience easily.

Figure 5: Presents the final version of the QR code, ready to be scanned by users to experience the interactive AR content.

YouTube Demonstration Video

The demonstration video uploaded to YouTube provides a walkthrough of how users can interact with the AR-enhanced experience. It showcases the 3D model in action, detailing how the animations and interactive triggers function when scanned via the QR code. This video serves as a visual guide for potential customers, reinforcing the innovative approach of Wander Wheels in blending technology with immersive marketing.

Conclusion

Through this structured process, I successfully integrated my 3D camper van model into an interactive AR experience using Adobe Aero. By selecting the correct file format, setting up scene anchors, aligning the model, adding animations, and generating a shareable QR code, I ensured that users could seamlessly view, interact with, and explore the model in their real-world environment. This approach enhances user engagement and aligns with the project’s goal of leveraging AR technology to innovate the camper van buying experience.

While my 3D model is far from perfect, I recognize that topology is a complex aspect of modelling that requires extensive experience and skill in Blender. Although my current topology could be improved, the model functions effectively within the AR experience, demonstrating how augmented reality can revolutionize sales in the camper van sector. I aim to refine my topology and modelling techniques, ensuring higher-quality assets in future projects. However, despite these challenges, the model and integration work perfectly to showcase the core idea behind this project.

Time Management Reflection

The challenges encountered during this project stage highlighted the importance of adaptability in software selection and project management. Although my initial plan relied on Unity and Zappar, technical difficulties forced me to reconsider my approach and explore alternative solutions. This decision improved my workflow, allowing me to work more efficiently from my laptop rather than depend on on-campus facilities.

Adjusting to new software required additional time to learn its capabilities, but the overall benefit was a smoother development process. This experience significantly reinforced the necessity of flexibility in creative projects when external factors such as software limitations or changes in available support impact the original plan. Despite these obstacles, I successfully integrated AR into the project to enhance user interaction, making the camper van models more immersive and accessible within the app.

Figure 6: A close-up of the completed tasks on Trello, demonstrating the progress tracking and organization that contributed to meeting deadlines successfully.

Reference List:

Cloudinary. (2025). GLB Format: How It Works, Use Cases, and Pros/Cons You Should Know. [online] Available at: https://cloudinary.com/guides/image-formats/glb-format-how-it-works-use-cases-and-pros-cons-you-should-know [Accessed 26 Mar. 2025].

Mario (2019). Understanding Topology in 3D Modeling. [online] Elementza 3D Art Training. Available at: https://elementza.com/how-to-understand-topology-in-3d-modeling/.