Development diary: week 7

Identifying sounds that will be in the comic- 23rd May 2016 (3.1)

Before I begin creating sounds for the comic, I must first identify what sounds are needed and be able to decide what I can achieve in the time I have.

Here are the sounds that I can create for the comic:

Page 1

  1.  A gun being ready/ being cocked
  2.  A supressed gun being fired
  3.  A man grunting from pain or shock
  4.  A body being dragged
  5.  Sighing

Page 2

  1.  Jewellery and diamonds clanking together
  2. A radio being activated to talk through

Page 3

  1.  Running footsteps
  2.  Someone hitting the fall
  3.  A grunt of pain
  4.  Lots of beeping and other sci-fi effects
  5.  A bunch of heavy footsteps

Page 4

  1.  An alarm going off
  2.  Sci-fi sounds of something humming
  3.  A sci-fi blasting sound

What I can accomplish

I believe I will not be able to create all the sounds for each page, however if I limit myself to three sounds for each page I may be able to achieve the sounds I need. As page two only has two sounds, I will add an extra sound to one of the pages.

I have decided that page 1 will have the sounds 2 to 4, page 2 will keep all of it’s sounds, page 3 will have the sounds 2 to 5 and page 4 will have all of it’s sounds.

For page 1, I chose to not include the sound of a gun being ready as the gun is not the typical fire arm as it only fires tranquilizers and for the “sighing” sound, I believed it was not as necessary as the other sounds. For page 3, I chose not to include the sound of James footsteps because he is still currently sneaking, so the sound would be to quiet to really matter.


I was able to identify what I was capable of creating (sound wise) in the period of time I have and I was able to figure out what sounds I need and what I will make. This will make it a lot easier to prepare the sounds for the interactive comic, allowing the process not to be slowed down. Overall I believe this was a success.


Revisiting the script- 25th May (3.1)

When looking back at the script I have wrote and discussing with my teacher about the script, I have found that the script is an “in media res” which means into the middle of things. This is because my story begins as the main character has already become a thief and is in the middle of a heist with no explanation of how he got there.

I also discussed about why I choose to present the story in a linear way, instead of using a different order, such as my script is currently going ABC, however I can have it go CAB to change its story telling technique, such as showing a situation the main character is involved in, then the story explaining how he got to that point. I found from the discussions that if I were to go CAB, I would not be able to achieve the surprise effect for the audience when the main character gets abducted, where as the linear way (ABC) achieves the surprise effect very well, making the linear layout the best option.


I have learnt more about my script than I knew before, I have learnt what technique it uses to begin the story, I have learnt what techniques I can use to layout my story and I have learnt what the best layout is for the script. This will help me to have a better understanding when writing scripts for the future and will help to make any improvements to the script for the comic.


Story boarding- 25th-26th May 2016 (3.1)

On this day I began creating the storyboards for the comic using the script’s panel descriptions for each panel. Here are the storyboards I drew:

image image image image

For each page of the comic I drew the amount of panels it had on a separate page. I also labelled the characters in the storyboards by creating a key using letters, this allowed me to do simple drawings of the just plain models of characters and can be easily identified.


From creating the storyboards, this has created the visual imagery of the script which will help me to position the characters in the scene more easily as well as shaping the environment correctly according to the script. It will also help when I create the layouts for the panels as I can have them positioned corresponding to the scene in the panel, such as the direction the main character is looking or the direction the main character is running to.


Wireframes for each page- 26th May (3.1)

When creating the first couple of rough wireframes, I first worked on creating two different wireframes for each page layout using traditional comic wireframes, however I realised that I can use layers when placing panels. After designing a wireframe for the comic when using layers, I found that there is a lot more room for each panel, allowing more detail and emphasis in a scene.

Here are the first results for page 1 when using traditional layouts:


Here are the first results for page 1 when using overlaying panels:


I have decided to use overlaying panels in my interactive comic, here are the results of all overlay wireframes:



On this day I was able to explore different rough wireframes for my comic, I was able to look at landscape and portrait designs, and decide whether to go with the traditional layouts of comics or to have the layouts designed with the thought of overlaying panels and having transitions from the motion book tool software. I chose of course to design overlaying panels as it gave the panels more freedom in their placement and also brings in other factors that could improve the story telling.

As I can only have one page layout for the comic, I will have to decide whether to have portrait or landscape. From looking at the designs, I have chosen to go for a landscape page layout, this is because I believe that the landscape layouts are more fluid with the story, as the layouts fit better with each panel such as the character’s placement in the panel and where they look or where they are heading to. 


Madefire’s motion book tool- parallax – 27th May (2.1, 3.1)

I have realised that the interactivity in the comic is very limited, however I have remembered from previous experience that some of the comics on Madefire have parallaxes. This has brought me to the conclusion to do research into how to create a parallax on Madefire’s motion book tool.

The first step is to add a new layer and select “parallax” as the layer type. To add a new layer click the plus button next to “new layer”.

Madefire parallax step 1

At the bottom of the parallax layer, we drag the assets over onto the “new” button, this will add the assets to the parallax layer.

Madefire parallax step 2

After the layers are in the parallax layer, you can begin to mess around with the features of the parallax, such as by changing the range of the parallax horizontally or vertically. You can view these changes by ticking the tick box that says “Preview parallax motion”. Another factor you can mess with is the depth of the parallax, the options are to have the depth factor to be moderate, less motion in the back, even less motion in the back and almost no motion in the back.

