Now that the planning stage of my animation is now complete I have written a basic structure to my narration which I will record first and then proceed to animate the spoken words once narration has been recorded and edited. My plan for my essay is based loosely on the structure of a  Kurzgesagt video displayed above. By watching the video a few times I pinpointed the keys parts of creating an interesting introduction followed by an engaging essay body and conclusion, I found the intro follows as such for each video, given that this is an extremely successful animation based channel I feel it is an advantageous choice to take inspiration from them.

Short (“Clickbait”) intro

Start with a short, one line statement that instantly grabs the audiences attention

Ask questions that are going to be answered

Peak interest early by displaying large amount of information that is interesting

Provide minimal actual text, but give an insight into what is coming up

The body and conclusion of my essay is as follows, taking loose inspiration from parts of the videos but focusing on input correct, persuasive and interesting information

What would you consider the worst thing to plague humanity? Homelessness? War? Famine?

What If I told you all of these were wrong, what if I told you there was a problem within our everyday lives that is worse than ALL of these… I am, of course, speaking of (long pause) digital Superfluouism.

But of course, you may be asking, well, what even is digital Superfluouism?

Digital Superfluouism occurs when an individual attempts to communicate through “Text Talk” too to much of an extent. Within the process of this words are abbreviated far too harshly, disrupting the flow of conversation, negating the entire point of shortening a word by making communication even harder.

Have you ever been having a wonderful conversation with another person, like… Regular, respectable human beings, only for it to descend into chaos once horrific words like “fing” and “wiv” begin creeping into use. Have you ever been confused by someone’s horrific attempt at saving writing time? Then you have been a victim of Digital Superfluouism.

While you now may be asking “Well it does reduce writing time so surely this is a good thing?”. I assure you that while reducing the time to write a message, it lengthens the reading time once it has been sent, potentially forcing the recipient to repeat what you said, once that occurs, even the time saved writing the original message is negated due to the need to repeat what was said.

Well now I’m sure you’re asking something like “well this isn’t really an issue is it?”. This is a huge problem but together, we can make it…. Better. We can remedy this issue, How do we do this though? Well the answer lies within proof reading. I introduce the write, read, send movement.

With an aim of reducing the amount of Digital Superfluouism in the world, Writing, Reading then Sending allows the sender to review their message, evaluating the clarity and correcting any Superfluous comments. I believe this would not only improve talking to friends and relatives through text but also working to improve those times when formal writing Is required.

I hope this can help to make people aware of a huge problem in our society and to begin a change that is so desperately needed. Help remove Digital Superfluouism today by remembering to Write, Read, Send. Thank you for listening.

The above Illustrations have been created using Adobe Illustrator, I decided to use this programme in particular due to the fact that Adobe Illustrator creates vector images, meaning they are constructed using mathematical formulas rather than pixels so the resulting illustrations become lossless, meaning they do not lose quality and become “pixelated” once resized. As i plan to resize all of these illustrations within my animation it was important that they were created in Adobe Illustrator, yielding a crisp and smooth finish no matter the size of the illustration. They all have very low detail within them, this keeps the style consistent and makes them time efficient to create, the lack of detail will not matter too much due to the fact that they will only appear on screen for at maximum, a few seconds. Some of these animations will only appear for a few frames so I have simply drawn the outline and imported that as the final outcome, if placed on a plain, white background only drawing the outlines will be most effective, appearing as though the background is a sheet of paper and the illustrations have been drawn on, giving a purpose to the distinct lack of colour.

