AR guide for a Rock n Roll Museum
For Interaction Design course in college, my team of 4 had to design an experience for RockX- a Rock n Roll museum. Four elements of this project were a website for the museum, a mobile app for a BYOD (Bring Your Own Device) experience inside the museum, a website for museum management and a mobile app for museum management. Design of each element was handled by one individual within the group.
MY ROLE : I designed the customer-facing mobile application.
UX METHODS: Personas, Journey Map, User Stories, Conceptual Matrix, User Flows, Sketches, Wireframes, Rapid Prototyping
YEAR: 2020
DURATION : 1.5 months
TOOLS USED : Adobe Illustrator, Adobe Photoshop, Axure, Unity, Vuforia Engine
Final Design
The RockX Museum App assists the visitor in their RockX museum journey, guiding them through the exhibits using Augmented-Reality-enabled navigation, informing the visitors about each exhibit and enabling them to purchase merchandise relevant to the exhibit.
Visitors at the museum can transfer their existing plans from web. If a visitor does not come with a plan, he can also create a new plan in the app.
The RockX Mobile app has special features for live events at the museum such as ability to live stream events, share it with friends, and auto-generate lyrics in the stream.
While on the guided museum tour, the RockX Museum App provides contextual entertainment to the visitor relevant to the exhibit. Visitors can take a selfie with the guitar and make album covers starring themselves.
I prototyped the “Selfie feature” using Unity and Vuforia Engine.
Design Brief
The design brief is to design a mobile app which would serve as a digital guide for visitors inside the RockX museum. The Minimum Viable Scope for the mobile application is as follows:
Use case 1:
Visitor has a plan transferred from the web to follow during their visit.
Use the plan as the basis for guiding them through the museum
Use the mobile to explain the exhibits as the visitor moves through the galleries
Mobile can be used to provide AR supplemental content for an exhibit (music, video, history, relationships, games etc.)
Use case 2:
Augmented reality during a live event at the museum such as
Concerts
Workshops
Share and stream to your friends
Purchase items related to what you’re learning about while in the exhibits
Event or workshop tickets
Music (CDs and downloads)
Physical stuff (T-shirts, coffee mugs, books, posters)
Use case 3:
Visitor does not come with a plan
Help them quickly build a custom visit plan that can flow into use case 1
Pick the most important parts of the web scope plan builder and include in mobile
-One-
Personas
Five different personas were made keeping in mind the overall experience for RockX- a Rock n Roll museum (B2C - Business to Customer side and B2B - Business to Business side). Below is one such persona relevant to the B2C Mobile application.
John Smith, 26 Years Old
Recently moved to San Francisco. He is an aspiring musician and keen on exploring the music history of the Bay area.
Empathetic need:
He wants to look at some of the guitars of artists he admires
He wants to learn more about other artists’ journies and feel inspired after visiting the museum and live concerts
Wants to purchase rock n roll merchandise as memorabilia
Goals:
Quick and easy way to navigate through the museum
Wants to learn more about rock n roll and how it has evolved over time.
Wants to share his museum experience with friends
-Two-
Journey Map
The journey map for RockX Museum describes, step-by-step, how John will interact with the service right from the discovery of the museum until the end of his visit. The process is mapped from John’s perspective, describing what happens at each stage of the interaction, emphasizing on his feeling and thinking at each step, The journey map also notes the web and mobile touch-points which are involved.
-Three-
Conceptual Model
The Conceptual Model framework optimizes the design by having the least amount of screens and more concise navigation flows. The conceptual model includes Object-Action Matrix, Object Attribute Matrix, and Prioritization Matrix. The conceptual model defines the backbone of the design.
Object Action Matrix
The goal of the Object Action Matrix is to minimize cognitive load. The Object Action matrix is derived by first identifying objects and actions from the user stories and then refined and made more concise by clubbing similar objects and actions.
Object Attribute Matrix
Prioritization Matrix
The Prioritization Matrix helps determine which tasks are important. The tasks are bucketed in terms of frequent/Rare visits as well as by the number of people viewing it(by many/by few). The first quadrant (Frequent visits and by many) has the most important tasks and should have the highest priority with easy access and condensed navigation flows. The Prioritization matrix influences the navigation and flow of the mobile application.
-Four-
Sketches and Experience Flow
After finalizing the Conceptual Matrix, it was time to sketch out and explore the experience of the RockX mobile application. The Experience flow required multiple iterations until it was reduced to the minimum number of steps.
Exploring three different ways to visualize the Conceptual Model
Before beginning the sketches of individual screens, it was important to figure out the type of primary navigation that the concept would have. Action oriented, object oriented and hybrid design with both action and object were explored.
In the action oriented design, the primary navigation was designed with actions like Learn, Purchase, Create etc.
The object oriented design focused on having objects like Museum, Exhibit, Tour, and Events in the primary navigation.
Action Oriented
Object Oriented
Hybrid Design
-Five-
Final Design and Prototype
AR Guided Tour with the RockX Mobile App
The final design focused on the following:
Transfer of the guided tour plan
Create a new guided tour plan
AR mode guiding them through the museum towards the exhibit
AR supplemental content Information, merchandise and entertainment for the Exhibit
While in the exhibits, purchase items like T-shirts, coffee mugs, books, posters related to the exhibit.
01
Transfer of the guided tour plan:
John has created a plan on the website before arriving at the museum
He can transfer his plan on the mobile app either by scanning his ticket or by entering the ticket code.
02
Create a new guided tour plan:
John can also create a new plan by choosing from existing tour plans curated by the museum.
He can also create a new custom plan that aligns with his interest.
03
AR mode guiding them through the museum towards the exhibit
The AR mode guides John by navigating him in towards his exhibit in the museum. The AR mode has a feature to switch to the map view, which will give John an idea of where he is within the museum.
04
AR supplemental content Information, merchandise and entertainment for the exhibit
Once John reaches the exhibit, the app will show:
Information about the exhibit
AR supplemented game unique to each exhibit
Explore music audios and videos related to that exhibit
While in the exhibits, he can purchase items like t-shirts, coffee mugs, books, posters relevant to that exhibit
05
At the end of the tour
John can view the summary of his tour. His experience is also emailed to him.
He can view the items that he added to his shopping cart and can collect it from the gift shop at the museum.
He can also view the songs that he listened to on the tour, the selfie with the AR Guitar that he took while at the exhibit.
-Six-
Feedback and Reflection
The final prototype was created in AxureRP and presented to the whole class with external reviewers.
External reviewers as well as Professor Rosenberg gave valuable feedback on the prototype with suggestions of enhancing certain features in the future. The AR features in the concept were very much appreciated while “create a custom tour plan” needed further refinement. In the future, features like live streaming the concert or workshop can be fleshed out further by adding a live chat feature. The payment feature can be added to the current “purchase a merchandise” experience.
The usability testing was not done for this prototype as it was not in the scope of the project.
