Inspector Clementine – Cooper Hewitt App

In Designing Meaningful Interactions, ITP

I’m teaming up with my classmate, Yurika, to create an digital experienced based on the Cooper Hewitt collection. We’ve decided to build a scavenger hunt game targeted at children to make the Cooper Hewitt collection more engaging and relevant to them.

 

Concept

The game will take place in Central Park, which is at the door step of the museum, and will challenge kids to help Inspector Clementine solve the biggest theft in the history of the Cooper Hewitt. We are playing with two different plot lines… currently we’re set on Story 1 but are still considering Story 2:

 

  • Story 1: Modern design artifacts from the Cooper Hewitt museum have been stolen and scattered around Central Park. The beautifully colored items are camouflaged inside the park. Scan the area and spot the right colors and find the stolen items.
  • Story 2: A thief has stolen all the color from the Cooper Hewitt museum! Find the right colors for each item and recolor them!

As you’ll see with the screens we mocked up below, the user would be presented with a color palette and a part of Inspector Clementine’s story. They will have an allotted amount of time to find the matching color in the park, and once they do, it will award the user with a badge and show them the item they helped to save. Lastly, and most importantly, with each item a user finds, they help Inspector Clementine along on his journey to recover all the stolen items. Each item that’s found will be saved to the user’s “collection box” which they can refer back to at any time. On the games completion, the user would be presented with their results but also some sort of prompt to go the museum to get their reward (i.e. some fun physical badge or sticker for their work, as well as a free ticket for the child).

 

The game was originally going to be for tablet but since users will be in the park and need a data connection, mobile phones proved to be the right platform choice.

 

Audience

Our target audience is children, but more generally, families with children. So many families spend time in Central Park with their young children and we want to take advantage of their time spent there and make the park an extension of the museum. The goal is to have the Cooper Hewitt be another stop on their family day, making it an activity that’s fun for parents and young ones alike.

 

Screens and User Flow

The interface for the game will be quite simple. Firstly, on the open of the app, the user will be presenting with a title/splash screen for the game, which will transition into a very brief introduction into the game. Once the user starts the game, they will immediately be presented with the first Product modal screen. In the sketch below, you see the actual item being display but we’re actually only going to provide the user with the color palette of the item and the part of the story there on here. The item will be revealed to once they find the matching color in the park. There should also be a button on this screen that let’s the user commence the search for that item. Once they press that button, the modal screen will animate down and collapse into the palette bar at the bottom of the screen. The palette bar allows the user to easily expand the product modal back up and also quickly reference what colors they are looking for.

 

The product modal will reveal the live camera feed beneath it. When a user is looking for a specific color, all they have to do is capture the color within the frame of the camera feed and the app should automatically recognize the color match. Once it’s found, there will be a “success” overlay that reveals the item, awards a badge of some sort, and allows the user to continue to the next phase of the story. In the instance that the user doesn’t complete the task in time, they will be returned back to a new task upon failure.

 

IMG_19943

 

Here is a more in depth look at flow of the application. You can see the cyclical nature of the flow simply by looking at it.

 

Scavenger

 

 Timeline

Week 8: Start digging through the API and make clearer design decisions, wireframe, start coding
Week 9: mid-review, continue coding, first design iteration
Week 10: refine design, create animated design prototype, continue coding
Week 11: complete coded prototype – user testing
Week 12: final review

 

What does success look like?

Yurika and I both think it’s feasible to get a very refined interface design, along with an animated mock up of the designs, to provide some clarity on what the production level experience of the app would be. However, in parallel, we’d also like to push our actual coded app prototype as far as possible. Realistically, we wont get it to behave exactly like the designed prototype but should be able to:

  • test it in park with pixel matching functionality
  • integrate API
  • have some progression logic on the stages of the game

Submit a comment