Build Up

Our project has gone through a number of different iterations, starting with a 2D animation project and now a 3D immersive interactive project

Modeling Process

We have divided the entire building into 3 main sections, the 1920's period, the 1970's period and the present. And all of these buildings are constructed differently.

In 1920 it was a wind tunnel lab under construction, by 1970 it was a functioning wind tunnel lab and had an airplane in the center as well as a center console. In 2024, it became the current school building.

Models and Material

We used different character models to show the audience the history of the building at different times. The figures of workers, scientists, soldiers and students represent the interesting stories of the building at different times.

The theme of our visual style is manga, so we use a lot of manga materials to color our models. After creating the basic material by using shader, we adjust the color to achieve different visual effects.

Animation

Each NPC will have a different animation, and when in play mode, viewers can see each NPC in action so they can be more immersed in the history of the building.

Some of the NPCs have unique actions, when the character passes in front of the NPC, they will do some other actions to interact with the character.

"This motion-capture project, developed in Unity, offers an immersive exploration of ArtCenter’s 950 building. Players use real-time movement control to navigate its transformation from a 1950s wind tunnel to a modern teaching facility, engaging with interactive storytelling, NPCs, and distinct artistic styles that highlight each era."

Explore three different styles of 950 building in three different eras with this motion capture project.

Welcome to 950

1920

1970

2024

The colors become more brilliant with age. In the 1970's scene, we added a predominantly monochromatic visual effect, since printing technology was not good at the time, we chose to color an object with one color.

1970

1920

In the scene about the 1920's, we used a black and white color theme because at that time comics didn't have colors, only black and white and grey, so we decided to use white as the main color for this scene.

2024

In current times, various printing techniques have become more and more advanced, so for Current's scene, we decided to use more color combinations and more brilliant colors to enhance the visual impact, and we also added black lines to each object as a way of emphasizing our manga theme.

Visual Style

2024

1970

1920

About Project

For this project, we're doing some publicity for ArtCenter's new building, 950, where our project will be presented on a large TV in the hallway.

We also encountered some pain points in exploring this project

Point 3:

How does this project interact with users? What kind of interaction connects the user and the building?

Point 2:

How do we highlight that this is an ArtCenter building? How do we highlight the special of the school in the project?

Point 1:

What is the historical story of this new building that we can publicize.

History of 950

After our detailed investigation into the history of the building, we discovered that the building was actually one of the largest wind tunnel laboratories in the United States.

The building was officially completed and dedicated in 1930 and was decommissioned in 1997.

Ideation

This is a building with a long history and is now a building belonging to an art and design school. We decided to combine these two elements as the central effect of our entire project.

From there, the concept of a comic book-style historical building that can interact with user became an idea that we wanted to achieve.

How to interact

Our project will be placed in a corridor, a corridor that a large number of faculty and staff pass through every day

It occurred to us that we could interact by capturing the direction that people passing by are heading.

Function

We have two main features, and these two features make up the main interactions that give the user the freedom to explore the entire manga style of 950

Control by Computer

This building is dotted with many NPCs that can interact with the user.

NPC

Control by user

This time traveler from the comic book universe would run free in the building.

Run

About RUN

Our goal was to give the user a complete experience of what the building 950 looked like in three different periods, so we set up seven points where the character could stop and visit.

Locations

Movement Track

The character's movement is manipulated by the user moving left and right in front of the camera, and the character will reach different locations depending on the direction the user moves. For example, if the user moves to the left, the character will also move to the left.

In order to make it easier for the user to observe the movement and position of the character villain, we turn we set up a window similar to a comic book grid to give the character villain a close up shot.

Spotlight

About NPC

Each npc on the character's running route is able to interact with the npc, which animates differently when the character is near it.

Interact

For example, a soldier will just stand idly when the character isn't near him, and when the character gets close he will start saluting.

Spotlight for NPC

We've also placed exclusive Spotlight windows for many NPCs, through which users can better see what NPCs are doing in each time period

Each period of Spotlight gives the camera to a few of the most special NPCs, such as students, workers, and center console operators.

Different Periods

Since our building is a huge collection of three different time periods, we decided to style the NPCs to be the same personnel that would be present in different time periods, for example, in 1920, there would be a lot of construction workers and soldiers, in 1970, mostly researchers in wind tunnel labs, and in the present day, it's more like students and teachers.

Comic Book

Captures passerby movements to trigger an animation, following them left or right. The animation mimics 70s-90s comics, blending 4-6 characters into a patchwork of anime-style drawings.

Idea Generation

We had two different ideas in the beginning, and in the end we decided to combine the best of each idea into one project.

Time

The camera captures the silhouettes and movements of the passing crowd, randomly displaying a combination of silhouettes from a previous moment and current passers-by to create a sense of time and space interlacing.

Timewalk

In the end we decided to combine the best of both ideas into the final IDEA. we decided to divide the building 950 into three different time periods and place various people from different time periods in the building and have the player manipulate the character to take a walking tour of 950.

Sketches

Comic

Time

Timewalk

Variation

Our project has gone through a number of different iterations, starting with a 2D animation project and now a 3D immersive interactive project

Version 1: 2D Animation

When the user walks past the TV, he can see some animation happening around him and some NPCs talking to him.

We first used AI to create some concept artwork of a wind tunnel, and then used the bottom half of the screen as an area for the user to walk through.

Version 2: 3D Immersive

Eventually, we decided to switch from 2D animation to 3D immersive interaction in order to better present the entire 950 building.

Walk to the right or left to allow time-travelers in comic book time to explore the entire history of the 950 building.

Building Concept

In the 1920s, the building was still in the process of being built into a wind tunnel for the U.S. Army, so there's a lot of steel, stairs, and military vehicles to be seen.

In 1970, the building was already built and the building came with the presence of airplanes with tests and giant fans, as well as several operator's desks.

By now, 950 was about to become a dedicated building for TRANSPORTATION, so it had the style of a modern school building, along with some model vehicles for students to see.

NEXT PROJECT

Final