top of page
  • Writer's pictureYinmiao Li

Interactive Video Website

Updated: Oct 31, 2019

This is a project cooperating with Maya Wang and Chuyi Zhang. The website is categorized as a interactive video website. It creates a story of dream, and involve interaction from users. Below is the demo of the interactive website.

Our video project is a game-based website. The story got inspired by the movie "Inception". The main character went to sleep at night without drinking water because she failed to get water from the water dispenser. Back to her bedroom, she fell asleep and start to dream, her dreams are closely related to water. In her dreams, she woke up in different places, and the anomalies happened. What the users need to do is find out these anomalies and click them in the certain period of time to save the main character and wake up in a lower layer and finally out of the dream state. Otherwise, she will fall asleep deeper and deeper and finally never wake up. In the video, if the users find the abnormalities, there will be another video displayed the certain abnormal objects abruptly play. If the users didn't find the abnormalities, the video will keep playing, the character will drink the water in the glass, and close her eyes again.

I'm mainly in charge of editing videos. During the editing process, I learned a lot about how to use Final Cut Pro.

We decided to make every setting consistent, all start with opening eyes and end with closing eyes. To make this effect, I found an online tutorial of blinking eyes effect: The methods is to add two black layers in front of the video and using "Fisheye effect" to adjust the radian of the border, make them roundish, then set a movement for these two black layers within 4 sec, at last, adding a blur transition on the video to imitate "just opening the eyes, can't see everything clear".

Intro Video & The Endings: The difficulty on this part is the light and color tone. When we shot these clips, to make them have a better quality, we shot in the daytime and set the aperture mode to auto changing. So when the lights turned out, the quality automatically become bright. I first cut out the extra taps on the light button, I checked each frame to make the movement smooth at the end. Then, in order to change the color tone of the bright part, I tried with different effects. Instead of using the "day into night" effect, I chose the "spot" effect. Because the day into night effect didn't make the scene that dark, and if I adjusted the attributes, it will be too dark and unclear. So I used the spot effect, and only added light on the glass, and reset the contrast value to make the rest of the scene very dark.

Cardboard room & Library: For these two settings and also the cardboard room, the most complicated part is to set the color tones. I balanced color for all these scenes to adjust the intensities. Also, there are some precise adjusting because after balancing color, different clips will have slightly different on the color tones, so I used the color board to adjust the exposure and the saturation.

Art studio:  For this scene, the hardest part is the connection between two clips of video. Because when we shot the two clips, the angle slightly changed, so that it is unstable and choppy on the connection part. I tried different methods such as enlarge the frames and adjust the position, all failed to get a good result. After all different trying, I decided to chop out 5 to 8 frames of the first clip, and 3 frames of the second clip, to let them almost at the same position. And I added speed on the first 3 sec of the turning back clip to make the turning back movement more natural. It is still a little choppy, because the angle changed a little bit, but it is much better. The other methods I tried is to reverse part of the end of the first clip, but the problem of that is during the turning back part, there's a obvious adjusting angle scene. So we stick to the first methods at last.

10 views0 comments

Recent Posts

See All


bottom of page