Script to Film 11 : Starting on creating Title in After Effect & Other Issues

Lots of the time were spent on other module due to it’s earlier submission date, but now that it’s over, I could finally concentrate to create a Title sequence of our film in After Effect. Originally, the title was supposed to be “Lily of the Valley” but we found that it would be too much of a hint to giveaway and have been brainstorming together on a new one. There are some that we thought of such as Poison, Forbidden etc but they are either too plain or still pose the same problem of giving too much hint. In the end, we settle for a word that is of Greek origin– Storge, which means “love, affection” and “especially of parents and children” but it also means to express mere acceptance or putting up with situations, as in “loving” the tyrant. This word encompasses  what we are showing in the film and thus is chosen as the final tile. I think that using a foreign word gives it a more unique feel and arouses people’s curiosity as to the meaning of the title itself. At the same time, it gives people a sense of mystery, not knowing what the film is about until they watch till the very end.

For the software, I use After Effect as I have practised using it and that it has lots of plug-ins available for making effects easier. Also, it is due to the huge amount of tutorials available online and which I can use the chance to test out my skills in creating such effect sequence. Screen Shot 2015-04-29 at 19.28.45

For the fonts, I’m using a thicker font called ‘Impact’ as I need it to be thick enough for the masking of the background effect. The background is a video of a falling red rose petals, symbolising the falling apart of ‘love’ in the film and alluding to one of the scenes where the Father cuts away a rose flower before he is poisoned by his wife. The colour that I have chosen is dark red, signifying the deep love that they once had and the ending is the words distingerating into dust, further alluding to the crumbling of the family that will happen at the end, and also indirectly symbolising the death of the Father right when their ‘love’ falls apart. The sequence is planned to start fade in slowly and is given a few seconds for the reader to read the Title before it disappears into dust, making it a smooth and meaningful transition to the opening scenes.

It takes sometime for me to get used to do new stuff like adding Composition and combining them, but I guess its because of my lack of experience since I have mostly dabbled in simple effects. For the current title sequence, the effect that I want to achieve is a little bit trickier and requires more steps and plug-ins for it to be done nicely. It serves as a good exercise, though, for me to learn the shortcut or functions of some effects/plug-ins slowly. After Effect does make things easier compared to other special effect software. For example, the distingeration into dust effect involved a plug-in and a build-in effect that requires only two steps for them to be mixed and are easily manipulated with the available options.

Initially, we are supposed to do a reshoot of a few key scenes back in Dave’s house, but sadly, it was cancelled at the last minute as we did not get any reply back from one of team members who have direct contact with Dave. This incident caused us to have to made do with whatever footages we have and also made me believe even more that we could not depend on a single person or a single choice of location. Also, as a producer, I found that I did not do a great job in informing everyone and bringing everyone together, especially with the director doing his own works most of the time. For now, I will be working hand-in-hand with the Editor and Sound Editor to deliver a final good quality film

Interactive Media 13 : Preparation for Presentation

For tomorrow’s presentation, we have decided to create a short video to list out highlights of our game instead of playing it on the day itself to save the hassle of explaining too much with words. I record the screen of the game and edited it into several categories that is easily understood, such as usage of Morality Meter, Making choices and multiple endings etc. I will probably be explaining along the way to make each of them clearer. Sadly, time is really running out and I feel really frustrated that the video could not be polished further. Personally, I have a minimum standard that my work has to reach before I feel that it is suitable/sufficient for submitting, the same goes for the other parts like the ransom video and podcasts. The latter two are not bad but I feel that it could be improved much further and more professionally. It was just so unfortunate we do not have time on our side to create better ones. I will have to take note of this in the next production to ensure we can deliver a higher quality work.

Interactive Media 12 : Final build & Updated Script & Thought Process

Alexandra and I spent some hours re-editing the scripts and trying out best to keep the essential ones only. This helps to shorten the script but not by much, though the quality of the dialogues have been improved and is more natural now. They have been read through multiple times and grammar mistakes are almost eradicated from several play-testing.

Just in case, I have sent the final build to the previous play testers for one last beta test. As of version 3.5, most of the major errors have been fixed, with no problems occurring in both Windows, Mac and Android version. I will be exporting the final build one last time on Monday to ensure it is the Final Version to be submitted.

