top of page

imaginARi

imaginARi is a conceptual app which enhances the guided tour experience, focusing on improving user engagement and immersion. By renting a variety of immersive technologies on-site at an imaginARi kiosk, users can enjoy tours in  new and exciting ways - using goggles to enjoy AR elements, headphones for ambient sound and storytelling, and vests for a spine-tingling tactical experience. At the same time, deep customization options allow for a group with different needs for comfort, safety, involvement, and content on entertainment or educational tours.

Project Overview

Challenge

Users want an informative and engaging experience, which takes into account different needs for immersion, sensory stimulation, and excitement.

Solution

imaginAri provides a way for users to customize their tour experience while on a guided group tour - keeping them safe, comfortable, and entertained.

Impact

By putting users in control of their experience, imaginARi enhances tours with greater interactivity, immersion, and depth.

Role

UX designer, Augmented Reality UI designer

Time

3 weeks

Task

Design a multi-platform app, and paired website

Tools

Figma, Miro, Google Drive, InVision, GitHub, Visual Studio Code

Empathy

Research

My team deployed a survey focused on respondents' familiarity with augmented reality (AR) technology, level of interest in guided tours, familiarity with ghost tours, interest in history, and willingness to participate in a follow-up interview.

 

From our 90 respondents, we conducted 14 in-depth interviews to dig more deeply into users' interests in, and concerns about, guided tours. Even at this early point, we were very interested in using a ghost tour as the eventual prototypical example for our case study, so we wanted to know about concerns they had with frightening media - such as ghost tours - as well as worries about AR.

"I remember putting on the headset, and ... I heard something like down the hall. like kind of like growl. And I had to take it immediately off. I was like, this is far too real."

Laura

"... You kind of need somebody who's able to, like, dust it up a little bit, and tell a story in a very interesting way."

Mary

Understanding

After reviewing our interview notes and constructing an affinity diagram, we identified some major areas of interest and concern among our respondents and potential users. Chiefly, users wanted to feel comfortable and safe, even and especially when they were enjoying exciting, spooky content.

s10 - affinity diagram.jpg
Likes to really explore the story that's happening
Very much into immersion
Liked being able to orient himself with maps or context clues
Very scary; separated from friends in Haunted House
Loss of control brings anxiety
Doesn't like when her sight is overwhelmed
It's about the storytelling for him
Likes the feeling of being a part of a story/game

User Persona

Having established common concerns among potential AR tour-goers, we created a

 

Our user persona exemplified many of the core desires and concerns from our research. "Ryan" wants to have an excitingimmersive experience with his children, but knows that he will need a way to anchor himself and his kids to avoid being overwhelmed and overstimulated.

preso s10 - user persona .png
Empathy

Definition

Defining the Problem

We wanted imaginARi to address Ryan's concerns specifically, but also the general concerns of all the users represented by Ryan.

Users both need new, exciting experiences, and require a sense of control and safety in order to be entertained, educated, and involved - rather than afraid.

To address this problem, imaginARi will be a form of educational entertainment that allows users to adjust their level of immersion, pacing, and triggering content. Our app will help users curate their own customizable adventure that's both immersive and engaging, without being overwhelming.

Project Goals and Priorities

At this point, my group had identified our example user, as well as the core problem we want to address with our app. With some general directions in which to point our efforts, we were ready to begin the process of brainstorming and ideation.

Definiton

Ideation

Brainstorming and Feature Prioritization

We used the "I Like / I Wish / What If..." framework to brainstorm features for imaginARi. We were highly productive, with dozens of suggestions focusing on users' ability to immerse themselves just enough into a guided tour's storytelling experience. In addition, we took inspiration from other forms of tour-, AR-, or fright-based content, such as local ghost tours, augmented reality experiences, and scary video games.

In prioritizing the direction of our app's ideation, we unfortunately had to limit ourselves to some levels of current or near-future technology. We did not, for example, pursue the more complex suggestions of enacting time travel, or guaranteeing a verifiable supernatural experience. However, we did take inspiration from those suggestions to inform our later designs.

Some key takeaways from our first rounds of ideation included:

  • Adding a tactile component to the AR experience - such as a chill breeze or tingle down one's spine

  • Theorizing a network of kiosks at the start point of imaginARi tours, from which users could rent AR equipment

  • Grouping tours by theme and proximity

  • Managing what content a user experiences both before and during the tour

We decided to proceed in those directions to keep our design relatively grounded, while still operating on the assumption of a currently nonexistent widespread network of AR equipment rental kiosks.

Multiple sticky notes from the Miro app with different colored stars on them. The sticky note reading "ghost/wizard stuff AR walking tours?" has the most stars.
A feature prioritization matrix with multiple sticky notes in the four quadrants of high/low complexity vs. impact.

Value Proposition

Ultimately, our research and ideation led us to a value proposition for imaginARi based on creating gains for tourists:

imaginARi is the future of the past.

Our app syncs with devices that allow users to fully immerse themselves in memorable experiences that can be shared with others. We let users control their level of thrill through customizable adventures all at the tips of their fingers.

A value proposition canvas demonstrating what gains can be created and what pains can be relieved by the app

We believe our app - imaginARi - has the potentially to relieve a tremendous amount of user pain, and provide unique gains to tourgoers.

Pain Relievers

- Control your level of engagement

- Easily access AR gear

- Make history more entertaining

- Dial in your preferred level of spookiness

Gain Creators

- Customizable level of immersion

- Control the depth of the tour's information

- Education and entertainment

- Multi-sensory experience

Products & Services

- Immersive ghost tour experience

- Escape from reality

- Engaging history lessons

- Rentable AR equipment

Ideation

Prototyping

User Flows

