Creating Immersive Experiences

The topic of black holes offers a great opportunity to learn about something fascinating yet often misunderstood. We liked the challenge of visualizing a physical element that has only been photographed once.

Approach

Since no one on the team knew something about black holes, we did a lot of research to understand the subject in its complexity. The question of how we visualize something of which so far only one picture has been taken accompanied the project through to the end.

Result

Nova is a 5-10 min interaction where you can learn how a black hole is born into our universe, how it grows, evolves, and then dies by releasing all of its energy. Thanks to the use of gesture interaction visitors will be able to feel like they are in space and also understand how the laws of physics are challenged by the black hole.

Timeframe

April 2020 - July 2020 (11 weeks)

My Role

Research, UI, Prototype

Process

The topic Black Holes offers a great opportunity to learn more about something yet so fascinating and still not very well understood. From that point we liked the challenge of visualizing something of which only one picture has been taken so far.

Discover

At the beginning of the project, we barely knew anything about black holes.

By the end of the project, we acquired a lot of knowledge about this topic.

Research

As a result of our research on black holes, we have discovered many subject areas that would be interesting for the purpose of our project. But it quickly became clear that it would go beyond the scope and that there is too much information. That is why we decided to narrow down the subjects.

Visualization problem

With advanced knowledge, we have understood more and more how deep this topic is. The building complexity made it difficult for us to accumulate the information, so that we spent a large part of the ideation phase in creating a system that made sense for us. Our understanding of black holes before the project was very limited, since we all had only superficial knowledge. For example, it was the case that we assumed all black holes to be a stationary point since we didn’t read anything different than that. As it turned out, all black holes are rotating points around themselves.

How do we visualize something of which only one photo exists?

We had to discover many visual styles to get a feeling of what was going well and what should be avoided.

Summarized Research

We have divided the four final subject areas into four of us in order to build up a more in-depth knowledge of one topic and to have one expert per topic.

Define

Concept Definition

Knowing which direction, the project should move into and defining a common vision should support us in the further process of following a common line in the current remote situation. This is how we created our project concept:

We defined our target group for a possible exhibition. In addition, we created a list of important terms that will guide us on the way to our vision.

User:

Since black holes are a complex topic to understand, the concept of this exhibition is primarily aimed for adults and those who are willing to invest a little more time in the exhibition. This can be limited to the “experts” who stay in the interaction for about 10 minutes and the “flaneurs” who only have a quick look around, this can take them around 30 seconds.

Information:

At a point in our process, we didn’t know about the death of black holes. After reading about this topic, we built it into our content structure with one that now consists of formation, types, anatomy and death. These four subject areas gave us the opportunity to create an interesting storytelling.

How:

We made use of a list with important key words to move the project as a team into a common list:

  • Immersive

  • Experience

  • Fascinated

  • Trip

  • Mind blowing exploration

  • New visualization

  • Accesibility

  • Understandable

Affinity Diagram

After our subject areas were determined, even more detailed research of the topics began and we collected the most important terms for each topic.

These should serve as a further basis and a safeguard that we are moving in the right direction. It also helped us to build a detailed overview to understand the subjects better.

Storytelling

By collecting the main terms of the different categories, we were able to identify similarities and overlaps. We used this knowledge to mix topics for our storytelling in order to build a clearer narrative structure for the complex topic. We merged the topics of anatomy and types, which resulted in a division of three larger blocks.

When looking at the current overview of information, we decided not to add any further historical information about the findings of black holes. Either the storytelling would be too long or the information that the user would have to record at one time would be too much.

First Ideas

Early in the process we started with the ideation for our exhibition concept.

Because our topic is very scientific and complex, we wanted to ensure a whole immersive experience. Another point to consider was to make the exhibition interesting to lure the visitor into our interactive communication system. This lead us to creating a whole atmospheric experience from the entrance to the exit.

In front of the entrance we pictured some kind of teaser for our exhibition. The visitor should get little information about what is waiting inside for him.

The entrance tunnel is supposed to convey the feeling of going into a black hole. Through that, the visitor is already in the mood for a space experience.

After getting inside the black hole, the visitor arrives in the big main room. Here we were thinking about big screens or projections to show the impressive phenomenons of space.

After the great experience with our interactive system, the visitor is guided out of the exhibition through a similar tunnel like the entrance to round off the overall experience.