Thinking back for the past 2 weeks, I did not even believe that I would be able to create such story visual app by myself. Although we have planned for it to be watered down version, I could actually manage to complete the game without it being the main goal of this project. One of the things I felt was the right thing to do is changing from Flash to Renpy. Even though it’s using a completely different programming language that I have learned in Flash during Epicenter lessons, it was the right bet. I doubt I could even complete half the game if I continued in Flash. It’s a good thing I dared to ask the lecturers about using alternative software and it paid off well. Not only have I managed to learn a new software, but I am also becoming more accustomed to the new programming language.

Also, I get to experience the process of game making( or sort-of) with a group. Instead of just one person doing everything, we actually split the works equally. I did the character designs and programming while the scripts, social media advertisements and story is created by others and sometimes together as a team. The game will never be completed if one of us never did their part but alas, I am really grateful that I have a wonderful team. Each of us did the roles well and offered to help one another out, making the project fun and proceed smoother till completion.

Interactive Media 10: Tutorial Feedbacks & Beta Testing

Today is the last tutorial feedback and luckily I have managed to compile everything and the beta works smoothly enough. A day before, I send the prototype to my groupmates and some of my friends to get some feedbacks from them. With the help of many people helping to test the software, I manage to list and found out some coding errors or grammar mistakes along the way. This is one of the reasons I place importance on mass beta-testing, it really enables me to find out most problems within short period of time without having to play through the games so many times. I am grateful to all those who’s willing to take out some time to try my game and will probably credit them in the game itself as a token of appreciation.

The tutorial’s feeback is mostly positive, with the lecturers praising good use of images and sound and even simple effects like screen shaking due to ‘being punched’ etc. They like the character designs and backgrounds, and the music is said to be suitable and fit comfortably with the dark fairytale setting.  Use of well timed and appropriate sound effect is given recognition in most part too. Overall, they like the game very much and are suprised we have a fully working almost-completed prototype to show them a week before submission.

However, some criticism are given which I think it’s not really good suggestion, though some of them are valid and appropriate criticisms. Firstly, they want the text to be automatic and not to click to continue. However, taking account that modern games nowadays employ click-to-contiunue approach, this is actually one of the best method for this platform. By employing clicking method, the player can choose to go through the story at a faster rate or can just take their time playing at a slower rate. Sometimes player just wants to rush through the story to get to a certain point and clicking it helps them, rather than to force them rewatching the same dialogues at the same normal speed, which to them might seem painfully slow. Furthermore, as this app is playable on phone, clicking becomes the de facto method to play this game. Many games have become more fast-paced to accomodate modern gamers, which is used to doing things fast and have shorter attention span..  Thus employing automatic text will actually cause them to lose interest in the game itself.

There are several good suggestions though, one being the dialogues are pretty long winded. I agree to this partly as I have to rush the coding and did not place first priority on the dialogues. Some of them can be shortened or even deleted altogether for a more fast pace gameplay. For this issue, Alexandra will be helping me to check and edit the dialogues to ensure it is shorter and only necessary dialogues are retained.

Another issue is that they want the choices to appear much faster. This can probably be solved by shortening the dialogues but I am aware that this is almost unncessary. The main point of a visual story is the background story and dialogues between characters. Sometimes, adding an unncessary choices right at the beginning can pose problems for the script and the programmer. Alas, we are not creating a full game, which leaves us with so little time to explain the story to the player before they are allowed to make a choice that will affect the course of the game.

One last issue is the suggestion to continue showing the MagicBeans and Morality number meter till the end of the game. I understand that players may want to see how much they have earn or the number of morality at the end to keep score. However, due to this software being a prototype and much watered down version from the intended full game, the importance of magicBeans and morality will only last till the part when Gretel saves Hansel, at which point the game is almost over and those two numbers become unncessary. There’s no valid reason to let them be shown to the players when the game is ending. We don’t normally see money counter or life points during the game ending cutscenes for the reason that they are simply not needed anymore.

Later on, Lydia will be editing her video to reflect the changes from 1000 beans to 100 beans, which is the number of beans needed to rescue Hansel in the game. Petra will also be creating an official poster and logo for the Menu Screen of Sweet Hostage. If I have the time, I may try to animate the Menu Screen to make it more appealing and arouses interest for new players to try.

Interactive Media 11 : Porting to iOS