I was primarily focused on the most interesting feature of our app proposal: the augmented reality. My colleagues focused on the user flows for downloading the app, searching for a tour, and reserving a time slot and AR equipment.

Parts of the mobile app mirrored the AR experience; however, the AR experience was always intended to overlap with the tour itself. Because of that focused scope, the the user flow for the AR experience focused on a user selecting the correct tour, synchronizing their mobile device and AR equipment, and customizing their experience within the AR interface, while on tour. For the development of the AR flows, I was able to take for granted that a user had been able to locate and reserve a tour slot, and I appreciate my colleagues' efforts to make that process a smooth one.

A dimmed background image of multiple user flows for the app
The user flow diagram for booking a tour
A sitemap of the imaginARi site, broken into About, Tours, Technology, Help, Contact, and Regulations
The user flow diagram for managing saved tours

Sketches

In sketching initial designs for the AR prototype, I had to change my baseline assumptions of what constituted the "screen." Obviously, the purpose of augmented reality is to view reality - and then augment it. The screen has to be the user's field of vision within whatever device they're using for AR visuals; in this case, I'm operating on the assumption that users will be renting AR goggles from one of our proposed kiosks.

Meanwhile, my colleagues created a few initial designs for the mobile app - where users search for tours, make reservations, and set their preferences for tour content and spookiness. We played with a number of designs, with several focusing on the theme of ghost stories: dilapidated signposts, ghost iconography, and so forth. For the most part, however, the prototypes were more general-purpose than ghost-themed, as we see imaginARi as an app platform which could support a variety of tours.

In the sketches below, the full expanse of the paper is intended to be the user's field of view, with physical objects sketched in black, with highlighted AR elements.

Mid-Fi Prototype

For the mid-fi AR prototype, I specifically wanted to make use of the AR platform as a way to enhance and overlay upon reality, while allowing for a minimum of necessary inputs to navigate through the AR experience. In particular, we needed to account for people who might become overwhelmed while taking a ghost tour, so we needed content controls to be easily accessible through the AR interface.

To navigate the AR interface, I imagined users' mobile devices - or a simple rented controller - could provide the necessary controls. This is a tour more than a game, and gestural interfaces with gloves or VR-type controllers are either tiring or tedious to work with long-term. A simple four-direction navigation could suffice the AR UI, shown here in the lower-left corner of the screens, with additional buttons available for tour information and group management.

I tried to preserve the purple color scheme throughout - given that purple is well known to be the color of futuristic technology - and used green for highlights, as an indicator of spookiness going back decades. Given that the design was intended to work with groups, I tried to emphasize ways in which users could connect with other members of their tour group within the AR experience itself.

Prototyping

Testing

Mid-Fi Testing

Testing our designs - website, mobile, and AR - led to a number of realignments on our design. Several comments from users inspired us to improve the flow and accessibility of our prototype for the high fidelity iteration. Here are some highlights of the commentary:

  • Add tutorial / introduction screens

  • Clearly indicate how the controls operate in the Figma prototype

  • Get rid of the border highlights

  • Re-do the content controls - having both toggles and sliders is annoying

The first round of testing led to a number of comments and revisions

Ideation, Part 2+

We made a variety of changes to improve the user experience, based on a few rounds of testing feedback.

In the mobile app, we focused on creating a consistent visual style with a more constrained color palette. That feedback also led to be abandoning the magenta focus highlight for the AR prototype. We also made certain to smooth out a few mobile interactions which weren't coming across as we'd assumed; for example, this caret was intended to indicate that the field was horizontally scrollable, but users interpreted it as a tappable element instead. Removing it brought attention to the next icon and its cut-off text, which more clearly implied horizontal scrolling.​​​

preso s11 - lo-fi sketches 3.png
preso s13 - midfi prototype 3.png
s47 - hifi mobile 1.png

For my focus on the augmented reality portion of the app, testing was highly beneficial, leading me to a number of revisions:

  • Organizing tour events into "chapters" improved the storytelling of the prototype, and gave a sense of linearity that was helpful for both the user experience and for design

  • Chunkier arrows for the rotating UI menu were heavily preferred over the sleek designs

  • Some sort of introduction or onboarding to the AR experience was necessary

  • Positive confirmation that the user has completed all objectives / located all clues

Overall, it was encouraging how many test users were enthusiastic about the prototype.

The below screenshots from Figma illustrate the changes between pre- and post-testing prototypes, as well as some magenta-colored note. As you can see, the later version added introduction slides, area-specific content, and cleaned up the information architecture.

A Figma app prototype with unattached sections and minimal organization
A Figma app prototype with numerous connecting noodles, notes in magenta text, and new sections
Testing

Hi-Fi & Final Thoughts

Hi-Fi Prototype

Our final prototype incorporated multiple rounds of testing, feedback, and iteration, and represents the best options for the app during the design period. An enhanced onboarding experience, smooth searching and reservation, and a simple, immersive AR experience combine into a case study prototype I believe very effectively shows our skills and design process.

preso s1 s15 - AR opener.png
preso s1 s15 - mobile landing.png

Next Steps

While imaginARi has come a very long way, there are still a number of improvements and expansions to be made. We assumed the presence of AR device rental kiosks, and such a core part of the business model could certainly use some attention. Expanding the gamification of the app - such as badges, points, or other bragging rights from tours - could improve the social experience of using the app, as well.

Final Thoughts

This project was a tremendous learning opportunity, particularly in matching the multiple modes of interaction between website, mobile app, and augmented reality experience. While there were a number of communication issues and disagreements early in the design phase, my team was able to overcome those hurdles and develop something truly interesting. And, thanks to this project coming at the end of a UX design bootcamp, we were all very experienced at anticipating and wrangling scope creep.

Hi-Fi & Final Thoughts
bottom of page