Labels

Immersive Visual Effects / Project 2

27.5.2025 - 25.7.2025  / Week 6 - Week 14
Bong Sue Zhiun / 0366866
Immersive Visual Effects / Bachelor of Design ( Hons ) in Creative Media
Project 2: Production



TABLE OF CONTENTS









LECTURE


Week 7 / Compositing 3D Elements Design

Mr. Fauzi shared a tutorial on how to do motion tracking in After Effects. 



Notes:

1. Import the Footage

  • Go to File > Import to bring your video clip into After Effects.
  • Drag the footage onto the timeline.

2. Open the Tracker Panel

  • Go to Window > Tracker to open the Tracker panel.

3. Select the Layer to Track

  • Click on your footage layer in the timeline.
  • In the Tracker panel, click Track Motion.

4. Choose Tracking Type

  • By default, it selects Position tracking.
  • You can also enable Rotation or Scale if needed.

5. Set the Tracking Point

  • A tracking box will appear.
  • Move it to a spot in the video with high contrast (e.g., a corner or edge).
  • The inner box is the area to track; the outer box is the search area.

6. Start Tracking

  • Click the Play button (Analyze Forward) in the Tracker panel.
  • After Effects will follow the movement of that point frame by frame.

7. Apply the Tracking Data

  • Create a new Null Object (Layer > New > Null Object).
  • In the Tracker panel, click Edit Target and choose the Null Object.
  • Click Apply to apply the tracking data.

8. Attach Elements to the Tracking Data

  • To attach text, images, or graphics:
    • Parent your layer (e.g., text or object) to the Null Object using the pick whip.
    • Now the element follows the tracked movement.


INSTRUCTIONS




PROJECT


Project 2 is the production stage that continues from the proposal idea in Project 1. In this stage, we are required to create all the visual content for projection mapping. 

I was stuck for a few weeks because I didn’t know how to start. In Week 9, Mr. Fauzi suggested that we narrow down our idea, as our original proposal was too broad. He advised us to focus on developing a cyberpunk city instead.

We divided the tasks as follows:

  • Six buildings: Sue Zhiun

  • Floor: Kar Yee

  • Trees: Kar Yee

  • Wire: Kar Yee

  • Afterlight Logo: Kar Yee


1. Building Model

Before creating the content, Kar Yee and I decided to build the model first, as it would make it easier for us to visualize the content. So, we planned to work on building everything together after class in Week 10.
We brought all the materials needed to build the city. I brought some boxes I found at home, along with mahjong paper.



Before assembling everything, we sprayed all the materials white. Mr. Fauzi also helped us with the spray painting.




We also folded a few paper trees by following a tutorial on YouTube. Since I didn’t take any photos of the trees we made, they look same to the one shown below.




After that, we started building everything, and below is the final outcome of the model.




2. Content Creation

Cyberpunk theme

For the city style, Mr. Fauzi asked me to refer to Coldplay’s ‘Don’t Panic’ music video. After watching it, I felt it was a bit difficult for me to follow because I wasn’t sure how to begin. So, I turned to Pinterest to find more suitable references and inspiration for my cyberpunk city.


Moodboard





Illustrations

I labeled the building models to help me identify and visualize them more easily.


After getting inspiration from the moodboard, I began illustrating the buildings in Adobe Illustrator, using a simple and minimalist style.



Animation

After completing the illustrations, I imported them into After Effects to start the animation process. I planned to create looping animations. Most of the buildings were animated by lighting up the windows using opacity keyframes. For some buildings, I animated lights moving downward by adjusting position keyframes. All animations use looping effects by applying the ‘loopOut’ expression to the keyframes.

Below are the progress shots for each building.


1. B1


2. B2


3. B3_Left



4. B3_Right


5. B4_Left



6. B4_Right




7. B5



8. B6


The final outcomes for each building (Cyberpunk theme) can be viewed through this Google Drive link.



Merdeka theme

As August was approaching, Mr. Fauzi suggested that we create an additional Merdeka-themed version. This would give us the opportunity to exhibit the project in an outdoor setting. 

The final visuals of all the buildings with a Merdeka theme use the same design as the cyberpunk version, with only the colour theme changed. I found some references on Pinterest to help me decide on the Merdeka color palette.

Moodboard



Illustration

I used the cyberpunk-themed building template and changed the colors to match the Merdeka color palette.



Animation

The animation style for the Merdeka theme is the same as the cyberpunk version. Below are the progress shots for each building (merdeka).


1. B1


2. B2


3. B3_Left



4. B3_Right


5. B4_Left



6. B4_Right




7. B5



8. B6


The final outcomes for each building (Merdeka theme) can be viewed through this Google Drive link.

FEEDBACK

Week 7

Specific Feedback: Since Project 2 focuses on creating content, we can utilize the material list to develop the final sketches, and then design and animate them in After Effects. For the style, we can follow the look of Coldplay’s “Don’t Panic” music video. It’s important to use colours with good contrast—if the colours are too dark, they might be hard to see during the projection mapping. Additionally, we only need to use flat designs for now, as the 3D part will be completed later during the projection mapping stage.

Week 9

Specific Feedback: Due to the many external limitations we encountered, we had to narrow down our idea from the proposal and focus on creating the cyberpunk-style city first. 


Week 10

Specific Feedback: If I plan to design both sides of the building, I should separate the content for each side. This will make the projection mapping process easier and more efficient.


REFLECTION


In the beginning stage of this project, I had no clear direction and didn’t know how to start. The idea felt overwhelming, and I struggled with figuring out the visual style and how to begin creating the content. It wasn’t until Week 9, after receiving feedback from Mr. Fauzi, that things started to become clearer. He advised us to narrow down our original proposal and focus on developing a cyberpunk city, which gave me a more solid direction to work toward.

From there, Kar Yee and I divided the tasks and began building the physical model to help us better visualize the city. I felt quite happy during the model-making process, as it had been a long time since I last did any hands-on crafting like this.

Animating the buildings in After Effects was a challenge at first, but I learned a lot through trial and error, especially by following tutorials online. I used keyframes and loop expressions to create simple looping effects, such as lighting up windows or moving lights downward. Eventually, I was able to animate all the buildings smoothly.

Overall, this project taught me a lot—from technical skills in After Effects to problem-solving and collaboration. Although it was difficult at the beginning, I’m proud of how the project turned out and how much I’ve grown throughout the process.


Labels:

Comments

Post a Comment

Popular Posts