Designing a phygital experience to bring Harry Potter’s magical world to real life.

Brenda Maldonado Gutierrez
Design Globant
Published in
5 min readNov 27, 2023
Illustration by: Daniel Hosoya

A phygital environment mixes the physical space with the digital world. Nowadays the gap between these two worlds has been narrowing more and more. The expectation is that this trend will continue until the digital world is fully merged with the physical one.

There are several things that we need to consider when we are designing a phygital experience. Here you will find some learnings I’ve got from designing an experience that brings Harry Potter’s magic world into the physical world. The main purpose of this project was to create a truly immersive and multi-sensory experience by allowing the users to bring spells to real life while using a magic wand and a companion app that will let them interact with their home smart devices.

Engaging the users.

In collaboration with Google, a set of gestures of more than 40 spells was created to let the users interact with the spell-casting and dueling features. Each spell had a payoff when cast correctly. An animation on their TV, a light response, or a video. They would need to master the movement with their wands and both products were integrated to recognize if the movement was correct or not. We made up some game rules that gave them points and a mastery level for each spell they cast. This would also allow them to unblock new spells while they kept perfecting their spells. That way we ensure that they will engage with the app and never lose their interest in using the wand. We also created a dueling game where they could challenge their peers and compete against each other. Which also helps them to reach a better wizarding level. And allows them to experience a wizarding battle similar to the ones they view in the movies.

Communication is the key.

In the context of this project, multiple PODs played fundamental roles in bringing the magic to life. One team involved experts in the physical product development (responsible for the Wand product integrations), while another team specialized in the digital domain (working on the App product). Complementary roles like animators and audio designers also contributed with their expertise. Ensuring seamless collaboration among all these teams, in alignment with the product and business vision, was the key role of the experience design team, whose task was to harmoniously blend these diverse disciplines into a unified user experience. Our engagement with these diverse PODs required a substantial investment of time in daily meetings and team coordination. However, this commitment was essential to maintaining a shared vision. While each team had its share of recommendations rooted in their specific areas of expertise, the ultimate solution’s definition came through user testing. These tests allowed us to comprehend user needs at key experience moments. Therefore, the insights from the research team were essential to maintaining coherence across all PODs. The exceptional communication and cohesive teamwork were so effective that the Wand team, for instance, even recorded their own children interacting with both products, bringing valuable suggestions. With everyone participating in every stage of the process, the project was enriched and elevated to unthought levels.

Define the level of interactivity.

It is crucial to create a user journey map where you can define from where the user will receive feedback/response at each moment. Is it going to be from the digital product? Is it going to be from the physical one? Do they need a strong reinforcement that needs to happen in both products? You need to consider all the possible responses users can receive as feedback from their actions. And to define the level of involvement of each.

In this project, we had several physical elements which the user interacts with. We had:

-The phone/tablet

-The Magic Wand

-Smart devices (light bulbs, TV, speakers)

And we also had sensory elements like:

-Sound effects

-Vibrations

-Animations

-Microinteractions

-Gestures

So on each flow we designed we needed to define from where the action is going to be triggered and from where the user is going to receive the feedback. Our wireframes looked like a “storyboard” because we needed to specify the reaction on each device &/or sensory element, so the screen was the centerpiece and a lot of other things were happening around it.

Wireframe example

Using all the elements described above, we created different kinds of confirmations for the user:

1- App response: Color coding was essential in these cases. We reinforced the feedback of the message by adding a specific sound when something went wrong during spell casting. For interface errors, we used the classic color coding messages (green-success & red-error).

2. Wand response: The wand was built to have two indicators when an action is being made. They have a specific light color for error/success depending on the case and vibration to reinforce key moments.

3. Other devices: For the connection to other devices, we needed to rely on the way they communicate their status messages. So we created specific screens indicating how to check the connection status in those external devices.

Building in parallel correlated products.

Unlike a digital-only product, in a phygital project, we can’t rely on mid or high-level prototypes for user testing. Instead, we dive into the actual implementation, allowing users to interact with both the physical prototype and the digital product. This led us to undertake multiple releases, all of which underwent testing across teams prior to reaching the user testing phase. Each team member was equipped with a “magic Wand” that allowed us to engage daily with the latest version released. Our journey involved numerous meetings where we tried out our wands, playfully interacting and sharing our insights on the products and the experience. It’s worth noting that, alongside the app’s construction, various iterations of the wand were being created.

We conducted exhaustive tests on every aspect of the product interaction, ensuring a smooth integration of every feature. We thought of & defined the whole experience: from the music and interactions when a user opens the wand box for the first time, to selecting their house & patronus, and also the leveling and cast spell mastering journey. While we had a lot of other exciting features in mind for the MVP, we decided to kick things off with a simple launch, reserving some extra magic for future releases. And once the product finally made its debut, the wands disappeared from the shelves in just three weeks, selling like crazy in both the USA and London. All the hard work that the team poured in paid off. It turned out to be one of the most amazing projects I’ve been part of cause it made me realize that the real magic of design relies on a well-thought-out experience, awesome teamwork, and the love we put into our job.

--

--

Brenda Maldonado Gutierrez
Design Globant
0 Followers
Writer for

Visual & Motion Designer @Globant Mexico