Hindsight AR Mobile App
"What if we could actually see the path the Hayden Expedition took to summit Signal Mountain?"
Finding an Opportunity
Living in the DC area, the upcoming Cherry Blossom Festival was on our minds as well. Would they restrict entrance to the Tidal Basin? They certainly wouldn’t have any events scheduled. Runs, parades, cultural displays and tours would be cancelled.
We knew that visitorship was down at all of DC's historic and cultural sites. You simply couldn’t experience them like you had before the pandemic. Traditional touring options weren't available and some sites were closed completely. Travel was somewhat restricted and it wasn’t a great idea to be in large crowds of strangers.
Could we get people out of their houses and back into parks with an app? We kicked around ideas that could help us explore and engage with our surroundings in non-traditional ways.
Narrowing Focus
Gathering Insights
Survey Says?
With one short week to devote to research, we crafted a survey to help us quickly learn about DC tourism in the wake of the pandemic. We hoped to learn if COVID-19 changed the frequency of site visits, understand what people hoped to learn and leave with after touring, and find ways these visits can be enriched with restrictions in mind. Our 17 respondents helped us to understand:
- Not one of them was visiting parks or museums at all.
- People felt trapped in their homes. Some were frustrated, some lonely, some scared.
- Users weren't interested in virtual tour options; They wanted in-person experiences.
- Learning about site history is important to them.
- Users said the would use an interactive app to augment their visits.
Talking to Park-Goers
Our survey respondents mentioned frequently that one of the biggest draws to visiting DC parks was "getting outdoors" or "taking in the view". The people we interviewed in-person were all park-goers. We asked questions similar to our survey, but also in-depth questions to learn which NPS sites they had visited (or have on their wish-lists) and how they like to explore or experience them. We asked them to relate specific past experiences and tell us what could be improved and what things were most memorable. Our 7 park users told us:
- Most want access to to historical, cultural, and geographic information, but would prefer to explore on their own.
- They shy away from group tours because they don't want to follow a rigid schedule or they need flexibility for other reasons like traveling with young children.
And then our users started to describe their experience at Joshua Tree, Jackson Hole and the C & O Canal. We learned we needed to consider how this app would be useful once our users were outside of DC. They wouldn't just be taking day-trips to see monuments and architecture, but hiking mountain trails and viewing giant redwoods.
Competitive Analysis
- Object detection & recognition - AR components trained on specific real-world objects in order to serve specific content.
- Object tracking - AR components "understand and follow" real-world targets in order to anchor content to them.
- Geo AR/Geofencing - Allows location-based triggers where physical targets are not available.
Conversations with AR Subject Matter Experts
As UX Designers, our expertise was certainly not Augmented Reality, so we sought out the advice and wisdom of two AR Professionals. Sounak was a colleague of Lauren's, and Leo was the first kind stranger to answer my plea for help on LinkedIn.
We we particularly interested in how they start app development, how to prototype and test for AR, and what usability guidelines we should employ. They did not disappoint!
- "Start with the user's journey." Think about their interactions. When and how do they move into AR. How do you calibrate the user's device.
- Most people will be new to AR so"...onboarding or coaching will be very important." It's helpful to show them how to navigate the space and give them a place to play.
- "AR prototyping often includes 3D objects." Use whatever you have: cardboard to build frames, 360 degree photos, physical objects you can manipulate to mimic AR movement.
- "Safety is a big consideration." Many people will want to interact with the app while walking.
One More Time
Initially we thought this application would be something NPS would provide its guests as part of park admission. But we also wondered if there was a way to monetize the application or certain features. We decided to reach out again for a feature-specific survey. Our goal was to make sure we didn't miss any necessary features, and gauge interest in paying for premium content.
- 100% of our respondents confirmed that they would consider a geolocation-based, self-guided tour app as an alternative to a guided tour.
- 57.1% said they might be willing to pay for this kind of app to supplement their park visit.
- Access to audio recordings, historic site photos & video footage remained must-haves.
- Being in control of their visit (what to see, how to get there, and how long to stay) remained important.
Understanding the User & Finding Patterns
We used several methods to synthesize gathered insights. Sorting them into an affinity diagram revealed common frustrations, needs, and behaviors. Using an aggregated empathy map, we decided to focus on what we believed was the largest user segment: recreational visitation by families. We also touched back to our proto-personas to see if we were still on track.
User Insights & Affinity Diagram
Empathy Map
User Persona
Real user insights and demographics helped to develop one of our proto-personas, Angela, into our main user persona. She represents the decision maker in families visiting NPS sites recreationally.
Angela Child, 34
Demographics
Angela lives in Washington, DC and is employed as a government researcher. She is a single parent and loves taking her children to parks and museums as both bonding and learning experiences.
needs
- Wants to have more memorable experiences with her children.
- Needs to be free to explore the area her own way, so she can accommodate different levels of learning.
- Wishes information about sites was easier to obtain for planning purposes.
pain points
- Wants to learn historical and cultural facts, but doesn't want to pay for guided tours.
- She dislikes being on other people's schedules and wants to avoid group settings.
- It's currently hard to find information on site closures due to Covid-19 restrictions.
Ideate Potential Solutions
Brainstorming & Prioritizing Features
- Offering self-guided tours by providing site selection
- Providing directions and guidance to navigate to the location
- Serving site-specific content en-route and at the destination
- Giving users a unique experience by providing augmented reality content wherever possible
Information Architecture
Storyboard
Creating a storyboard right after deciding on features, helped align the team's vision. We also decided on a starting place familiar to all of us: The National Mall.
User Journey Map & Flow Diagram
The next step was to map out our user's interactions and flow while using the application. This made us keenly aware of potential pitfalls and high-stress interactions. A few iterations of our User Flow Diagram followed.
Concept Sketches and Paper Prototyping
Inspiration
When it was time to put pen to paper, we looked back to the images we had gathered for inspiration. Some helped us understand what was possible and some helped us articulate questions to define technical specifications.
Concept Sketches
The National Mall would be the first location we would tackle. We sketched early concepts on paper to quickly work out basic screens and functionality:
Paper Prototype Testing
To gauge user comfort with AR technology, we opted to do a quick round of testing using a paper prototype. Our goals were to simulate the AR experience and work out early on how to communicate when AR functionality and site-specific content was available as users move through the parks. We also were curious to see how users would engage with the content without being prompted.
Our testing showed app adoption would be difficult for users unfamiliar with AR technology, so we made decisions to:
- Create coaching screens as part of onboarding that including information on how geofencing worked to serve content
- Simplify the AR launch to minimize required user action
- Incorporate sounds or haptics to alert users of when new content is available
Mid-fi Prototype
We moved from paper to Figma for our low-fidelity and mid-fidelity version of the prototype. Because of time-constraints, we shifted our effort from building out the full functionality in the low-fi version and began building and testing the mid-fidelity version.
With more than one person working on the design at the same time, we quickly learned we needed to divide and conquer, so we each focused on different parts of the user flow.
Branding & Visual Design
Now, What Do We Call It?
Our working name was "AR Tours". As a key differentiator in our app, we wanted the name to include AR. Users would be exploring or trekking through parks, so that was another direction. We also thought the learning piece was important to highlight. This app was more than navigation & exploration, it was a link to a site's history and cultural significance.
We kicked around a few names:
- TrekAR
- ARScout
- ARExplore
- ARTraveler
- ImmersivepARks
- pARktours
- pARkwalks
- pARkguide
- HindsightAR
If you read the title of this case study, you know we went with Hindsight AR. We thought that name spoke well of the app's aim to provide information related to the site's history & cultural significance.;)
noun
understanding of a situation or event only after it has happened or developed
Logo Ideas & A/B Testing
One of my partners proposed some logo ideas that spoke well to navigation & travel (1-3), but they didn't incorporate the history or culture component. I proposed a simple logo replacing the "g" with a monocle and chain or a pair of pince-nez (4); a modern font paired with historical eyewear.
My team liked the version with the monocle the best, but I worried about how it would read. It certainly wasn't as clear as the glasses-shaped "g" in the second version. What to do? A/B test, of course!
We created an automated A/B test on Usability Hub that allowed us to get rapid feedback. With 14/16 users choosing the logo with the glasses, we had a hands-down favorite. Our follow-up question (why did you choose this version?) told us that it was simply easier to read.
The Intersection of Nature and Technology
Our mood board guided us on design decisions. We were drawn to images of the parks featuring dynamic orange and yellow sunsets and cool mountains and water. We hoped to convey an earthy yet modern feel by using blue and tan, instead of the expected green and brown associated with park logos and signage. Geometric patterns and organic elements are used throughout the application, in an effort to explore the intersection of nature and technology.
Prototype Testing & Outcomes
We were able to use our park-going users for all phases of testing. This gave us insights to not only what we still needed to improve, but how changes we had made along the way had already impacted their experience.
Testing Objectives
It was important for us to make sure users understood:
- The list of available sites on the main page are sites nearest them and available for tour
- How "in the zone" alerts are displayed in the app
- How to launch a specific tour
- How to use the application's navigation to reach their destination
- How to launch AR content & features
- How to launch other audio or visual content
- Liked the style and substance of content
They Said, We Did...
"I thought the 'Hindsights Near Me' banner might let me search."
>Added a search icon next to the header and search functionality. What a great idea!
"Does clicking on a location icon [on the map] let me navigate to another tour?"
>Made us reconsider how we were displaying other tours and amenities via the map. As part of the MVP, it made sense to us to show only the user's current location and their destination on the map.
"I want to use my phone to look around for other sites and info while I walk."
>This was planned as a post-MVP feature, but our users consistently asked for, or expected to have, this functionality.
"What's this gray bar for?"
>It wasn't clear to our users that more information could be found on the "gray bar". We added "handlebars" to it to indicate it is actually a drawer-like element with for more information.
"I don't know which icon is which."
>Sometimes we got confused also. We are adding words under our icons to make life more simple.
"It's like a guided tour without the Ranger."
>Not all comments were negative! We had several like this, adding that the AR visuals would give them an even better experience than they could get on a guided tour. This was music to our ears!
Other Patterns
We also observed several reoccurring patterns that we needed to address:
- 5/6 users expected more interaction with the map feature than simple navigation.
- 4/6 users thought the button for audio recordings was for application volume.
- 3/6 users expected AR to be "on" all of the time.
As time and resources were limited, we had to make revisions based on our MVP and earlier feature prioritization. Map & AR upgrades were going to have to wait, but we could certainly make available functionality more clear for the user. And we could do better with icons with additional labeling.
Marketing Website
We were challenged to add a "front-end development" component to this project. We didn't want to build our prototype out in two different platforms however, so I suggested we build a marketing website to support the Hindsight app as if it were currently in-market. I designed and built a single-page, responsive website using Webflow:
Learnings & Next Steps
Better Apart
We were blessed with a very talented and hard-working team. Previous work experiences afforded each of us a different skillset, and we took time to talk about them. Our kick-off meeting was not only idea-generating, but talent-finding and role-distributing. This clear delineation helped us work more than one task at a time, which was essential to meeting our deadline.
It wasn't all roses, though. It took effort to keep all the balls in the air, and a little bit of diplomacy to course-correct when needed.
You Don't Have to Be an Expert
When we started this project none of us had more than a cursory understanding of Augmented Reality. And even with a short amount of working time, we were able to learn a tremendous amount. Seeking out expert guidance, asking the right questions of them and potential users, and putting your nose to the research grindstone can give you a strong foothold to launch an idea in the "unknown". Don't let lack of expertise stop you!
We Needed More Research
While we did learn a lot, we could have learned more and we struggled with the map prototyping because we weren't thorough. We would have benefitted from not only including AR applications in our initial competitor research, but also map and navigation applications to incorporate best practices. We got so wrapped up in providing a unique AR experience that we were neglectful when it came to map functionality.
Beyond MVP
Sometimes it's tough to draw the line, but we had to put off a few (amazing!) ideas in order to produce our MVP. Given more time we would have added:
- More locations. We built the application for an urban park area. But we had so many ideas on how this could be modified to accommodate remote locations and hiking and biking vs. walking.
- A way to monetize the application. We started to work through ideas about bringing on local partners. We would show their restaurant or coffee shop as an amenity in the app, so users can get a latte after they see the Lincoln Memorial. Win, win! We also began to explore offering off-line tours, add-free experiences, etc. as part of a freemium model.
- Advanced map features. Our users wanted more map functionality, but we intended it only to lead them to their chosen destination intentionally. Users asked for other features common to modern map apps like pinch-to-zoom, street view, and satellite view.
Dear User, we want to add that, too!
Testimonials
See More Case Studies
Let's work together!
I look forward to hearing from you and learning all about your project!
Contact Me