top of page

Tablet Game

Case Study

UI/UX Design

Autumn 2023

Screen Shot 2024-01-21 at 11.21.14 AM.png
arrow.png

INTERACTIVE PUZZLE DESIGN

INTERACTIVE PUZZLE DESIGN

1

PROJECT
PROJECT

Under the visionary guidance of Annuska Zolyomi, a respected professor at the University of Washington Bothell, and her creative students in B IMD 491: Integrative Studio Practicum I, an exciting new chapter unfolds for the Edmonds Museum. With design choices entrusted to the students, this project sets out to re-imagine the museum experience, blending imagination and innovation. 

PROBLEM

Museums can often be repetitive or boring to some people. This can lead to fewer people visiting or revisiting a museum. 

SOLUTION

In my vision for museum transformation, I propose an innovative solution to combat repetitiveness and enhance visitor engagement. By introducing gamification elements, and providing personalized experiences through interactive touchscreens, museums can become immersive learning hubs. This holistic approach not only breaks the monotony associated with traditional museums but also fosters a sense of excitement and anticipation, encouraging visitors to return for new, captivating discoveries each time.

2

METHODOLOGY
METHODOLOGY

2.1 Interview & PACT Model

In our mission to delve deeper into the essence of the Edmonds Museum and its aspirations, we were fortunate to sit down with a pivotal figure, Arnold (Arnie) Lund, the Vice President on the Board of Directors at the Edmonds Museum. Armed with a set of thoughtfully crafted questions, our class aimed to gain insight into the museum's present motivations, objectives, and envisioned future. We also sought to get valuable insights about the diverse community that visits the museum. This enlightening interview laid the groundwork for the creation of a dynamic PACT (People, Activities, Context, Technology) Model.

IMG_2209.jpg

People

  • Local Residents of Edmonds

  • Older Generations returning to Edmonds

  • Visitors passing through Edmonds

  • New Residents of the Area

  • Schoolchildren on Field Trips

  • Local Residents of Edmonds

  • Older Generations returning to Edmonds

  • Visitors passing through Edmonds

  • New Residents of the Area

  • Schoolchildren on Field Trips

  • Local Residents of Edmonds

  • Older Generations returning to Edmonds

  • Visitors passing through Edmonds

  • New Residents of the Area

  • Schoolchildren on Field Trips

Activities

  • Exhibits that draw individuals to the museum

  • Interactive exhibits draw the most attention

Context

  • impact on surrounding community / attract visitors

  • powerful capacity in storytelling

  • meaningful contribution to the town's cultural background

  • impact on surrounding community / attract visitors

  • powerful capacity in storytelling

  • meaningful contribution to the town's cultural background

Technology

  • seamless integration of technology

  • importance of braille and audio tracks for accessibility

  • technology should make museum inclusive and forward-thinking institution 

2.2 Stakeholder Analysis

Following the PACT Model, our attention shifted towards the intricate web of stakeholders within this project. With identified a spectrum of direct and indirect stakeholders, who will interact with the museum in diverse ways. We recognized fundamental values held by each stakeholder, alongside an assessment of the potential advantages and drawbacks they might encounter in their engagement with the system. These insights were then condensed into a structured table.

Screen Shot 2023-12-12 at 9.28.57 PM.png

2.3 Field Observations

To understand how users interact with museums we conducted field observations. I visited the Bellevue Arts Museum in Bellevue, Washington, and observed visitors there. The following summarizes my methods and findings.

IMG_2320.jpg

Method. In the pursuit of meaningful research on visitor engagement within a museum setting, it is imperative to select a subject of study meticulously. Once identified, it is essential to allow them to interact with the exhibits, refraining from any intervention that might influence their natural behaviors. The focal point of this study lies in understanding the motivations driving interactions among visitors, both with one another and with the captivating artwork and exhibits on display. 

Activity: Polly Apfelbaum Printmaking. There was a station set up for museumgoers to create their prints using shapes and patterns. The printing station was a few stacks of paper, chalk, and some pencils. In a box next to those was a variety of stenciled patterns that you could shade over with a pencil to create the pattern on paper. Ryan observed a pair of people at the museum play around with the printmaking station. They struggled for a moment to understand the print process, since most of the time, you would put ink or paint on the stencil and transfer it to the paper. They figured out that you place the paper on top of the stencil, and shade over it until the pattern appears. Their collaborative work helped them figure out what to do. 

