6/5/2021 - 30/5/2021 / Week 6 - Week 9
Lui Hsiao Hui (Tressa) / 0342003
Illustration and Visual Narrative / Bachelor of Design (Hons) in Creative Media
Project 2: Decisive Moment
Illustration and Visual Narrative / Bachelor of Design (Hons) in Creative Media
Project 2: Decisive Moment
LECTURES
WEEK 6: PROJECT 2 BRIEF
Lecture - Ms. Anis
In week 6, we are briefed about our Project 2 - Poster: Decisive Moment. We are to create a minimalist vector poster (animated) based on a chosen narrative.
Notes for Project 2:
- Concept: A pivotal moment in a widely known movie/book/game etc
- What is being promoted in the poster
- Capture the moment of action
- Adaptation: How would you translate the scene with a minimalist style approach
- How would the characters, or other iconic objects be simplified
- Research on the narrative chosen and the popular translated designs (translate the narrative)
- Identify iconic objects and colours, what they're wearing, the characters, etc
Practical - Mr. Kannan
Timeline Animation
Fig. 1.1 Introduction to Photoshop timeline animation
This week we were taught how to create a basic and simple animation in Photoshop.
- Pose to pose: Identify the floor
- The closer the frame, the faster the reaction.
Fig. 1.2 Things to consider animating in our poster
Mr. Kannan mentioned how we could animate the secondary objects in our poster to create a different focal point. For example in Fig. 1.2, the girl does not have to move but the eyes of the monsters around her can be blinking. The contrast in movement makes the main character stand out this way.
Fig. 1.3 12 Principles of Animation by AlanBeckerTutorials
1. Squash and stretch
2. Anticipation
3. Staging
4. Straight ahead/Pose to pose
5. Follow through & overlapping
6. Slow in and slow out
7. Arcs
8. Secondary action
9. Timing
10. Exaggeration
11. Solid drawing
12. Appeal
VISUAL RESEARCH
Chosen Narrative: Little Nightmares II
Little Nightmares II is a horror suspense-adventure game developed by Tarsier Studios and published by Bandai Namco Entertainment. In this installment, we follow Mono, a young boy trapped in a world that has been distorted by an evil transmission. Together with his new friend Six, he sets out to discover the source of the Transmission.
Fig. 3.1 Mono opens the door, video by Infernix Gaming
The scene I chose is the scene when Mono finally succeeds in opening the door to the signal tower after many failed attempts earlier on in the game. It is a pivotal scene because his action here frees the Thin Man, thus causes the time loop to happen again and results in Six's capture. The suspense is also very strong in this scene because the audience has been waiting for Mono to finally be able to open the door to see what's locked behind it. I think it would be great to translate this suspense into the poster with the animated door slowly opening.
Fig. 3.2 Mono running towards the signal tower door
Fig. 3.4 Resulting in thin man escaping
2. Vector Poster
This scene of Mono opening the signal tower door is also perfect because of the symbolic eye on the door. In the Little Nightmares universe, the eye is almost on every object, often found in paintings, etc. The eye is a metaphor for consumerism, being controlled, the need for escapism, the power and danger of media.
Fig. 3.5 Symbolic drawings by a child in detention
Fig. 3.6 Eye symbol
Fig. 3.7 Little Nightmares logo
It is also incorporated in the official logo. So it is an iconic symbol to include in the poster.
INSTRUCTIONS
Project 2 - Poster: Decisive Moment
1. Sketches
Fig. 4.1 All poster sketches, Week 7 (10/5/2021)
Fig. 4.2 Digital sketch Version #1, Week 7 (10/5/2021)
For Version #1, I played around with the negative space and contrast. Although I'm a detail-oriented person, I find that I quite like the look of the digital sketch without the door frame outline. I think the outline creates a separation from the empty space, causing a little break. I'll be including with outline and without in the vectorising stage to see how different they look and which looks best.
Fig. 4.3 Digital sketch Version #2, Week 7 (10/5/2021)
Version #2 is a little more complicated but I like the idea of having Thin Man's shadow coming from the crack of the door. It gives a sense of anticipation to the audience and I also just personally like the extra detail.
I decided to include Thin Man in Version #2 because I thought the extra detail would look cool, acting as an 'easter egg' and it is also symbolic to the scene. Thin Man is quite an important character, especially to Mono because of the hero and villain dynamic.
Fig. 5.1 Creating the vector, Week 7 (12/5/2021)
Fig. 5.2 Vector progress #1, Week 8 (20/5/2021)
I created the vector of mono based on a still from the game. The bottom left picture shows the vector shape of the light coming from the door.
Fig. 5.3 Vector poster progress, Week 8 (21/5/2021)
I tried out a few variations with the eye and whether to stick with an outline or fill.
Fig. 5.4 Vector progress #2 - refinement and details, Week 8 (21/5/2021)
- Added Mono's shadow.
- Have the door handle pulled down to show that Mono opened the door.
- Redesigned the eye vector to fill instead of outline because the poster looked flat, it also emphasises the eye more.
- Changed the doorframe from an outline to a fill because it was bothering me and the balance in colour/shape looked off.
- Added lighting from inside the signal tower.
For the lighting, I used the knife tool and pen tools. For each frame/layer I adjusted them all individually so the lighting will look realistic. (This took so long please it was a pain.)
3. Final Vector Poster
Fig. 5.5 Final Little Nightmares II vector poster "End of the Hall", Week 8 (21/5/2021)
Fig. 5.6 Alternate Little Nightmares II vector poster "End of the Hall", Week 8 (21/5/2021)
Made this version just for fun. I really like the contrast of this version.
Fig. 5.7 Final vector poster grids, Week 8 (21/5/2021)
4. Animation
Fig. 6.1 Animation draft #1, Week 8 (20/5/2021)
First animation test. Altogether 11 frames. After creating this, I decided to add Mono's shadow and do some adjustments as mentioned in Fig. 5.4 above.
Fig. 6.2 Photoshop timeline for the first draft, Week 8 (20/5/2021)
Fig. 6.2 Signal tower door - frame by frame animation, Week 8 (20/5/2021)
Fig. 6.3 Animation draft #2, Week 8 (21/5/2021)
Really satisfied with how the lighting came out and the little detail of the door handle opening.
Fig. 6.4 and 6.5 Animation draft #3 - audio and no audio, Week 8 (22/5/2021)
In my third attempt, I tried to animate a glitch effect with frame by frame animation to replicate the fringing effect in the game. I also made an audio version for fun. However, I think the glitch is making it hard to see what's going on in the poster, and the animation ends really quick. I was trying to convey suspense - sort of like when a tv glitches out at the moment of something being revealed. Because the door is not fully open it made the animated end quick once I placed the glitch there. Besides that, in the game's actual scene there were many glitch effects whenever Thin Man was present, specifically the RGB shift.
5. Final Animated Poster
Fig. 6.6 Final Little Nightmares II animated poster "End of the Hall", Week 9 (24/5/2021)
I decided to tweak the glitch effect to RGB shift when the door opens and linger on the final frame of the half-opened door so people would be able to register what's going on in the poster. I also made the text glitch first, before the entire poster glitching out - like how in horror movies/games the light blinks a few times before going out. The poster glitching out to black also relates to "nightmares".
Fig. 6.7 Photoshop timeline for final animation, Week 9 (24/5/2021)
34 frames altogether.
FEEDBACK
Week 7: Version 1 sketch is preferred because it is
straightforward and easy to understand.
REFLECTION
This project was a really fun one though animation is a pain. I enjoyed this project because I got to create a somewhat fanart of my favourite game. It was really exciting to see the poster come to life. Coming up with ideas to convey the decisive moment was fun and I got to further develop my skills with Adobe Illustrator. The part I struggled with was the animation. The final animation (the glitch part) wasn't what I really envisioned, it's also because I did frame by frame animation in Photoshop so creating that effect is a little tougher.
Comments
Post a Comment
be nice