Illustration and Visual Narrative | Final Project

on

7.06.2023 - 16.07.2023 (Week 14 - Week 15)
Caitlin Ong Lynn Dee / 0343801 / Bachelor of Design (Honour) in Creative Media
Illustration and Visual Narrative
Project 3

CONTENTS

1. Lectures

2. Instruction 
  • Final Project: Animated 1 Page visual novel
    • Comic Research
    • Script
    • Sketch
    • Inspiration
    • Refine Sketch
    • Draft:
      • Draft 1
      • Draft 2 
    • Final Comic

3. Tutorials

4. Submission

5. Feedback

6. Reflection

LECTURE

Week 14
No class
Week 15
No class, deadline is extended from Jul 14 to Jul 16

INSTRUTION



Final Project: Animated 1 Page visual novel
Continuing from Project 3, based on the selected story we have to create a one-page comic that show introduction of the story with at least one animated panel. We have to make sure the panel arrangement and transition is easily understood to the reader.

The challenges are:
  • Continue with the same story and design aesthetics from Project 2
  • Work only from one paragraph of the story for the 1st page.


Comic Research
I did my research on how to make comic on YouTube. In my research, I learn how to make panel sequences readable by using the 3-design layout. I learn on the do's and don'ts on making a comic panel. and I learn some tip of how to make the 1st page of a comic engaging.

Design Patterns:

Fig 1.1 Design Pattern (2/7/2023)
  • Gutenberg Diagram – the eye starts from the top-left to the bottom-right. The eye movement generally move to the right as it moves down. The corner that is paid less attention is called the fallow area. The top right corner is a stronger fallow area, while the bottom left is mostly ignored. 
  • F-pattern layout – this pattern the eye starts from the top-left. The flow is moved to right across the page, then it jump back to the left side in the bottom area. The process is repeated.
  • Z- pattern layout – The eye moves in a zigzag manner starting from the top-left and move to the right. The top-right comer moves down and to the left. 

Tips on comic panel:
  • Do not use too many square panels and vertical panels, it causes confusion.
  • Use long horizonal panels.
  • Create a focal point, use the rule of thirds. 


Tips on what needs to be in a 1st page of a comic:
  • Evoke emotion - give a reason why the reader needs to continue reading.
  • Exposition – briefly explain the world in the story.
  • Shock Value – show an unexpected a horrific event. 
  • Page Turner – Mix with shock value and suspense to the reader to engagement what happens next.




Script
Upon my research it important to write a script for my comic before drawing. So, I prepare a script on "The Black Cat" 1st Act, help me layout the events for each panel and wrote the monologue for the comic. I decide my comic to have a mixture of exposition and a pager turner. Each panel will showcase the important events that occur in the narrator's life. And the panel ends with a close up of the narrator's bloodshot eyes to given tension to the viewer to see what happens next after the narrator gotten drunk.

  • Panel 1: The Narrator get married.
    • Narration: I begin my new life as I got married to my beloved 
  • Panel 2: Pluto other animals
    • Narration: Our children consistent of birds, goldfish, rabbits and a monkey but my favorite of them all was a cat name Pluto 
  • Panel 3: Narrtor drinks 
    • Narration: Soon after I had a disease which is alcohol 
  • Panel 4: Blood shot Eyes close up
    • Narration: A demon had possessed me; I don’t have the patience for tranquility



Sketch
I draw a rough sketch to help me visualize on the comic' paneling. I decide to go with the Z - Pattern formant. and the last 2 bottom panels will be horizontal to make it easier to read.

Fig 1.2 Comic Sketch (2/7/2023)

Fig 1.3 Comic Sketch Reading Flow (2/7/2023)


Inspiration
For the aesthetic of the comic, I took inspiration from a Spanish illustrator named Ana Galvan for her usage of minimalist subject in her panels. 

Fig 1.4 Comic Strips by Ana Galven (2/7/2023)

I was I also inspired by Simon Landrein's 6 paneled illustrations for the usage of bold color to make the comic striking. 

Fig 1.5 Illustration by Simon Landrein (2/7/2023)


Refine Sketch
I am not good at drawing body proportion on humans. So, I trace the body proportion of existing images. From there I use one of "The Black cat" illustration I found from Pinterest to use as reference to draw the narrator 

Fig 2.1 Black Cat Narrator Reference from Pinterest (2/7/2023)


Fig 2.2 Image Reference (2/7/2023)




Fig 2.3 Tracing the image in Pannel 1 (2/7/2023)


Fig 2.4 Tracing the image in Pannel 2 (2/7/2023)

Fig 2.5 Tracing the image in Pannel 3 (2/7/2023)

Fig 2.6 Tracing the image in Pannel 4 (2/7/2023)

Refine Sketch 1:
I use the grid system in Photoshop to help me layout the panels and I use the shape tool to draw grey rectangle as a panels

Fig 3.1Refine Sketch 1 (2/7/2023)


Fig 3.2 Refine Sketch 1 with Grid (2/7/2023)

Refine Sketch 2:
In Refine Sketch 2 I ask my classmates for feedback on rought sketche shown on Fig 1.2 majorty said that the narrator 's eyes in the last panel looks like cat eyes and one of tham said that the second panel looks like a showroom for animals. So I decided to change thoses two. 


Pannel Changes:
  • Pannel 2: I use my charater reference to draw the narrator siting on a chair petting Pluto the cat.
  • Pannel 4: A siowette of the narrator looks angry

Fig 3.3 Refine Sketch 2 (2/7/2023)