IMG_301BC171F641-1.jpeg
IMG_2319.jpg

Opportunity for research and design. This activity subtly elicits a strong human aspect in the interaction which is cooperation, which has the potential to give visitors the space and opportunity to create their own personalized yet collaborative experiences, meaning, interactions with other people, and the art piece itself. This concept could be applied oppositely as well, prompting visitors to get competitive with each other in a friendly way to achieve a pre-intended goal that has been communicated to them through their initial interaction with the piece.

3

PERSONA
PERSONA

Screen Shot 2024-01-19 at 5.30.28 PM.png

To fully visualize my project and the future steps I created a Persona that will inform the rest of my design decisions and directions. I created “JODI” who is a 20-year-old student based in Seattle, WA. She is ambitious, creative, and loves to explore. She is inspired by everything around her and likes to do things that transport her to a new place and make her forget about her worries.

​

​

​

4

IDEATION
IDEATION

Screen Shot 2024-01-19 at 5.40.54 PM.png
Screen Shot 2024-01-19 at 5.41.07 PM.png
Screen Shot 2024-01-19 at 5.41.23 PM.png

At this point in the project, we were put into groups and were tasked with finding one idea that we wanted to work on for the rest of the quarter. Each member of the group came up with 10 different ideas and we presented them to each other and all decided on one. We ended up choosing a digital puzzle that would be displayed on a tablet in the museum. â€‹

​

​

My Ideation sketches​

​

5

COLORS &
TYPOGRAPHY

HEADER/TITLES

DM Serif Display (Figma)

------------------------------------------------------------

abcdefghijklmnopqrstuvwxyz

1234567890

TEXT

Mplus 1p Bold (Figma)

------------------------------------------------------------

abcdefghijklmnopqrstuvwxyz

1234567890

#EDE551

Accessibility

Buttons

#6C584C

Help

Buttons

#588157

Selective Buttons

#6C584C

#588157

#EDE551

#DBD7CD

#3A5A40

6

UI KIT
UI KIT

Screen Shot 2024-01-21 at 2.18.51 PM.png

These are the components and buttons that we reused throughout the project. The design of these components was split between my team members (Ryan Torgeson, Alex Hochhalter, and Danyl Stephan Kok) and I. We were each tasked with creating a certain part of the UI and design but we combined them all and reused them in the different parts of the design.

​

7

SCREENS
SCREENS

Untitled design.jpg

Here are some of the prototype screens. We envision this design being displayed on a tablet screen that is attached to a podium in the museum. We understand that the museum exhibits are interchangeable and aren’t necessarily fixed. We wanted to create something that could adapt to the constant changes the museum goes through. Therefore the idea of having this design on a tablet that can be moved around seemed ideal.

I created the screens for the actual game (Fig.5-8). I came up with the concept of the sliding puzzle because it blends art and entertainment and uniquely engages museum visitor’s minds. The original picture is a picture of a building in Edmonds when it was first built and the puzzle they are trying to solve is a picture of the building today. Once they complete the puzzle the visitors can compare the old building and the new one (Fig.9) and they can choose to print a postcard that has those two images.

This puzzle adds an interactive and dynamic element to the Edmonds Museum as it captures attention, sparks curiosity, and provides an enjoyable experience for people of all ages and backgrounds.

8

FUTURE STEPS
FUTURE STEPS

Prototype testing

The prototype we created has only been tested with other students in our class. To advance the design and make it accessible and enjoyable to everyone we would need to conduct more user testing on groups of people of different ages and backgrounds. This will help with the refinement of the design.

Scaling Production

To use this design in the museum we would have to rescale the design. Currently, we have 3 different playing levels but they aren’t prototyped yet. We intended to make the puzzle pieces smaller with the different levels. That would mean it would take the user more moves to complete the puzzle making it harder. This will still need to be prototyped and tested.

bottom of page