For drawing the hand illustration i decided to speed up the creation process by taking a photograph of my hand to act as a rough estimate for line length, lighting and smaller details, I then begun by drawing the basic outline of the hand and arm with a width 8 brush on Photoshop, although I realise that illustrator allows illustrations to be in vector format i still decided to use Photoshop due to multiple factors, firstly because i know the tools of Photoshop much better than illustrator as well as the fact that i would not need necessarily need a vector format illustration because this particular example would not be resized so the problem of pixelation would not occur. This made creating the illustration much quick due to my familiarity with the tools i could use, once the basic outline was done i applied a base colour to the arm and clothes, seen as the middle shade in both of these. After this i then applied the lighter and darker shades using the brush and pencil tool before finally tapering the ends of all the detail lines manually using the eraser tool. I think this works effectively, inspired by the “Your country needs YOU” war propaganda poster I decided to single out each member of the audience directly as I feel this will be more effective in grabbing peoples attention.

Firstly, to being developing ideas, after researching numerous examples of kinetic typography on platforms such as YouTube, I took inspiration from these videos and began sketching initial ideas for individual animation ideas. Finding ways to condense the text down so that the screen isn’t flooded with an overabundance of body copy and instead using the animations themselves to tell the stories that would be being narrated. Sketching out my plans before spending a large amount of time animating them allows me to see a rough estimate of how effective the final outcome will look while also being able to plan how I will actually apply the key-frames ahead of time, effectively cutting down the

The beginning of the walking animation sequence is a simple three frame repeating movement, used simply to sketch out what the characters will look like roughly and how I originally plan to key-frame the movement within After Effects. This was effective in exposing any initial problems that occurred in the planning stages and allowed me to progress onto a more complicated sequence using more frames as well as actually getting to the stage of animating it digitally using After Effects.

For the parts of my animation when illustration and imagery is used I have imported files in from Adobe Illustrator, for this example i have created a animation walking sequence for a simple stick-man, although I do not yet know where this will be used within my animation, or perhaps if it will be used at all I felt it necessary to create this sequence as it is such a basic and key part of animation. Although the sequence only lasts  a total of 8 frames the fact that the 8th frame is very similar to the first it can be repeated endlessly to create a flowing walking motion. I

To Further enhance my level of understanding within Adobe After Effects, I decided to continue my experimentation into creating my own kinetic typography. This time i looked into more specifically the different animations and text transitions that I plan to use within my own animation, experimenting with key frames and forms of motion blur to give my work a more dynamic feel. Now knowing that I want my animation to contain at least some kinetic typography techniques I have implemented more space for body copy. My initial plans include having every spoken word appear on screen alongside some imagery, the examples below showcase some dynamic ways that this could be done, utilising the space well and still being able to include large amounts of highly detailed and easily legible body copy text, by using high contrast colours to represent different viewpoints/topics.

After completing these experimentation’s for a second time I feel its next appropriate to create some Illustration examples, as my animation will need to be varied and show a variety of skills within After Effects to be completely effective  as well as requiring extra animations in order to keep my animation interesting, innovative and dynamic. I would like to experiment with some simple animations first, possibly walking sequences of only a few frames. Perhaps sketching characters out in my sketchbook first then progressing onto After Effects will be a smart way of doing this.

Storyboards

https://www.animatron.com/blog/what-is-a-storyboard/

What are they for?

In Film; Storyboards are created to assist film directors, cinematographers and television commercial advertising clients visualise the scenes and find potential problems before they occur. As well as this storyboards also assist camera operators by providing examples of the types of shots and angles that may be used. Storyboards are also used to help estimate the cost of a production, saving time.  in the case of interactive media, it is the layout and sequence in which the viewer sees the content or information. In the story-boarding process, most technical details involved in creating a film or interactive media project can be effectively described either in picture form or using additional text. Creating a storyboard is a very vital part of the production process as it helps to create a plan for production by providing a basis for the story that will be told as well as a list of shots used.

What do they need to include?

