Virtual tour app for a rustic wedding venue
About Terrain Events
Terrain Events is a rustic wedding venue located in Glen Mills, PA. During the COVID-19 pandemic, Terrain Events had to close their space to the public and therefore cancel the in-person site visits for couples and event planners. By offering 360 virtual tours, the virtual tour app can promote the event space to prospective customers remotely.
The Problem
Busy couples and event planners lack the time necessary to visit wedding venues in person
The Goal
Design an app for Terrain Events that allows users to easily tour the event spaces
Process Overview
.png)
Project Overview
.png)
Mobile App
-
UX Designer from conception to delivery
-
Solo Project for Google UX certificate
2 Weeks
-
Figma
-
User Interviews
-
User Pain Points
-
Competetive Audits
-
Persona
-
Problem Statement
-
User Journey Map
-
Storyboarding
-
Paper Wireframes
-
Digital Wireframes
-
Lo-fi Prototype
-
Usability Studies
-
Refinements
-
High-fidelity prototype
-
Accessibility
1.0 Empathize
1.1 User Interviews:
I conducted interviews to understand the users I’m designing for and their needs. A primary user group identified through research was busy couples who don’t have time to visit wedding venues in person. This user group confirmed initial assumptions about Terrain Events prospective customers, but research also revealed that time was not the only factor making users prefer virtual tours.
Other user problems included pandemic, transportation, or difficulties in remembering all the space details even when touring an event space in person.
Interview Participants:
I recruited participants for interviews from my network of friends, family, colleagues, and classmates.
-
# of participants : 3
-
Ages: 25 to 30
-
All recently got married or are in the process of wedding planning
1.2 User Pain Points:
Based on the user interviews, a few common issues came up.
01
Time: Working adults are too busy to visit wedding venues in person.
02
Accessibility: Web-based 360 virtual tours mostly use an autoplay feature that can trigger motion sickness for some users and the spinning speed is not compatible with the accessibility standards.
03
Information Architecture: Virtual tours are often added as an afterthought to the venues’ websites and the virtual tour function is hidden among other information so accessing it is usually time-consuming.
04
Credibility of Perceived Information : Virtual tours are often depicting the space without any people in them. For couples, it is important to see the space in action ( in an actual wedding setting).
1.3 Competitive Audit
Competitor 1
Weaknesses
Strengths
-
Offering organized tours for different spaces of the venue
-
Making viewing the individual rooms easy
-
Having clear instructions for navigation inside the 360 images
-
Slow loading time
-
Not offering the full-screen virtual tour
-
Not having accessibility features
Competitor 2
Weaknesses
Strengths
-
Offering a full screen virtual tour experience
-
Including a side menu inside the 360 tour that simplifies navigation
-
Having clear signage for clickable elements to pass through doors and climb the stairs
-
Not fully utilizing the full-screen real estate for the immersive experience
-
Not having accessibility features
Competitor 3
Weaknesses
Strengths
-
Offering an elaborate and organized virtual tour design
-
Including features that enhance the user experience such as snapshots and VR mode for mobile devices
-
Making users feel fully immersed in the tour
-
Not having accessibility features
-
Not saving the snapshots efficiently
2.O Define
The second stage began with consolidating my research findings to define a user persona followed by the problem statement and user journey map for that persona. The second user persona is also representative of another potential users segment.
2.1 Personas
2.2 Problem Statement
"Perrie is a busy bride-to-be who needs an easy way to tour rustic wedding venues for her upcoming wedding because she does not have enough time to do in-person tours of all the wedding venues she likes."
2.3 User Journey Map
Mapping Perrie’s user journey revealed how helpful it would be for users to have access to a dedicated virtual tour app.
3.O Ideate
3.1 Storyboard
3.2 Paper Wireframes
I took the time to draft iterations of a few screens of the app on paper to ensure that the elements that made it to digital wireframes would be well-suited to address user pain points. For the home screen, I prioritized a quick and easy touring process to help users save time.
3.3 Lo-fi Wireframes
As the initial design phase continued, I made sure to base screen designs on findings from the user research and user pain points.
4.O Prototype and Test
4.1 Low-fidelity prototype
Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow is very simple and straightforward so that users can easily start a virtual tour and the prototype could be used in a usability study.
4.2 Usability Study
I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.
Round 1
Test Lo-fi Prototype
-
# of participants: 2
-
29-32 ages
-
In-person testing using Figma
Findings
-
Users need an easier way to go back to the home page than using a Menu.
-
Users couldn’t figure out that the venue name contains a link to the home page.
-
# of Participants : 2
-
In person using the Figma app
-
Ages: 29-32
-
# of participants: 2
-
29-32 ages
-
In-person testing using Figma
Round 2
Test Hi-fi Prototype
-
# of participants: 2
-
29-32 ages
-
In-person testing using Figma
Findings
-
The users need a clue indicating they are completing a process.
-
The vertical placement of thumbnails for different rooms is blocking a good portion of a 360 image.
-
# of Participants : 2
-
In person using the Figma app
-
Ages: 29-32
-
# of participants: 2
-
29-32 ages
-
In-person testing using Figma
5.0 Iterate
5.1 Refinements
Early designs allowed for returning to the Home page through the Menu navigation bar and the Terrain Events title/icon, but after the usability studies, I added an additional navigation bar with the Home icon, so the users can return to the Home page quickly from anywhere within the app.
The second usability study revealed confusion with the virtual tour flow. To help users make a better sense of the flow, I changed the location of different rooms’ thumbnails from vertical to horizontal arrangement. I also adjusted the coloring to add contrast so users can easily distinguish which “room” they are touring.
5.2 Key Screens
5.3 High-fidelity Prototype
The final high-fidelity prototype presented cleaner user flows for the virtual tour experience. It also meets user needs for accessing the Home page from anywhere in the app. ( Due to limitations of prototyping tool, the 360 images are static, but in the actual product, they will be interactive.)
5.4 Accessibility Considerations
01
Provided a navigation menu for users who use screen readers so they can easily access different pages.
02
Used icons to help make navigation easier.
03
The users can view the 360 images by slowly rotating their phones so the spin speed can be adjusted based on accessibility standards and prevent motion sickness.
6.0 Reflections
Thanks for scrolling all the way!
What I learned:
While designing the virtual tour app, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs.
Next Steps:
-
With more rounds of iterations and usability studies, we can see how we can improve the virtual tour experience.
-
Conduct more user research to determine if more features could be added to the virtual tour.
All UX Projects
E-commerce Website
Web Application