I was using Lydia’s iPhone 5 for the porting of the game to iOS this morning and realised that it posed to be a big problem. Unlike Android, which is based on open software, the iOS is a close software, and a strict one at that. While I have an easy time porting to Android at the click of a button, porting to iOS actually requires me to be a developer, which I might have to pay for. Thus, porting to iOS proved non-feasible. But thankfully I am able to port to Mac, Windows and Android with not much problem and everything almost error-free.

I have edited some of the Hansel Avatars to form the ghostly version of Hansel that will only appear if the player decided to abandon Hansel. It’s edited in Photoshop and applied the ‘Invert’ filter, it makes everything convenient while conserving the several facial expression of the originals. Time is not really on my side and I couldn’t afford to draw a completely original ones. If only I had the time, I would probably draw a bloodier version/tortured Hansel.

HanselShockedNegative HanselSmileNegative

Interactive Media 9: Multiple Endings & Remembering Choices & More Progress

After coding the menu for choices in-game that the players are allowed to choose, I have tried to experiment on making other characters remembering your choices or previous deeds. This means that if I choose to be a bad character with low morality, the other characters will treat you differently. For example, in the current prototype, player can choose to either betray the 3 pigs and help the Mr Wolfe or help to stop Mr Wolfe from eating the pigs. If the player choose the former, the character Red Riding Hood will appear in the later part of the game and reprimands Gretel for her actions. The same thing happens when the player chose to steal from Goldilock, which Red Riding Hood will know and speak different sentences to Gretel.

Alas, all these choices can be remembered and will lead to different endings. There are currently 6 different endings, of which there are 3 Good Endings that are only slightly different from one another, and 3 Bad Endings that are quite different. Some of the endings are premature endings which happen quite early on if the player choose very bad choices that lower their moralities by a large amount. Luckily I discovered that it is pretty easy to code this feature into the game itself to the simplification of the programming language.

Lastly, the final character to be drawn is the 3 Pigs. They have undergone pretty much changes from the original draft as they look too plain in the original. I have decided to give them shirts and trousers to wear and even some pretty cool hairstyles. Their color choices are based on the green-yellow-orange, a line of colour that is able to be mixed nicely, representing the 3 Pigs who are brothers. The three of them are their own being yet they have strong bonds with one another. The eldest pig is drawn to be more mature than the other two, with the youngest looking more child-like. Due to time constraint, I have not been able to find time to draw them separately and thus they are drawn as a single character avatar. However, due to the fact that only two of the pigs talk, it does not pose much of a problem to tell which pig is talking. I have made distinguishing the pigs easier by color coding the name, so the Eldest Pig text name and Youngest Pig text name will have different colours.

3Pigs 3PigsSmile

Interactive Media Research : Art-style

During the process of discussing our own version of mixed fairytales in the group meeting, we have gone through several revisions to try to change the characters to fit our own story world. The world we made is comprised of several fairytales like Red Riding Hood, 3 Little Pigs, Goldelocks and 3 Bears and Hansel & Gretel. We want to make a story that is dark and corrupted, filled with drugs etc to contrast with the original version.

However, we plan to make it modern, similar to Shrek but more of a fairytale in reality. I use my surrounding in UK, or Bristol as reference for this. Some characteristics such as piercing, dyed hairs and even eyepatches. However, the amount of details has to be controlled so as to not make everyone looks the same in style. Thus, I separate them into three categories, the younger generation and the older and animals. The former refer to teenagers or kids in the original fairy tales, like Gretel, Goldelock etc, the second refers to the Witches and Red Riding Hood who is of older age. The last one refers to humanoid animals that act like humans like the Bear, Wolf and 3 Pigs.

Gretel, Hansel and Goldelock is given pretty modern styles, with jackets, piercing and dye hairs or flashy accessories put on them. They are meant to be rebellious group age, which is similar to the real world. These characters will stand out more for what they look like, to give our players, who are mostly teenagers or young adult to relate better to them. I try to refer to them back and forth while drawing to ensure I do not make them look too similar in fashion style or hairstyle or colour usages.

For the Witch and Red Riding Hood, being an older character in age, I restrict myself from adding too much bright colours (except her hair), she wears a plain green colour shirt, for more conservative colour usage. As this is the only character that I infer from one of my groupmate’s drawing, the style is slightly different from the rest of the characters. Overall, it does not differ too much to look like it’s not from the same story world. Red Riding Hood is changed to be more mature and older in our version to create her as nemesis for the Witch, thus she is also kept as plain as possible even though the original source of Red Riding Hood is a young girl of similar age as Gretel and Hansel.