Storyboards require a certain amount of specific information to be effective and assist in the production of the films/animations . Some of these things include; A Screen ID, a screen ID or identifier is a way to quickly identify in what order events occur, present in every slide a screen ID is fundamental to creating a successful storyboard. Alongside this text is also very important for a successful storyboard, this delivers critical information to the viewers of your storyboard. The format and style of your text should be very clear and thought out, ensuring that only the essential text is included as well as enduring that grammar and spelling is immaculate consistently throughout. Images are a very obviously important element of creating a storyboard, having clear and well presented graphics helps to translate your ideas more clearly and speed up the production process. You can also include audio narration clips into your storyboard to help get your ideas across to others. This can be done in the form of a narration script, details such as the type of voice should also be included. Having high quality and clear navigation is extremely important when creating a storyboard, you do not want your viewer reading a story backwards so having a clear click path through your storyboard, a good way to achieve this is by creating a digital storyboard and adding “next & Previous” buttons onto your storyboard to prevent confusion and heighten the quality of your work.

How do the images tell the story?

Images in storyboards tell a story by providing a screenshot of each scene/ camera shot alongside text normally under the images describing where the scene is and what the content is within the image. This gives others in the production team a short idea of what the product is going to be like, how it is going to be shot and the themes and locations included In the project.

Researching Storyboards

“Gone with the Wind (1939)”

William Cameron Menzies created storyboards for many famous films these include: Gone with the wind (1939)

This storyboard is created using what looks to be pastels. Along with the colours used it makes the faces on the drawings have heavy shading, however in certain parts it looks as though paint is used. This is particularly apparent in the smoke and flames seen, the use of paint would help to capture a feeling of motion in them as well as to make the characters appear as though they are moving in  a direction.

The lack of colour in the characters helps to bring out the intensity of the burning fires and the explosions as It creates a large contrast. I like the shading and detail in the characters faces as well as the thick black lines used throughout.

“Spellbound (1945)”

This  screenshot taken from a storyboard, created by William Cameron Menzies is for the film Spellbound. The work itself is stripped of colour and left with only shades of grey, white and black. Since the film is also shot in black and white I feel this technique of drawing is appropriate and works quite well with the content of the storyboard itself. It appears as though the characters in the work blend into the various scenery, this effect is achieved due to the similarity and limitations in colour. I like the way this piece is created because even though very small amounts of colour are used it still retains a large amount of detail throughout.

However I do not get any feeling of what the film is about in this storyboard as many people see storyboards as a snapshot of a point in a scene that explains what the film is about. This storyboard seems rather random in it structure, however this itself may be an insight into the film as amnesia plays a large part in the plot of “Spellbound”.

“Psycho (1960)”

This storyboard, created by Saul Bass, depicts the shower scene in the 1960 film Psycho. Bass appears to have used an ink like material to create this storyboard. This works well because the ink gives off sharp thin lines that accurately create the water running for the shower as well as the characters face. The thin lines also allow bass to include immense detail into this piece, this in turn creates a large array of emotions into the character. In the later drawings an example of cross hatching has been used to create backgrounds as well as hair, along with the shadowy killer in the scene. The pure black that is created by the ink gives a heightened sense of danger to the figure as it is more clearly visible in the drawings yet we do not know his identity.

Animation Storyboards Analysis

“VeggieTales”

This storyboard, created by Tim Hodge is created using pencil and is for the film VeggieTales. The style that Hodge has used to create this is using minimal lines and rough shapes to create characters and faces. Hodge has also avoided using overly large amounts of shading and avoids  making the characters look realistic with no light sources or shading within the faces. There is no pattern to the work as it is made to describe a film plot and therefore needs to be as descriptive as possible. This also removes symbolism from the storyboard as everything drawn onto the board is purely for decorative purposes.no additional colours have been used apart from black and white made from the pencil lines. This helps to give the storyboard a more striking feel as that lack of colour along with minimal shading and blending make the different shapes stand out more such as the characters eyes and mouth. It does not look like this specific storyboard has been digitally y enhanced, it has been created by hand and left like that to help create a natural mood within the storyboard. Another thing to note within this storyboard is how Hodge does not let the borders of the boxes cut off his illustrations, by continuing to detail characters even outsides the borders it shows that this is an available technique to keep in mind when creating my own storyboard for my animation.

