Problem to be Solved
A crowning item at the Stift Klosterneuburg Museum is the Babenberger Family Tree. This royal family's history is documented on a 26 feet wide triptych. The problem is visitors have a hard time seeing all the details as it is so large in size. They also can't delve into the history of the painting because there's too much to display it all on traditional static side plaques. 
Solution
Create a multi-touch table top application which would allow visitors to get a dynamic and immersive way to explore the history and details of the painting. 
Team
I worked on an international team comprised of 6 people. The team had graphic designers, programmers and UX designers.
Primary Roles
UX/UI Designer and Project Manager
Behind the Design
Creating the Concept
To come up with the concept, I first did some competitive research on other multi-touch table top applications. I also helped in interviewing the client and figuring out the wants and needs. We then met as a group and used the findings to help guide our brainstorming session. 
Prototyping and Testing
We did three rounds of testing. The first was with a prototype me and the other UX designer created using Figma. The second was with a fully coded application. The third round was done in the museum with actual visitors and you can view a compilation of the third round of testing down at the bottom of this page.
Ideating​​​​​​​
One major change we had were to the design of the pop-ups. We wanted to get the design as minimal as possible so all focus could be on the image in the pop-up. To do this we got rid of the outline on the exit icon. We also removed the dragging icons on the sides as they were deemed unnecessary from testing.

Before

After

Another major change was how we highlighted the important Babenbergers. We wanted to bring focus to 6-8 major Babenbergers to help guide visitors to a starting point. We originally used a dot burst because we felt this would bring attention without covering too much. They took away from the aesthetic of the painting though so we changed the highlight to a subtle glow.

Before

After

The last major change was how we displayed the history behind the image in the pop-up. We started out with using a button which when tapped, would drop down with info. This button was put at the top of the pop-up so the information ended up covering the face.  This looked awkward and took away from the focal point which is the person. We then moved the button to the bottom so the faces wouldn’t get covered. Then instead of a rectangle, we filled information into a half circle for a cleaner appearance.

Before

After

Outcome
From the final round of testing we discovered how famous this painting truly is to Austrians. They loved getting to explore the history of the painting and see the details up close. Below you can see a video of the final testing. 
The application was used in the St. Leopold Exhibition in 2019 to supplement the actual painting. It will also continue to be used as a replacer for the actual painting when it is unavailable for viewing. You can read more about this project in the following news article
Back to Top