Website Preloader
0
0 Items Selected

No products in the cart.

Virtual Reality Grocery Shopping

Transform grocery shopping with virtual reality for a truly immersive experience

Overview

Project Manager

Luthando Lester

Responsibilities:

  • Create a project plan
  • Report back to clients
  • Manage tasks to be executed on time
  • Retrospectives & sprint planning
  • Manage prototype execution

UX Researcher

David Dinkelman (me)

Responsibilities:

  • Outline necessary UX deliverables
  • Run research activities
  • Run user testing
  • Create user persona
  • Compile case study

UI Designer

Ivana De Vittorio

Responsibilities:

  • Determine visual direction
  • Create Storyboards
  • Sketch out Wireframes
  • Design digital Layouts
  • Create Virtual Store

Guidelines

Apple HIG – Augmented Reality

Viro Community – VR Design Principles

Medium – UX + VR: 14 Guidelines

Methodology

Figma for document designs.

SketchUp for Virtual 3D space

Gravity Sketch for virtual wireframing

Design Frame

How might we revolutionize the grocery shopping experience by leveraging virtual reality to provide users with an immersive, and convenient way to purchase products?

Challenge

During the COVID-19 pandemic, people have faced numerous restrictions that have limited their mobility. This situation has created challenges, such as the inability to venture outside when ill and the risk of running out of essentials like food. While online shopping is an option, it often leads to unpleasant experiences upon product delivery. 

 

  • Limited mobility due to illness or quarantine
  • Risk of running out of essential items
  • Unpleasant experiences with traditional online shopping

Solution

Through the implementation of virtual reality and augmented reality elements, we strive to create a virtual grocery store that revolutionizes the way people shop for essential items, providing an engaging, convenient way to buy groceries. Accompanied by an app for delivery and payments, your food is brought to you. The goal is to offer a safer alternative to traditional shopping.

 

  • Unique grocery shopping from home through virtual reality
  • Increased interactivity with virtual food products (AR)
  • Shopping in a safe and fun way for limited mobility users.

Process

Research

Gain an understanding of virtual reality design with its unique ways to augment reality and how users can benefit from it.

Ideation

Explore design ideas through low-fidelity wireframes, allowing for quick iteration and feedback on the flow of the VR solution.

Design

Create a 3D store that uses Virtual Reality to create an immersive shopping experience for someone stuck at home.

Reflection

Reflect on the strengths and weaknesses of the solution, and identify opportunities for further improvement and future iterations.

TEAM MANAGEMENT

Project Plan

Our virtual reality project was guided by a  project plan created by our Project Manager. This plan streamlined our workflow, showing individual responsibilities and enabling effective collaboration throughout the 9-week journey. This ensured the delivery of an immersive virtual reality shopping experience that exceeds the brief.

Research

GUIDELINES

Virtual Reality

We went on a journey to understand the intricacies of designing in a 3D space, such as the realm of virtual reality. Given the growing nature of virtual reality, and the scarcity of widely recognized guidelines. We compiled multiple sources to guide our designs for VR. This lets us understand the unique challenges that come with designing with depth and scale. Also enabling us to use this exciting medium to create a unique user experience.

From UI to VR Design

When transitioning from traditional UI design to VR UI design, there are key considerations to keep in mind. VR offers a full 360 canvas with depth, presenting both challenges and opportunities. It’s important to ensure that the user experience is effortless, taking into account the user’s comfort zone within a 94° horizontal space and a 32° vertical space. Additionally, the minimum comfortable viewing distance for UI is 0.5 meters, while the optimal range for strong stereoscopic depth perception is within 10 meters.

(Viro Community)

Making UI easy to Use and Read

To optimize user experience in VR, it is important to consider the placement of UI elements. To prevent eye strain and vergence-accommodation conflict, UI should be positioned at a comfortable distance, typically between 1.3 meters and 3 meters away from the viewer.

Placing text and images on a slightly curved concave surface enhances natural viewing, while ensuring legibility by using larger font sizes, such as at least 20px for UI elements. These considerations contribute to a more comfortable and user-friendly VR interface.

(Medium)

Preventing Simulator Sickness

To prevent simulator sickness in VR, several key factors should be considered. Maintaining a high framerate of at least 60 FPS (90 FPS for supporting devices) is crucial, as drops in framerate and rendering latency can induce discomfort.

Avoiding acceleration and deceleration within the experience,

Using fixed objects to ground the user, ensuring a focused experience without straining the user’s eyes,

Maintaining continuous head tracking, and positioning all objects and content in 3D space are essential measures to minimize simulator sickness and create a comfortable VR environment.

(Viro Community)

Creating Object Interactions

When designing object interactions in AR, prioritize direct manipulation whenever possible to create a more immersive and intuitive experience. Allowing users to touch 3D objects directly onscreen enhances the sense of presence. However, in scenarios where users are moving around, indirect controls can be more effective. Enable familiar gestures like single-finger dragging to move objects and two-finger rotation to spin them. Keep interactions simple and limit movement to the object’s resting surface or a single axis to avoid complexity.

Ensure that gestures near interactive objects are detected accurately, as people may not be precise in aiming for small or distant points. Consider supporting object scaling when it aligns with your app’s purpose, but avoid using scaling to simulate proximity. Be mindful of potential conflicts between similar gestures and strive for consistent virtual object movement that aligns with the physics of the AR environment. Lastly, explore alternative interaction methods, such as utilizing motion and proximity, to create even more engaging experiences with virtual objects in AR.

(Apple HIG)

Reducing Movement Fatigue

When designing interactive elements in VR, it’s important to prioritize comfort and sustainability. Users should be able to engage with the scene without experiencing hand or body fatigue or the risk of injury. The most frequently used objects should be easily accessible, with suggestions ranging from 0.75 to 3.5 meters away to 0.50 to 20 meters away.