This storyboard, created by Tim Hodge is made using pencil. Hodge adopts a style of heavy shading and large amount of detail to create a more realistic looking storyboard. Although there is no colour to this storyboard aside from the different shades of grey weand black created by the heavier and lighter areas of shading of the pencils used. No symbolism is used as the storyboard I created to convey an accurate description of a key point in the films plot and so all the features include are descriptive to help create the scenery that the character wold actually be in during the film. Large amounts of blending have been used to give objects and characters different angles and to convey an accurate feeling of lighting. There does not appear to be any digital manipulation for this specific storyboard all the work has been created by hand to create a dark and jarring mood which is enhanced by the lack of colour.

Creating My Own Storyboard

When creating my own storyboard I came across a few problems. The main issue was the fact that the large majority of my animations and actions would be shown through the movement of text, due to the fact that a storyboard contains static images i could not provide much insight into what I wanted the transitions to look like, although I could explain them further in the text below. This meant that the text descriptions became extremely useful in translating my ideas when I was presenting this storyboard /plan. I found creating this storyboard very in allowing me to progress much further in my initial ideas and concepts by making me put a much larger amount of thought into the transitions and animations that would be in my animation. Not only this but i also had to think about my stages of making for the entire project, eventually deciding i would narrate an already written essay using  a sound reorder, then importing the audio clips into Adobe Premiere Pro so i could clip the audio files when necessary. After that i will then progress onto After Effects to complete the animation before re importing into Premiere pro for exporting, combining clips and inserting sound effects timed with the actions on screen

Firstly, to being developing ideas, after researching numerous examples of kinetic typography on platforms such as YouTube, I took inspiration from these videos and began sketching initial ideas for individual animation ideas. Finding ways to condense the text down so that the screen isn’t flooded with an overabundance of body copy and instead using the animations themselves to tell the stories that would be being narrated.

After sufficient research into various topics I decided that I want to create my idea utilising the medium of kinetic typography I began sketching initial ideas and concepts, while simultaneously exploring different ideas through further research. The majority of this work was done within my sketchbook, creating mind maps to brainstorm ideas and sketching out potential layouts.

ISM Idea Generation

To try find the name for my movement “Ism” I wrote down, in a spider Diagram format a series of things that I: felt passionate about that I could Not find especially represented, things that I thought could be potentially relatable yet also have not been brought up to any significant degree Previously, finally I listed all the “pet peeves” I have, as I feel as though using This project to create an animation that is designed to persuade others to Share in my hatred for minuscule things would be challenging yet would also Be achievable, as I would be passionate about the topic I decided to choose. This also opens up many opportunities for Satirical and comedic instances within The animation.

Once i figured out what my topic would be talking about, i then began coming up with a name of my movement. Due to the fact that my movement was stopping People trying too hard to “text talk” and in the process making communication even harder, negating the point of shortening words etc. I had a few ideas in mind for what my ISM could be called, below is my thought process and the progression of my concepts for the name of my ISM, taken from a Microsoft Word Document

ISM name:

Textism

Condensism

Inappropriate Condensism

Unnecessary Condensism

Needless Condensism

At this point i began looking in a thesaurus to find a word that would better describe my movement only a couple of words at maximum, as well as a word that could be easily remembered as I feel that will help my message to stick in peoples heads better.

Superfluous- Extra, Unnecessary

Superfluousism

Superfluous Condensism

Digital Condensism

Digital Superfluousism

Digital Superfluouism

Eventually settling on “Digital Superfluouism” as the name for my ISM movement I can now begin writing a script that would serve as a narration for the animation. I think “Digital Superfluouism” is  a very effective description of my problem as well as sounding unique and sophisticated enough to stick into peoples heads, narration would suit this well due to it allowing me to show people exactly how to pronounce Superfluouism as I’ve had to alter the spelling slightly for it to work adequately as a word.