Lastly, for the animal characters, with the exception of Mr Wolfe, I minimise as much clothing or accessories as I could to retain their animal appearance. Their natural features such as nose, ears and furs are retained and in some case enhanced. Mr Wolfe is an exception to most of these because I believe that he is a more major character for the story and thus need to be different to stand out from his other animal peers. He is given a cigar and black hair and shirt, to symbolise his dealing in the darkness and also his cunningness that makes him fit to work for the likes of the evil Witch.

Background wise, we decide to use pictures that we have taken ourselves, as I do not have enough time to draw a good background. So rather than drawing a rushed yet bad backgrounds, I figure a good photography will do the trick. The same backgrounds will be edited to show the difference of timing, like morning, afternoon and evening. This allows us to make the game seems to have a sense of time and varied backgrounds even though some of them are of the same places.

Interactive Media Research : Programming Languages

Post [ONLINE] Available from : %5BAccessed on 18/4/2015]

Due to the kind of work associated with interactive media, programming languages are what we will use at some point in time to create a project. There are many kinds of programming languages, from the very old C language, to it’s more popular evolution of C++, with others that appear which is very different in syntax (the way it’s typed) and difficulty(readability).

For the past few years, I have tried to learn some of them because I was quite interested in making video games, which makes programming languages very essential in this area. Especially for my previous course, which I have decided to specialise in video game creation, the time spent on learning these languages increase even more. I started with the basic language that the school taught me, ActionScript, a Flash language that used to be very common in the web due to its ease to export and play media online. This language, though called basic, is actually pretty tough to learn. The syntax is not very readable with plain English, it’s not as bad as C or C++ which is essentially much harder to read as it’s closer to pure computer language.

ActionScript, now in it’s 3rd version, still presents me with challenges when I’m using it to create game or any online media. Though there are many tutorials available both offline and online, I still could not get my head to master it completely. It gives me lots of headache with weird errors that is never explained well enough, forcing me to go online to search for help or answer.

Then, a year later, I got to learn a newer language, JavaScript, for the game engine Unity. This time, it is easier to read, to me, much easier to code. The readability is more similar to plain English and I could do many functions with lesser lines of code, unlike ActionScript. After researching more on this new language, turns out there are a division on the type of programming languages. One is the pure programming language like C++ and ActionScript, the other one is Scripting Language, which nowadays serve almost similar purpose. The latter is termed to be easier to read and type than the former due to them being newer and thus the compiler is more advanced in understanding what the programmer wants using fewer lines of code.

Later on, I get to know Python, which is one of the most simple scripting language I have ever encountered. Almost anyone can read it and understand it. The amount of line used to set up a function is reduced dramatically from the likes of ActionScript and even from JavaScript. This makes me really interested in Python and have experimented with it multiple times. It is almost as simple as HTML, a marked up language for creating webpages, but have recently been used in making simple game using HTML5.

According to Python’s creator, Guido van Rossum, his philosophy in creating this language is

  • Beautiful is better than ugly
  • Explicit is better than implicit
  • Simple is better than complex
  • Complex is better than complicated
  • Readability counts

He believes that programming should be made as simple as possible so people could focus more on other areas like the visuals or sound. In the past, programming languages deter a lot of people from taking it up, but now with the likes of Python, almost anyone can script or program a language easily, allowing many creative minds to unleash and more interactive contents to be produced in a shorter, less headache inducing method.

Thus, when I learn that I may have to use Flash for this module, I was quite a in a bit of disappointment. True, ActionScript is still used in the majority of the web, but now there are many more better alternatives, especially for producing Interactive Media Visual Storytelling that my group planned to do. For the first few weeks I tried my hands again on Flash, tinkering with the options and learning from the workshop, which actually uses HTML5 to code. Sadly, there are still some weird errors that could not be explained happening almost everyday, leading me to delay my drawings just to focus on programming. This makes me terribly inefficient as time is spent on programming. Worse, I might not be able to get a good prototype out in time because of these.

