Designing an app to improve the user experience of CosmoCaixa museum — UX Case Study
The Scope
This Case Study shows my final project for the UX/UI Bootcamp at Ironhack. The objective was to design and produce an interactive MVP prototype of an app/website of our choice in a 2-week time-frame.
I’m glad to say that this project was selected by the jury as one of the 3 best projects and was showcased in the Ironhack Hackshow.
The challenge
For this individual project, I decided to take the challenge of improving the visitor’s experience of the CosmoCaixa Science Museum. Not an easy challenge I must say, since the museum hosted 1 million visitors in 2018, it was rated with an overall experience of 8,97/10 by users in the Permanent exhibition evaluation report and having in mind that the problems must be solved using an app.
Note: This project was done before the reforms made in the museum during 2018–2019 and the opening of the main exhibition in 2019. CosmoCaixa was not involved in the process of this project.
Research
How to improve something that is working well? It was very clear to me that solid research was the only possible way to find those pain points and needs that could translate insights into opportunities. I had no initial hypothesis, so it was crucial to establish a well-planned research strategy.
I decided to stage it in 3 phases. First, an observation session and shadowing of users through the museum, as well as guerrilla interviews, with the objective of start finding possible pain points, users motivations and get the first insights.
First pain points detected:
-
Users rarely read explanatory texts in the exhibits.
-
Sometimes they don’t understand them or don’t know what they have to do in the stations.
-
This lack of understanding often leads them to not finishing the tasks or only partially finish them.
With the previous data, in the second phase, I was able to better focus the target, narrow my research, deepen insights and problems. For this, I conducted 6 semi-structured interviews with my target audience.
“The instructions where confusing. Sometimes we didn’t know what we had to do."
“The itinerary inside the museum is not well defined. Sometimes I felt disoriented”
“We missed one activity because the starting hour was not clear and we didn’t get there on time”
“Information is not very accessible. There is not an intuitive way to find it”
All the insights extracted from the interviews, where cross-checked with the quantitative data published in the CosmoCaixa’s Permanent exhibition evaluation report and the CosmoCaixa General report from 2018.
Research conclusions — Defining a User Persona
These were the 3 main conclusions from the research process:
1. The information regarding the activities was not easily accessible.
2. The indications to orient visitors inside the museum could be improved.
3. The instructions and explanatory texts in the exhibitions were sometimes confusing.
Checking the visitor’s profiles, the reasons and motivations to visit the museum, and the problems and objectives detected, I defined my user persona.
Here some quantitative data also used to complete the user persona, extracted from the reports mentioned before. In 2018, 57,02% of visitors came as a family activity, 37,44% in ages between 36–45 years and 49,94% where women. 28,29% have an education in the humanities fields.
CLARA, 42 years
-
Journalist.
-
Visits the museum twice a year.
Goals
-
Enjoy a family day in a controlled environment where her daughter can learn.
-
Being able to transmit more knowledge and enrich the experience of her daughter during the visit.
Frustrations
-
Finds the information not intuitive and accessible.
-
She feels disoriented in the museum and sometimes doesn't know where to go.
-
Missing activities due to lack of information.
Problem statement
The CosmoCaixa visitors need a tool where to check the available activities before and during their visit, receive instructions in the exhibitions and that helps them orientate inside the museum to enjoy a better and more enriching user experience.
Features and prioritization
The first decision I had to take was on which platform to carry out the MVP prototype. It was easy to decide that it had to be an app for smartphones.
First Storyboard for concept testing, showing the main features.
The concept testing provided me with very valuable information. With this storyboard, I could test a first user journey and the main features: the ticket system, the customization of the visit by organizing your activities, the augmented reality guide, notifications and instructions during the exhibits.
With a Bluetooth beacon system, we could detect when a user approaches a station, so the app could automatically provide information about the experiment and instructions using simple animations (in the future, adding an augmented reality layer).
Users loved it!
Must do
-
Check exhibitions and activities
-
Customize the visit
-
Indications inside the museum
Should do
-
Interactive explanations
-
Notifications
-
Purchase and manage tickets from the app
Could do
-
Voice commands for orientation and explanations to improve accessibility.
Full disclosure: Although at first the idea of managing the tickets with the app looked like an easy feature to add because there is already a scanning system in the museum for tickets we could use, the reality was that it made no sense for users unless they could buy the tickets for the activities with the app. For this reason and due to the 1 week I had to ideate and design, I decided to move the feature to the next sprint because of the level of complexity it was adding to the project.
Creative Concept
CosmoCaixa has its own brand colours which I tried to adapt to. In their guidelines, they accept to use dark backgrounds with intense light blue over them. The Creative Concept I decided to use for the High Fidelity was Universe and exploration, a look into the future which responded very well to the core values of innovation the museum has and the new exhibit.
Accessibility was something I wanted to have in mind, so the colours were slightly modified to pass every WCAG AAA test in all possible combinations.
Prototype
The main flow Clara, our user persona, would follow for this prototype is:
-
Enters the app.
-
Searches through the different exhibits available.
-
Checks the activities.
-
Filters them by date and hour.
-
Selects the ones she wants to program for her visit.
-
Once in the museum, she is notified that one of the activities is about to start.
-
She asks the app to guide her.
Testing and Iterations
I tested the prototypes six times in each fidelity: low, medium and high. From these tests, I obtained a lot of improvements for the project. I will show a couple of them.
Some wireframes in low fidelity I used to test the App navigation
The navigation was working very well in low fidelity. The major problem I found in tests was with the Tab bar, so I decided to use the mid-fidelity to test the icons until we got to a point that users would understand what each tab contained.
Mid-Fidelity Iterations
Here you can see some changes result of the iterations with users in mid-fidelity. The calendar selection was removed because it was not really necessary for the users since they wouldn’t plan with months in advance their visit to the museum. Also, the segmented control was changed for something that users found more intuitive, as well as some of the Call To Action buttons.
Error screen and animations
On the left, an example of an error screen showing what the user would see when the connexion is lost. On the right, the animation screen, which would be the way to provide users with more interactive instructions of what to do in the different stations of the exhibit.
Next Steps
-
Add the possibility to purchase and manage tickets from the app. This idea had to be dropped from this first MVP, as I mentioned before, but still would be a feature that user would appreciate for two reasons: reducing the lines and waiting times, and being able to buy tickets inside the museum without having to go to the entrance.
-
More interaction with exhibits, adding Augmented Reality layer to exhibitions. For this MVP, I focused on one particular target, but this feature would open the range, making it more interactive for all users and bringing a more gamified experience.
-
Improve accessibility. The App is a good scenario where to develop features to improve the accessibility in the museum.
-
Establish Key Point Indicators to measure the impact of the application and usability for future iterations.
-
Iterate with users. Keep testing, keep evolving, keep improving!
Copyright © 2020, Carlos León