Initially I researched into animation in general, researching various techniques and processes within both 2D and 3D animation.

Stop Motion

One method of animation that I was interested in creating is stop motion animation, this would allow me to easily combine hand drawn and digital elements, using a large array of programs as well as cameras. Stop motion being a very popular method of animation I would be able to find large amounts of inspiration and research. As well as it being an extremely old method of animation, allowing me to track the development and evolution of the animation technique. With various programs available for aiding in the creation of a stop motion animation.

Researching Stop Motion

After researching Stop Motion as a whole I have decided to look more closely into specific, very famous uses of stop motion within films and animations. I feel this will give me valuable insight into the techniques and Processes used within stop motion as well as allow me to make my judgement on whether i will use stop motion within my own animation.

Wallace & Gromit

To create this famous scene featured in Wallace and Gromit: The Wrong Trousers. Nick Park had to use many weird and wacky ways to create this scene. For instance the background is built  from a 20ft long living room wall, 2ft high, the camera is fixed to the train, this scene is filmed  with the cameras set to a long shutter speed so the background looked blurry. This makes the train stay in focus as it moves with the camera, while the board in the background continuously runs past and repeats, however it is to blurry to notice that the background repeats itself often. This scene takes particular care to achieve the standard that Is needed, since so many character and objects are moving around at the same time and they all need to move relative to each other to avoid some things looking out of sync. Stop motion is used to enhance this scene since if the characters were made digitally they would look less realistic as well as since the rest of Wallace and Gromit is made using stop motion it would make this scene look out of place if special effect enhanced characters were used in this scene but no where else in the short films.

The Valley of Gwangi

This scene is the Valley of Gwangi by Ray Harryhausen combines both stop motion and live section within the same frame, the stop motion moving dinosaur takes the place of the background as the actors in the foreground run away. The constant interaction between the real life actors and the stop motion moving dinosaur make the scene much more realistic and convincing. It also includes areas of stop motion on its own, when the dinosaur fights another stop motion filmed elephant. I think the skills shown in this example are of a higher quality than all of the other examples I have analysed due to the sheer enormity of skills shown with the combination of stop motion and live action filming, the use of green screens and stop motion characters being filmed amongst scenery. The characters also move very smoothly showing that a large amount of work has been put into achieving high quality finish.

Kinetic Typography

https://designshack.net/articles/typography/kinetic-typography-an-introductory-guide/

Kinetic Typography, first widely used in the 1959 Alfred Hitchcock film “North by Northwest” where movable text Is seen. In essence Kinetic Typography is moving type, classified as a technique within animation, the term “moving Type” is given to any type of typography that is seen to expand, shrink, or move/change in any way, effect complexity  Vary greatly from a simple rotation all the way to elaborate full length animation films and shorts.

Kinetic Typography is most effective when used for the purpose of creating emotional content, such as to increase the emotional potency of a particular scene in a film seems to be a popular choice when doing my research. It is also effectively used when the creator wants to create characters with more depth and feeling, using different colours, styles and layouts to represent the different traits for each character. Finally, and the main reason I have chosen to use it as a large part in my animation project is its distinct ability to capture attention much more effectively than static typography.

Eventually discovering Kinetic typography, and then proceeding to look into examples on the internet. Finding two particular examples that use two very different methods of animating.

“Ira Glass On Storytelling”