I look online for alternative, there are some older ones like Game Creator etc but what I’m looking for is one that employs the likes of Python as it’s main programming language. Finally, I came across Renpy, a Python Visual Novel game engine, that is quite popular and has been used for some time to create 2D interactive visual story. I check the documentations and am relieved at it’s simplicity. Normally, I would have to type something like ‘ define g = Gretel, type Gretel “dialogues”, end’ for dialogues but here, it only requires one line ‘ Gretel “Dialogue”‘. It’s so much simplified than Flash, though for Flash, it is multipurpose thus it’s complexity is warranted. This Renpy is used only for this purpose, which I think is much more suitable to be used for our project as we don’t plan to create anything complicated aside from simple story with dialogues and character drawings. True enough, after the tutorial which I told the lecturers that I would like to switch to a new software for the better interest and purpose, my time spent on coding reduced drastically and I can now focus more on the arts and sounds. Even simple effects such as screen shake, inputting in-game choices are available and can be coded easily to make our story interesting.

I do not regret switching from Flash to Renpy for this project. The latter serves the primary purpose of what we want, that is creating interactive Fairytale story, with as minimum fuss as possible compared to the all-in-one Flash that could do anything but is terribly inefficient at giving us what we need in a reasonable time.

Interactive Media 8 : In-game Choices & Exporting to Android

Today I have experimented with in-game choices, as this is what made the game having multiple choices for the players to choose to experience multiple endings. Starting up, I check the tutorial for game choices, which is available in the software itself. Using the original script, I created 2 simple menu that looks like this:

Screen Shot 2015-04-18 at 19.59.05 Screen Shot 2015-04-18 at 19.59.11

At first the menu is hard to read due to the text being white and the box is paler in colour. Luckily, I manage to solve it by going through the settings and change it with coding too as seen below:

Screen Shot 2015-04-18 at 20.04.26

The colours, font type, font size and even bold or italics can be coded to fit what I want, Python language really is incredibly easy to type and understood. It uses HTML colour code which is one of the more used system in the website. I always employ the website,, to help me determine what code I need for the particular colour that I would use in-game.

I used it for giving different character’s name a different colour so as to make them more visible for reader to know who is talking.

Screen Shot 2015-04-18 at 20.14.33 Screen Shot 2015-04-18 at 20.14.40 Screen Shot 2015-04-18 at 20.14.49

Screen Shot 2015-04-18 at 20.05.59

Lastly, I have also tried to export the beta version to Android and turns out it WORKS wonderfully without any major hiccups. Thanks to the simplicity of the software itself, allowing me to export to Mac, Windows, Linux, iOS and Android easily.

Screen Shot 2015-04-18 at 19.59.24 Screen Shot 2015-04-18 at 20.08.5111160552_10205695555822554_1220378296_n

I have also added a new avatar for the bear that will be accompanying Goldilock.

3BearsThe bear is designed to look like the real bear, but still wear a pair of trousers to make it more human-like/fairytale like. I make sure not to change the appearance to differ from the original too much to keep authenticity.

Interactive Media 7 : Programming with adding effect to Image and Music & Progress

After further learning of the code process using online materials such as (Renpy wiki) and Forums, I start to get the hang of how things work in this software. And through all these, I am finally able to add effects like ‘dissolve’, fade in fade out for both images and music. Scaling of images can also be done through coding, along with the colour of the menu buttons etc. Everything can be changed with just a few lines of code or editing of the original!

Renpy really makes things easier than Flash. I made use of some Royalty Free Music from youtube and convert them to .mp3 format using the website ,, while the images are taken from my group-mates who designed/gained them from some supposedly royalty free sources.

Much of the problem has been solved now and all that is left is for me to draw more characters as avatars for the game, along with tweaking/editing of the background picture to give a feel of morning, day or night for further realism. Characters conversations has been smoothed out and reedited from the original ones, as I felt that the latter is a bit too long or wordy. I found that a shorter and simple sentence fits the visual story as it also depends on visuals to tell the story, so I try to focus less on the words, though they are still important.

Next I’m going to try exporting the app to Android for testing of the platform, however, I run into some weird problem that prevents me from doing so. It could be something to do with the coding it seems. Gonna check out the forums again for better understanding of the code error.

Meanwhile, Goldilock’s Avatars are finished, but I must admit I’m starting to run out of ideas on how to make her stand out. As she is a performer in this story, I tried to give her a more funky looks, with glasses, and star tattoo on her cheek, together with purple hair. I felt that this character still lacks something essential to have it at the same level as Gretel or the Witch, so gonna ask the group to hear their opinions in this!

GoldelockNormal GoldelockSad

Day, Night, Morning changes to background

Screen Shot 2015-04-17 at 01.13.35 Screen Shot 2015-04-17 at 01.14.06 Screen Shot 2015-04-17 at 01.14.29