Fig 3.4 Refine Sketch 2 with Grid (2/7/2023)


Draft 1
I decide to stick to the structure of the first refinement sketch, to save time since I have difficulty drawing humans. I have made each panel color code with different color. 
Fig 4.1 Draft 1 (8/7/2023)

Draft 2 
I afterward I realized that I have made mistake in my comic, it has to base of the 1st paragraph of the story. 


The 1st pargraphy in page 1:

FOR the most wild, yet most homely narrative which I am about to pen, I neither expect nor solicit belief. Mad indeed would I be to expect it, in a case where my very senses reject their own evidence. Yet, mad am I not -- and very surely do I not dream. But to-morrow I die, and to-day I would unburthen my soul. My immediate purpose is to place before the world, plainly, succinctly, and without comment, a series of mere household events. In their consequences, these events have terrified -- have tortured -- have destroyed me. Yet I will not attempt to expound them. To me, they have presented little but Horror -- to many they will seem less terrible than barroques. Hereafter, perhaps, some intellect may be found which will reduce my phantasm to the common-place -- some intellect more calm, more logical, and far less excitable than my own, which will perceive, in the circumstances I detail with awe, nothing more than an ordinary succession of very natural causes and effects.

In this quote "My immediate purpose is to place before the world, plainly, succinctly, and without comment, a series of mere household events. It show that the narrator is reminsing the events that drove him to maddness. I change the borders from white to black to display a and I change the colours to black and white to display a flashback. 

For my animation I decide to animate the narrator drinking beer because it highlights the core of the narrator's despair 

I overlap multiple frames together and I placed each frame on its individual artboard.

Fig 4.3 Animation Frame of Panel 3 (8/7/2023)


Draft 2 Animation:

Fig 4.3 Draft 2 Animation Timeline (8/7/2023)


Fig 4.3 Draft 2 (8/7/2023)


Final Comic
Yet a again I found out another problem I realize something that the assignment breakdown sides the part it says that the aesthetic is based on Project 2 is a typo, it is meant to be based on Project 3. So, I change the design of the cat be exactly the same as the triptych and I made each panels use the same color as the 3 triptychs. I keep the black boarders intact to simulate that the event occur is a flashback.


Fig 5.1 Final comic Version 1(8/7/2023)


I feel the one I different color for each panel is inconstant and confusing, so I change it to a dark yellow and orange. To give a warmer setting to show that the narrator lives' pleasant it slowly turns darker to emphasize that he is descending to madness.
 
Fig 5.2 Final comic Version 2 (8/7/2023)

I am worried that the picture I draw won't be enough for the viewer to understand I added in a narration box to help the viewer understand what is happening in the story.


Fig 5.3 Final comic Version 3 (8/7/2023)

Fig 5.4 Final comic Version 3 with Grid (8/7/2023)



Final Animation:

Fig 5.5 Animation Frame of Panel 3 (8/7/2023)

Fig 5.6 Timeline Animation of Panel 3 (8/7/2023)


Final Outcome

Fig 6.1 Final Comic with Animation (15/7/2023)


Fig 6.2 Final Comic Outline (15/7/2023)

FEEDBACK

Week 15

Draft 2:
  • Mr Zamri said that the style of looks good and the panels looks clear.
  • He suggested I chound break up each panelas as separate files, to make the file lighter
  • He said that the I am in the right track

REFLECTION

Experience 
Making a comic is changeling experience. Due to not having physical class, it is difficult to ask for feedback from the lecture, but lucky Mr. Zamri announce that he is willing to the take the time to look through my work. Looking through other people's perspective because I have no idea how to make my comic approachable to the viewers. Some part I made some careless mistake as I overlooked on the instruction when making the comic.

Observation
I have a tendency to be paranoid on the sequence I laid out for the comic. because the pannels I drew feel like sepreate scence rather than a transition of another scence. But since it is my 1st time drawing a comic, I don't know how to draw the basic human porption or object perspective to make the transition feel organic.


Findings
Since I had no experience to draw a human properly, I use image from the internet as reference. I did find myself in improve to make the comic approachable and consistent. I also improve on the color coordination.

REFERENCE

Monitor Comic (Sep 2020) The SECRET To Creating GOOD PAGE FLOW In Comics, Manga, And Webtoons. Available at: https://www.bing.com/videos/search?q=(11)+The+SECRET+To+Creating+GOOD+PAGE+FLOW+In+Comics%2c+Manga%2c+And+Webtoons+-+YouTube&qpvt=(11)+The+SECRET+To+Creating+GOOD+PAGE+FL (Accessed: 16/7/2023)

Steven Bradley (April 2015) Design Principles: Compositional Flow and Rhythm. Available at: Design Principles: Compositional Flow And Rhythm — Smashing Magazine (Accessed: 16/7/2023)

Monitor Comic (Jul 2019) What NEEDS to Be In The FIRST PAGE Of Your Comic, Manga, Or Webtoon by Monitor Comic. Available at:https://www.bing.com/videos/search?q=(11)+What+NEEDS+to+Be+In+The+FIRST+PAGE+Of+Your+Comic%2c+Manga%2c+Or+Webtoon+-+YouTube&view=detail&mid=1FC5259278C8E4F65D571FC5259278C (Accessed: 16/7/2023)

Proko (Oct 2021) Basics of Comic Composition. Available at: https://www.youtube.com/watch?v=5KX7WpRVtVU (Accessed: 16/7/2023)

Comments

Post a Comment