The above video is a well known example of Kinetic Typography, i have chosen to analyse this example in particular due to the way that it uses only typography without having imagery to assist in delivering its message, rather than using imagery to help exclaim certain words or phrases, within this work, a more simple method has been used to achieve this. Rather than imagery or illustrations they simply change the type, either by using a more/less bold font or by changing the letter forms to italics as well as increasing/decreasing the size of those particularly clearly spoken words and phrases. I like the way this has been used, making the animation clear and easy to read while still being full of smooth transitions that ensure the viewer does not become confused or bored with what is on screen. Something else of note within this animation is the fact that there is a basic vignetted background that is used and is never changed so all of the focus remains on the typography, I found this animation tracks the spoken word very well, without needing to animate every single word that is spoken i found it to work very successfully due to the fact that you could watch this animation without the audio and still grasp the messages being told as well as understand when words are emphasised alongside being able to gauge the pace of the spoken word. Due to the fact that there is no imagery, the typography must be particularly dynamic in order to keep the audience interested. Luckily the fact that the spoken word is a famous speech does some of the work to keep the audience interested. Although the fast and dynamic rotations of the screen to change the direction of the text at key moments helps to keep the typography dynamic, innovative and interesting. As i plan to use elements of Kinetic typography within my animation this example will be particularly useful in understanding when to rotate text alongside when looking for inspiration for transitions between different paragraphs.

“Kick-Ass”

Another example of Kinetic typography. I have chosen this particular example due to its contrasts to the previous example i have annotated. Of the two examples I do prefer this example, i feel the use of imagery helps to not only make the animation more aesthetically pleasing but also matches the background with the hand drawn looking illustrations and typography. While in the previous example an animation utilising solely typography looks very clean, unless given a specific purpose for being made that way e.g. the spoken word describes something specifically about the use of typography within artworks. Using imagery simply gives the audience more to look at, even small, simple illustrations like this one help to translate meanings more effectively and offer a greater amount of opportunities for animation techniques than solely using Typography. The pace of this animation seem very different as well, the use of a slower, panning camera and the fact that the illustrations appear to be drawn on the screen live as the words are being said alongside the general slower pace of the spoken word being animated, the slower pace compliments the handwritten finish showing the clearly large amount of planning and organisation that has gone into creating this animation. While the background rarely changes in setting, it does invert on occasion for dramatic effect, as well as to make the background appear more like a table surface when it inverts to a dark grey rather than the light grey/white shade that is used to represent a background of crumpled paper. This background is very appropriate due to the fact that, not only is the film that the audio used for this animation also from a film that depicts superheroes but the conversation that is animated makes regular reference to Batman, a sufficient reason to theme the aesthetic finish off of. I like the way that this animation looks, the clever blend of typography and imagery makes for a interesting experience to watch. Inspired by this I will ensure to include a equal mix of both typography and an decent amount of self made imagery to compliment the text and narration.

Both pieces manage to lead the eye effectively to the correct focus areas within the screen, with a clean finish making them look professional inspirations I will take from these examples will be ensuring to change fonts/letter styles depending on how the spoken word is pronounced capitalising on changes in pitch and tone so that it is translated through what appears on screen. At regular intervals when creating my animation I now feel it is important to watch my animation with the narration and sound effects on mute and see if some of the more vital messages are still translated, this will show that the illustrations and typography is effective in their communication and that my message is clearly translated through to the audience.

In order to gain a better understanding of the techniques and processes involved in creating kinetic typography as well as to generally improve my overall After Effects skills I decided to create my own short kinetic typography sequence using After Effects. Taking a small section of the chorus from the song “Nevermind”-Dennis Lloyd i have attempted to apply some simple effects to animate the text. Taking inspiration from the multitude of kinetic typography showcase videos i have been researching as well as looking back at my initial ideas and concepts form my sketchbook i am very happy with the result. although there are man areas where this could be improved, for my first ever time using after effects i feel i responded correctly to things going wrong as well as managed to create a small piece of work that i would deem high quality. this has also improved my skills and understanding of After Effects massively, i am going to create more experimentation similar to this but exploring different ideas as well as keeping track of how my After Effects skills differ and improve as i create more pieces of work. For my next experimentation i think i would benefit from choosing a text that is spoken much slower, giving me ample time to include more complex animations rather than a piece of music that i found too fast paced to be able to animate anything substantial.

Below is my first experimentation outcome, uploaded onto YouTube