Additionally, objects should be positioned at appropriate heights, such as between desk height and eye level, at angles of -15 to -50 degrees for reading, and within a 70-degree circle of vision. Considering the diverse needs and capabilities of different users, factors like height, mobility, and flexibility should be taken into account to ensure comfortable and feasible interactions.

(Medium)

FIELD RESEARCH

User Survey

As the UX Researcher I conducted user surveys that played a pivotal role in shaping our designs for virtual reality. Our findings revealed a fascinating insight: most participants had never experienced virtual reality before. This highlighted the untapped potential of this growing technology.

Users expressed wonder at the immersive nature of virtual reality, emphasizing the amazing experiences it offers. By understanding the limited exposure of users to VR, we were able to tailor our design approach to ensure a beginner friendly and  introduction to this groundbreaking technology.

USER RESEARCH

User Personas

The persona played a crucial role in guiding our goals and decision-making. Our project aimed to enable Mike to buy groceries and do online shopping in a fun and convenient way, all while maintaining a safe and isolated environment.

With Mike’s goals at the forefront, we designed a VR shopping solution that not only met his needs but also provided an engaging and enjoyable experience. As the UX Researcher I made sure to keep my team’s thoughts circulating around what the user needs until the end.

Ideation

PLANNING EXPERIENCE

Storyboarding

Our storyboards brought the user’s experience to life by showing their journey in a visual way. The first storyboard showed the user feeling hungry and realizing they had no food. The second storyboard demonstrated how they used virtual reality to do online grocery shopping. These visuals helped us understand the user’s perspective and design an engaging experience. The storyboards played a crucial role in bringing our virtual reality project to life.

CONCEPT MAPPING

User Flow

Our user flow acted as a guide for us, leading users through a seamless journey, capturing their emotions at every step. This allowed us to celebrate their highs and provide support during challenging moments, creating a deeply engaging experience. With a user-centric approach, the user needs were met at each stage, guiding the steps for our virtual screen designs that create an empathetic and captivating experience.

VISUAL PLANNING

Wireframes

Wireframes played a crucial role in facilitating creativity and idea exploration. The sketched wireframes acted as a starting point. As we deepened our understanding of the project, digital wireframes were created, refining the initial concepts. This iterative process brought our ideas to life, resulting in a cohesive and engaging interface that guided users seamlessly throughout their immersive shopping journey.

Design

VIRTUAL REALITY

Virtual Grocery Shopping

Our final design for the virtual grocery shop is an exciting 3D replica of a real grocery store, brought to life in Virtual Reality using SketchUp. With our VR headset, we had the opportunity to immerse ourselves in this virtual space and explore every corner of the store.

Interacting with the food items and accessing product information added an extra layer of fun to the experience. Our UI Designer did a great job creating this virtual store. Navigating through the aisles and selecting items felt very realistic.

DIGITAL DESIGNS

Virtual Screens

Our digital screens inside the virtual experience serve as invaluable guides, enhancing the user’s journey through the virtual shopping experience. Building upon the initial wireframes, these final designs bring clarity and polish to the interface within the VR realm.

With thoughtful consideration of user interactions and visual hierarchy, we have crafted intuitive digital screens that facilitate smooth navigation, clear product information, and effortless decision-making. These designs transform the virtual space into a functional and visually captivating environment, ensuring an immersive shopping experience.

Reflection

CONCLUSION

Project Outcome

Completing this virtual reality project has been an eye-opening journey that expanded my understanding of immersive design. By exploring virtual reality, I discovered its potential to revolutionize experiences and captivate users. I’m inspired to continue pushing the boundaries of virtual reality and creating captivating user journeys through immersive design.

     

    • I enjoyed working in virtrual reality and I am eager to pursue it further.
    Exploring the Possibilities of Immersive Design
    • Designing for immersion: This project allowed me to delve into virtual reality, where I witnessed the transformative power of creating immersive experiences. By leveraging VR technology, we transported users to a virtual shopping environment, revolutionizing their interaction with products and services.
    • Exploring new horizons: Venturing into virtual reality design pushed me to expand my skill set and embrace innovative approaches. Navigating the intricacies of creating a seamless VR shopping experience unleashed my creativity and delivered a comprehensive user journey.
    Embracing the Power of Virtual Reality
    • Unleashing the potential: Incorporating virtual reality technology opened endless possibilities for creating an immersive environment. By enabling users to explore products in a virtual space, we provided a unique and engaging way to discover and make informed decisions.
    Balancing Functionality and Aesthetics

    Striking the right equilibrium: Throughout the project, I faced the recurring challenge of balancing functionality with captivating visuals and aesthetics. Recognizing the importance of both, I learned to find equilibrium, ensuring that the virtual shopping experience not only met users’ functional needs but also captivated them with visually appealing interfaces.

    Collaborative Excellence
    • Teamwork and synergy: The success of this project is a testament to exceptional teamwork and collaboration. Each team member’s expertise played a vital role in shaping and refining the virtual reality shopping experience, resulting in a cohesive final product.
    Looking Ahead
    • Continued exploration: This project has ignited my passion for further exploring immersive design. I am excited to push the boundaries of virtual reality, harness emerging technologies, and craft experiences that captivate and delight users.

    PORTFOLIO WORK

    Powered by Creativity

    ShopLift: An immersive Virtual reality shopping experience

    UX/UI Virtual Reality Design

    Solar Revolution: Supplying Renewable Energy

    Website Design

    Conscious: Empowering Inclusive Home Security Management

    UX/UI App Design

    Creativity Will Save Us: Uplifting Developing Communities

    UX/UI Design