Decide

Information Architecture

We now had to build the previous results process into a clearly structured storytelling. It offered us the course of a black hole’s life, i.e. from birth to death, to be used as a frame model. In between we explain the behaviour of black holes, what types there are and how they are structured.

The construct enables us to build a linear story and it becomes more accessible for the user to understand the complexity of the topic.

Exhibition Concept

Ongoing from our earlier ideation, we went deeper into concept sketches. We specified our imaginations of the whole immersive tour and started ideating about how the main room could look like.

We already thought about the quantity of screens and how the transitions could look like.

In order to check as a team our preferences, we did some voting sessions to go more into details every meeting we had.

User Interface

In furtherance to define our style of visualisation, we did some research for inspiration.

After our voting and rating sessions, we agreed very quickly on what we liked. The style we preferred the most was very simple, with clear lines and shapes. The whole UI is in dark mode accordingly to the spacey feeling.

In order to bring some spark into it, we decided to work with colorfull gradients and highlights.

In the Post Its we included the insights we liked from each one of the examples (i.e easy to understand, attractive...).

Prototype

First sketches

Starting with the prototype step of the design process we created some very quick sketches of our ideas for information visualisations and interactive concepts. This way we were able to discuss our understandings of visualisations and agree on some of the shown sketches.

In the next step we specified our sketches for the storytelling. With those paper wireframes we were able to get a better understanding of what is easy to understand, what is complex, and what has to be totally redone.

Paper Wireframes

Now we created paper wireframes according to our information architecture to define the storytelling even better and get ready for the next steps of wireframing.

Digital Wireframes

In order to create the low-fidelity wireframes, we defined templates, a low-fi styleguide and a grid.

With our low-fi wireframes, we kept to principle: “keep it simple”

We used white as a highlight and put everything else in white with 70% opacity, to achieve a greyish look.

Our grid was meant to have the visualizations and descriptions in the middle. The top bar is for the timeline of the storytelling and the bottom bar for our first ideas of interactive parts and historical facts.

Additionally, we always put a minty text below the wireframe to explain what is shown in the wireframe. The yellow texts below described the ideas we had for possible interactions.

Final Screens

Exhibition Concept

We wanted the atmosphere to give you the feeling of being in space. But it still should have something to do with black holes. Besides a huge projection, we wanted to present an exhibit to explain the singularity in a haptic way.

In order to check how the distances should work in our main room, we were doing some real testings of the distance and heigth of the user in comparison to the wall.
That way we were able to determine the size and position of the projection.

Interaction

As mentioned before, we are using gestures as the interaction concept to controll the projection. The sensor, for gesture recognition works by detecting heat — since our room will be very dark besides some of the space projections going on as a background.

The reason for gestures instead of using a controller is to let the visitor feel as free as possible. (remember the user will be in space!)

As for the gestures we to reduced them to few as possible. Our interactions contain “click”, “drag and drop”, “zoom in”, “rotate” and “swipe”.

That way we can ensure a great variety of interactions, while keeping it as simple as possible for the user.

In order to read the gestures, there will be a leap motion reader situated on the floor in front of the person.

Exhibition Walkthrough

For the entrance we wanted the visitor to experience the feeling of going into a black hole. The stripes would be pulsing at the right speed to imitate the spaghettification process you would undergo in reality.

After the tunnel, you will get into the main room. There will be the exhibit of the singularity and a marked spot on the floor. The pressure sensor below will recognize the visitor and activate the projection on the wall to start the very first screen of our interactive system.

The animations and interactive parts of the projection will guide the visitor throughout the life of a black hole. Every important detail will be explained and visualized, to guarantee an informative exhibition. Through the gestures, the visitor is able to control the speed and variety of the interactive system.

Before leaving through a similar tunnel-like before, the visitor can have a look at the exhibit of the singularity, which gives a haptic explanation. The rotation and spinning of the coin towards the hole in the middle until it falls into the “infinity” – that's how a singularity works.

Result

Learnings

We each had different backgrounds and brought different skills to the team. We took advantage of this very early on in the process and made use of the strengths of the individual team members.

As a result, we unfortunately did not work on the things that we would like to learn, but we were able to upscale the possibilities of the various tasks. This also pushed us to the limits of our ability, which enabled us to learn a lot in our specializations.