Madefire parallax step 3Madefire parallax step 4

An extra feature have learnt from this experience is the website previews of the comic, this allows you to see how you comic will look when presented on a device. To do this, you have to click the white ipad icon on the top right.

Madefire parallax step 5

This will open up the website previews which will give you an array of options for what device you wish to preview it in, most preferably you want the one that matches with the comics page layout and device it is set to.

Madefire parallax step 6

I learned this from a youtube tutorial done by the owners of the software, here is the Harvard reference for the video:

Madefire Motion Books (2014) Parallax tutorial. Available at: (Accessed: 27 May 2016).

When learning how to create parallaxes, I created my own here are the assets I used:

Alien spacecraft interior (page 2) – Pics about space (no date) Available at: (Accessed: 27 May 2016).

NECAOnline (2014) Alien 7″ scale action figure series 3. Available at: (Accessed: 27 May 2016).

Here are the results of me testing and creating a parallax, it is rough and not that great but this was onkly so I could learn how to create a parallax:


I believe that the research I have done on how to create a parallax on motion book tool was a success, I was able to write down each step on creating a parallax and I was able to create my own rough parallax to make sure that I know how to create one properly. I also was able to find out another feature on the motion book tool, such as being able to preview the content have created in a template of the device it will be on, this will allow me to see what my content looks like on the device I have set.

I will use what I have learnt to apply a parallax to the front page which is the title page, this is because this where the page is at full screen, allowing the parallax to be at its best. I might also apply the parallax to the last panel, as it may be a full page panel, however I have not designed the final wireframe layouts so this might change.


Creating the title page- 27th to 29th (2.1, 3.1)

Now that I have created the character designs, the script and storyboard, I can now begin working on the title page (front page) by using what I have created to influence the title page, such as what characters are involved, where the title page is located, where the characters are positioned, etc. The title page will also need a title, so I would have to look at different fonts or decide on whether I want it hand drawn or not; I will also have design a logo for the comic or decide to just have a title such as the comic Beano.

The Guardian (2013) The Beano: Top 20 book covers – in pictures. Available at: (Accessed: 27 May 2016).

Creating the logo

Before I decide whether to have just a title or have both the logo and a title, I have started on designing a couple of logos that are connected to the story and designing a couple of different titles such as having rockets as the story continues in space or having sacks cash or diamonds, etc.. I also then began merging different designs together to create one single logo, this would include having a sack attached to a rocket or alien ship.

Here are the results:

image image

On the 14th design, my teacher gave me an idea in which I elaborated through designs 14 to 17 as I liked how it combined the skull in the previous designs (designs 3 and 5) and the rocket designs by having the rocket fly right through danger. This gave the impression that the main character likes to fly right into danger, which is true about my character as he enjoys the excitement of facing danger.

I was finally happy with design number 17# as it was able to capture the danger the main character likes to fly into and the vast exploration and adventures of the universe that this comic will contain.

The title 

When creating designs of the font for the title, I first designed my own font, this was to if I was capable of creating a sci-fi based font. After that I began using references to create fonts, these references were also based on the same genre. I would also go on to create fonts based on the references and my own designs and layouts.

Here is what I designed:


References used:

Tateishi, T. and Matsumae, M. (1988) Staff roll .

Cheezburger (2015) Space☆Dandy. Available at: (Accessed: 28 May 2016).

Lost in space original title sequence (2012) Available at: 29 May 2016).

After creating a couple of designs I found that there were also websites I could use to find the font I want, such as there is a font that is designed like the “Lost in Space” title font that you can download and use.

Here are some fonts that I have found that I am interested in:

Will Robinson font-

Fonts Will Robinson

The download:

Gears of Peace font-

Fonts Gears of peace

The download:

Spin cycle font-

Fonts Spin cycle

The download:

Perfect Dark BRK font-

Fonts Perfect Dark BRK

The download:

After designing and looking at different fonts, I have decided that the font I believe will work best and I like the most is the mega man 2 title. However I do not want the 8 bit font but the way the font is positioned, that’s why I will use the kind of font that I designed which is very strong and sharp.

Page content design

Now that I have a idea of the design of the logo and title, I will now focus on the page’s visual content, the font cover art. I have designed simple layouts of the characters position and the layout of the room/corridor; I have also included the layers they would be in if they were created to be a parallax.

Here are the results of the designs:

image image

After designing a couple I have decided to go for design 3#, this is because the design shows the kind of humour the comic will use, along with how the character acts in serious situations. The parallax would also work very well with the design as it shows the movement of the characters nicely, along with having James (main character) hide behind the guards when move in a certain postion.


I believe the designs I made for the front cover went very well. From the designs of the logos, titles and page content, I have been able to figure out what the front cover page will look like, this is because I now know what the logo, title will look like and I will know how to design the pages layout. This will help to create the front cover with a good design and layout that will help to introduce the comic.


Reflection of this weeks work

I believe this week was successful as I was able to learn what sounds I will need to create, I learnt more about my script, how the characters and the architecture will be layout in my comic. I also learnt how the panels will be layout on the screen, what page layout I will use, how to create a parallax on the motion book tool and my designs for the front pages logo, title and its content.

This will help me to create the sounds I need for the comic, to create the panels faster and more organized, to create the full design of the layouts of each page, to make a parallax for the front cover page and to also create the front cover page’s content.




Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s