Illustration and Visual Narrative- Project 3 Webtoon and Motion Comic

3/5/2022- 12/7/2022 / Week 10 - Week 15
Chuah Kwai Pin / 0348376
Illustration and Visual Narrative / Bachelor of Design (Hons) in Creative Media / Taylor's University
Project 3 Webtoon and Motion Comic 


LECTURES:

Transitions

1) Moment-to-Moment
  • A blink or two between seconds of a film, can be used to slow down and draw out action.
  • Constraint along with page panel form, most defines storyboarding from comics or sequential art.
2) Action-to-Action
  • Similar to Moment-to-Moment but typically focuses on significant events or movement from panel to panel.
  • Shows a single subject progressing through a specific movement.
3) Subject-to-Subject
  • A cut between 2 related moments, but focusing on a different subject in the same scene.
  • Conversation shift of focus onto another actor in the scene.
  • Stays within a specific scene or idea and call for more reader involvement.
4) Scene-to-Scene
  • Scene is a series of events that happen in one location, and continuous period of time.
  • The end of scene or start of new one is usually signified with a change of location or jump in time between panels.
  • Takes place across significant distances within time and space.
5) Aspect-to-Aspect
  • An interesting way to jump around a scene, taking in key details or letting the characters focus wonder.
  • A good way to introduce their environment to a reader.
  • Shows different aspects occurring simultaneously within the same scene.
6) Symbolic
  • Seen in forms like partial montages depicting the contents of a flashback or inner dialog.
7) Rolling Transitions
  • The images are melded and mixed together instead of having panel gutters or boarders as separate graphical elements.
  • The reader's eyes travels over the contour of one figure, finding itself on the other side in a separate 'moment' or 'aspect' or 'space' of the scene, giving a 'Rolling' sense of movement through space and time in the story.
8) Non-sequitur
  • Provides no logical connection between panels

INSTRUCTIONS:



Project 3: Webtoon and Motion Comic

Task 3: Graphic Novel

For this project, we had to come up with a 3-acts structured story with the theme of An Unforgettable Fight Scene. I spent some time brainstorming on what plot would be interesting and at the same time not too violent for a fighting themed webtoon. Personally, I am not very advanced in action scenes nor illustrating human figures. Hence, I tried to come up with a plot that I can illustrate comfortably with the skills that I have.

Fig. 1.1 3-Acts Structure Plot

1. Sketches

To kickstart my webtoon, I have found some inspirations and sketched out my characters. Since I wanted the overall webtoon to have a youthful and wholesome feel, I have designed the characters to look cute and kid-friendly. On the left are illustration style inspirations that I found on Pinterest and I chose it because I like that it is simple yet adorable.

Fig. 1.1 Character Sketches

2. Illustration Progress

After deciding on how I want my characters to look, I then began to illustrate the introduction to my story. Honestly, I didn't expect that it will take so long. Only after I have illustrated these first few pages, I realised that 60 panels will take me weeks to finish.


Fig. 2.1 First few pages

It was really a lot of work taking care of the small details and background of each panel. I tried my best to keep the transitions simple yet entertaining without adding too many new things to complicate it.

Fig. 2.2 Screenshot of my progress on Adobe Illustrator

3. Animating into Motion Comic

Task 4: Final Project (Motion Comic)

After I was done illustrating my Webtoon, I felt lost and stuck. I really did not know how to progress with animating my comic so I had to search for a few tutorials on YouTube. Apparently, we have to separate the elements we want to animate into different layers, which I had not done previously while I was illustrating my comic.

Hence, I created new artboards with 16:9 dimension and transferred each page of my comic into a new Adobe Illustrator file. I also separated each of the elements that I wanted to be animated and renamed them so it is easier to see when animating later on.

Fig. 3.1 Separating and renaming the layers

After separating and transferring each page into a new Adobe Illustrator file, I ended up with 27 individual files which I plan to import one by one in Adobe After Effects. Honestly, I was not sure if what I did was the most efficient way of working. But, that was the only way my brain could think of to animate this comic in such a rushed time.

Fig. 3.2 Screenshot of my individual Adobe Illustrator files

When I was ready with all my individual files, I opened up Adobe After Effects and imported each of the files to animate. Since I have had experience animating for another assignment on After Effects before, the process was not a big of a challenge. The only main problem was that it was very time consuming.

Fig. 3.3 Screenshot of After Effects

After watching the preview of my motion comic, I was pretty satisfied enough and proceeded to export it. I thought that it might be easier to add sound effects to an exported video rather than working on the same file, and it really was a lot simpler. I watched my motion comic to see which parts can add sound effects and went onto YouTube to search for some no copyright music and sound effects. 

Fig. 3.4 List of sound effects and audio

I then added these sound effects that I have downloaded as mp3 from YouTube into After Effects. I chose a rather relaxing and calm background audio for the overall comic and then overlaid additional sound effects to give more impact on the specific scenes It was quite difficult to time it perfectly since my preview video was lagging a lot. However, it turned out really great when I exported everything together and I was glad I didn't have to make additional amendments.

Fig. 3.5 Adding sound effects into video

4. Final Steps

After I was done with both my graphic novel and motion comic, I then proceeded to upload them onto Webtoon. I then remembered that I still have to create a Main Thumbnail and an Episode Thumbnail for my comic. I quickly created the artboards following the dimensions required for Webtoon and copy pasted some of the graphics that I already have in my graphic novel illustrator file.

Fig. 4.1 Main Thumbnail (1080 x 1080px, <500kb)

Fig. 4.2 Episode Thumbnail (160 x 151px, <500kb)

Fig. 4.3 Graphic Novel published on WEBTOON

Link to IVN_ Silva Combat Graphic Novel
https://www.webtoons.com/en/challenge/silva-combat/list?title_no=785752

I also uploaded my video up onto YouTube under unlisted so that people with the link can view. The only step left for submission was to upload them into Google Drive. 

Fig. 4.4 Uploaded onto YouTube for submission

Link to IVN_ Silva Combat Motion Comic:


REFLECTION:

Throughout these 5 weeks of working on the graphic novel and motion comic, I definitely faced a lot of challenges along the way. I have always enjoyed reading Webtoon comics, but never have I ever imagined myself to be creating and uploading one my own. It was definitely a tough and time consuming project for a beginner like me, but the end result made me satisfied. I feel that there is still a lot of room for improvement and there were some minor things that I wish I could have done better.

To be honest, I really hoped for some guidance for the motion comic. While I was working on it, I kept wondering if the way I work was efficient enough. It seemed like I was complicating things a lot, or maybe that was how it was supposed to be. Maybe 60 panels and 30 pages was just far too many, which was why it took too much time. However, I take this as a way of learning through self-exploring. It was a good chance to learn from mistakes and find solutions on my own. Overall, this project was a very interesting and fresh one to work on, despite the fact that it turned my sleep schedule upside down.

Comments