UNIT 65 ASSIGNMENT 1 Kyle Gittings

INTRODUCTION
In this assignment I will be researching and detailing various pieces of information on
animation. Including: history, variants, methodology and more.
I will look at the formats it can be made in alongside the methods used in each
practice. There are two main formats for animation, physical and hand drawn. And
digital, generated on a computer.
Computer generated animations can vary from a small little rollover on a webpage,
to a airplane exploding in a blockbuster movie.
USES OF WEB ANIMATIONS
BANNER ADS
Web banners are a huge part of modern web-based advertising. They were first introduced in January of 1995 and to this day are
just as necessary. Web banner are a form of advertising that is commonly seen on web pages, their purpose is to redirect a sites visitor
to an advertisers site when they click the banner. That is their purpose, but they still need a reason that people would click. The
incentive used to attract people is usually a discount on a product are an offer on a service, these sales techniques are usually
accompanied by highly edited imagery or videos that were made to look as good as possible.

When you look at how many inventions and products have been made redundant over the past twenty-five years the results are
staggering, this leads you to wonder. Why have web banners survived so well. It’s quite simple really, people prefer to view pictures
and visual elements more than they like to read text (graph below). Combine this with the names of their favourite brands (targeting
advertising), and the chance at a bargain they’re very likely to click the link.

Targeted advertising is the act of monitoring your search queries. By doing this advertising services can predict the kinds of products
that would be the most beneficial to show you and then select that from their archives. Therefore, if you search for a product on google
or amazon etc. you’ll see adverts for the product on the edges of web pages and Facebook etc.
ANIMATED INTERFACE ELEMENTS
Animated interface elements are a very common group of elements that you may not notice as they can be subtle changes, or you may
have seen them but do not know what they are. They’re objects found on webpages, Software including Operating Systems like
Windows, Android etc.

A simple example of a AIE is a rollover button on a webpage, when the viewers cursor enter the confides of the button the cursor
usually changes to one that represents a clickable element, and the button usually changes colour or triggers some form of aesthetic
change. A common occurrence of this in the Android OS is the dropdown menus. When you hover over the menu, you can see the menus
cascade down from behind the button, and usually out to side from the menu item you select if there is a sub-menu.

On applications like Snapchat, Facebook and many more they have live feeds. Due to the fact it would be irritating if whatever you
were reading kept moving down the feed when something new was posted, they have implemented a manual refresh function. This is
carried out when the user pulls down the top of the feed and let it go, when this happens a little loading wheel is usually exposed
which spins until a new item is found and the page refreshes hiding the wheel of loading.
LINEAR AND INTERACTIVE ANIMATIONS
Linear animating refers to the process of animating videos and any other form of animation that is pre-rendered. Linear animation is
the same every time you play it, no matter what it will appear how the animator designed. This method is what is used in CGI, movies,
information videos, adverts and for things like rollovers and loading wheels etc.

Linear animation is solely created to watch as a passive element, where as interactive animation is designed to immerse the user. The
most successful and popular medium of interactive animation are Video Games, the big video games industry bring in billions of
pounds a year. They are so popular because players can be immersed and escape into their world, this is thought to give great
satisfaction and release endorphins due to it being a diversion from their usual life’s, this is known as diversion, a theory widely
popularised by philosophers Blumler & Katz.

Interactive animation is a more complex animation technique due to it being more in depth and allowing for several different
outcomes. It is constantly generated so that the users actions can have an outcome on the game or process. Because of this it requires a
different skill set than a linear animator.

Another example of interactive animation that is more simple than a video game is an information kiosk. They present information, and
the order they give it in is dependant on the users button presses, but does not take as much skill or time to create as a video game.
PROMOTION
Another common use of animation is in advertisements, they tend to use 3D rendered animations of their products so they can control
every element of the display including the lighting and positioning, it would be difficult to show a video that spins a laptop around to
all angles within 360 degrees as it would be near impossible to film. Additionally, they can easily put the product on a white
background or whatever background they want with little difficulty. By controlling the entire objects’ characteristics they can ensure the
product is looking its best. Animation can also be used in adverts to try and better sell toys and merchandising to parents of kids. For
example, by having an animated character out of Star Wars in the advert that sells a Star Wars toy, it is twice as likely to sell.

Animation is also used on digital billboards so they can make the product look more appealing, in America their car billboards have
wheels that appear to spin. The animation is also used to change the adverts to get as many on one board as possible.
INFORMATION
Animation is an effective way to help educate people, this is particularly useful when trying to inform children about something. This is
because they're more likely to be interested in the animation due to the colours, simplicity and shapes.

Places animations are commonly seen are museums and shopping centres. In museums they tend to be used to show people videos of
what the exhibits might have been, for example animations on ancient Egypt and how they worked , or animations of Dinosaurs in their
exhibits. Another place animation is commonly used to share information is at information kiosks in shopping centres, hospitals and
parks/events like Blackpool Pleasure Beach. They are commonly used to display directions and information on parts of the facility.
They usually utilise animation for seamless transitioning and rollover buttons/menus.

Another place animations can be used to give information is in schools, this again is due to the increased attention children provide to
cartoons as appose to videos. Animated cartoons are used to teach children about none child friendly topics like fires, violence etc. it
can help teach them how to react and protect themselves without directly exposing them.
ENTERTAINMENT
Entertainment is without doubt the biggest purpose of animation. There are billions of uses of animation in Cartoon shows on TV, Movies
released using CGI or all animated, and both mobile and console games. Entertainment provides joy which is a big selling point for
anything.

We use animation to create realistic scenes in blockbusters that would otherwise be impossible or too expensive, as well as creating
more aesthetically pleasing appearances for children to view content. Animation is used to provide all games with their graphics which
in turn are all used to entertain us, the consumer.
CONCLUSION
HISTORY OF ANIMATION
HAND DRAWN
Hand drawn animations are one of the oldest forms of the artform. It was made widely popular in the 1930’s when Walt Disney
released his first ever movie Snow White.
FLICK BOOKS
A flip book is a collection of images that when flipped over, give the illusion of motion and can create animated sequences from simple
objects such as a small book, a rather affordable medium.

They were very popular toward the end of 1800’s, but are still produced today. Flip book is the American name which is even used in
France, more often than its French name. British people call it a flick book; as well as the less usual names such as fingertip movie, flip
movie, riffle book and a hand cinema.

Some authors compared the flip book to the Magic book, a chic style of book in 1800’s that could exhibit animations or optical
illusions. The only common trait is they were both used to demonstrate the principle of animation.
ANIMATED CARTOONS
Animated cartoons are the modern upgrade to a hand drawn carton. They utilise what is essentially the same method, however they
apply it in a digital manner. Instead of each frame being drawn onto a page in a book. They're instead drawn onto layers. The
computer then switches these layers out a set amount per second, this is measured in FPS (Frames Per Second). By changing through the
images so quickly, they’re able to create the illusion of motion.

This practise started off simple as 2d drawings but over time, the lip syncing has gotten more accurate, the animated physics has
become more realistic and the FPS’ have been raised high enough so that it can all look like a realistic video. The complexity that
animations can be made into is more than capable of fooling the human eye into believing it’s real (See CGI).

These mediums of entertainment have become widely popular due to their ability to visualise anything and for it to look realistic.
ANIMATION PROCESS
The original animation process consisted of artists drawing hundreds and hundreds of pictures. These pictures would then be displayed
quickly, usually twelve per second. This was the only available method for creating animated movies back then.

Modern animation can be done a lot easier, the old method of drawing each frame is still sometimes used but it has been streamlined
to be much more effective. However motion tweens are widely popular method of animation due to their speed and ease. In three-
dimensional motion tweens the animator can select and edit any part of the 3D world. For example, if there was a person in the scene,
the animator could alter the motion of their fingers, eyes, nose etc.

Another modern way of animating is actually software based instead of artistically. Known as JavaScript art, this form of animating is
created by a computer scientist. They input JavaScript code into a editor and when they're finished and run the program, is the first
time they’ll see how it looks. The command line method of animating is however mostly used in CGI.
GRAPHIC INFORMATION FILE FORMAT (GIF)
Graphic Information Files, or as they're more commonly referred to “GIF’s”. Are unique picture formats that make them especially
useful. First created by a company called Compuserve back in 1987. The GIF has stood the test of time.

A gif allows for multiple images to be stored in one singular file. What's more, they are presented in that file one after another in a
pre-set series. This means that they can be used for small and simple animations, like a loading wheel or a still with VFX.

Though there is no actual limit to a gifs resolution, they tend to be quite small and they have access to less colour channels which means
when combine with a low resolution they look of very poor quality. It is however possible, though uncommon. To have ‘True Colour’
GIF’s.

True Colour - True colour is an image with a bit depth of 32. due to this it can be represented by 16,777,216 different colours. It is
called true colour because it has the capacity to represent every colour present in the original ‘real-world’ scene at the time the image
was captured.
CONCLUSION
ANIMATION TECHNIQUES
OPTICAL ILLUSION OF MOTION/PERSISTENCE OF
VISION
Persistence of vision, also known as retinal persistence, persistence of impressions and other variating terms. Is an optical illusion which
occurs when visual perception of an object does not dissipate immediately after the light rays cease entering the retina. It is used as a
method of creating animation in films and videos, the first utilisation of this method was by Edward Muybridge who created the first film
using this process.

By presenting a series of still images in quick succession, and utilising this optical illusion. Film creators are able to easily fool our brains
into viewing the images as a moving scene, this is how animation works and we are able to create moving images, films and videos
without using real elements.

This illusion has allowed for a big boom in the animation industry due to it making it possible.

Until later disproved by scientists, it was believed to be the explanation for ‘Motion Perception’ in cinema and animated movies.

Motion Perception is the process of inferring speed and direction of a scene’s element using visual and other inputs. Although the theory
sounds simple, it is difficult to explain in terms of neural processing.
STOP MOTION + CLAY MATION
Stop-frame is the second stop-motion technique, it is when multiple images are played in quick succession. These images are designed
to look like there is motion when sequenced.

Stop-frame animation or Stop-motion animation, when used as an adjective refers to the animation process in which an object is
physically manipulated and pictured in multiple stills. Throughout these stills the object appears to be moving because of the way in
which it was manipulated. A common material which is manipulated in this process is plasticine. Stop motion animation has a long
history in film. It was often used to show objects moving as if by magic. The first instance of the stop motion technique can be credited
to Albert E. Smith and J. Stuart Blackton for Vitagraph's The Humpty Dumpty Circus (1897), in which a toy circus of acrobats and
animals comes to life. The plasticine method has been adopted by wildly successful productions like Wallace and Gromit. Though some
people sill work with this method, most have evolved to doing computer animation as they can achieve the same looks in a lot less time
and with other additional benefits.

In the computer sense, stop-motion is achieved by digitally drawing or sculpting lots of images, they will vary the images, for example
positioning a leg through the cycle it completes when taking a step throughout several images. They then play these images out and
they portray the action of walking. By using a computer program, animators can use a tool called onion-skinning to make the drawing
process easier. Onion-skinning shows the last image you drew as a faint stencil so that you can draw your new image whilst being able
to see how the last was done, making continuity easier.

Continuity - the maintenance of continuous action and self-consistent detail in the various scenes of a film or broadcast.
COMPUTER GENERATED (CGI)
Computer generated animations are created inside of advanced software. Computer generated refers to it being made entirely on a
computer, so this name can apply to a tiny little loading wheel or a huge action packed scene in a blockbuster movie.

Because it is made on a computer the process is self contained and in the sense of a action scene it can be significantly cheaper than
creating the effect physically. Additionally there is less risk as practical effects can go wrong but the prop could purposely have been
destroyed.

Another huge benefit of CGI is its array of abilities, a particularly useful one is masking. This process can be used to add, remove or
cover up imperfections in videos. Like unwanted people or anything that doesn’t fit the narrative.

CGI is not just limited to use in films and videos. CGI can also be used to create two-dimensional animation using methods like motion
tweening or onion skinning. These are key framed animation and onion skinning is the method of seeing the previous frame as a light
background so you can see how the next frame will look when it comes after. This ability is exclusive to digitally drawn animation as
the only equivalent for hand drawn is using a lightbox and tracing.
CONCLUSION
DIGITAL ANIMATIONS
VECTOR ANIMATION
Vector graphics are mathematically based visuals, unlike raster graphics, vector files are compiled as code. When a vector image is
stretched the code runs equating for the scale increase and as a result allows the file size to be increased without dropping the quality
of the graphics. Because the imagery is also saved as code that iterates instead of a block for every pixel, vector images use a
substantial amount less storage.

Because vector imagery is not capable of running code to determine how something should look when it is full of colours, lighting and
intricate details, vector graphics are more commonly used for cartoon style images. And the resize function is mostly utilised in a 2
dimensional form.

Vector graphics more often than not are seen in logo and icon formatting.
RASTER ANIMATION
The term raster image refers to the bitmap method of creating and storing a graphic. Bitmap/raster graphics store information on the
colours and lighting for every pixel. This allows for more realistic graphics and effects. This is typically the most used method for this
reason. Additionally, the demand for 3D realistic graphics in Movies, TV etc. is rapidly increasing whilst the need for 2D graphics
declines.

Because Bitmap has to store so much more information each pixel, it can massively increase the file size of a video/animation. Another
downside to raster graphics is when they are pre-rendered they have fixed resolutions, which means when scaled up the pixels become
stretched and prominent.

An example of raster animation can be seen in the form of a gif. When encoded gifs have fixed resolutions. Just like real-world
recorded footage is in the bitmap format.
COMPRESSION
Once an animation has been completed it is generally exported into a video format. In order to avoid these videos using an obscene
amount of storage space. The videos are ran through a process known as compression. This process essentially removes any
unnecessary data from the files. Redundant data is determined via the use of an algorithm. Depending on the format used a
compression program will use more efficient ways to replicate effects. For example, a compression service could use a lower colour
depth in the content but can replicate the many colours they have avoided using. This is done via clusters of colours which when beside
one another give the illusion of a more complex colour, a process commonly referred to as dithering.

The different formats also fall into one of two categories; lossy and lossless. Lossless compression maintains the quality of the graphics,
where as lossy compression uses methods that can deteriorate the image quality. Some formats do so at an accelerated rate
compared to others.

Another method used to compress files is reducing the resolution. For example if you have an Ultra-HD video and desperately need to
reduce the file size you can reduce the resolution to Full-HD. To simplify it, UHD has a resolution of 3000+ by 2000+, where as Full-
HD has a resolution of 1920 pixels by 1080. this means a file reduction of at least half.
FILE FORMATS
When you create a digital object it must be affiliated with a file format type so that
your device can identify which program will be needed to open it. For example, it
would be useless to be able to open a song with Microsoft Word. This formatting
system also allows companies like Adobe to control files created with their software.
i.e. their native format to Photoshop ‘.PSD’ can only be opened using Photoshop.
The most common formats for Audio, type and Picture are; PNG, JPEG, MOV, MP4,
WAV, MP3, GIF and more.
CONCLUSION
WEB ANIMATION SOFTWARE
AUTHORING, (FLASH, DIRECTOR)
The first step in creating web animations is finding the right authoring software for you. There are a few, the main ones being Director
and Flash. Authoring software will allow for animations to be created and published in the correct format.

Authoring tools are designed to help producers create elements like graphics, videos and actually for stitching assets together.

Examples of Authoring software are Photoshop, after effects and Macromedia Director.

Photoshop – Used to create, edit and format graphics like buttons and bitmap images. It can also be used to edit videos but it is
hardware intensive and slow so its best to use after effects which the Adobe’s (Creators of Photoshop) version of video editing
software.

After effects – Used to cut, crop, alter, edit, compile, and format video files. You can import a variety of source files from .txt to .gif
and even .tiff these formats are not video formats yet they're still compile able within after effects.

MX Macromedia Director – Used to combine all your visual assets including sounds, videos, buttons, pictures and animations. Once
they’ve all been imported and coded to be do what they’re supposed to you can publish the file as a projector file.

Flash -
PLAYERS, (FLASH PLAYER, QUICKTIME)
Once you have created your web animations you need to be able to view it. But because of the format they are saved in you may not
be able to play it with any old media player, therefore you will require a specialist media player.

Flash Player – is native software of the Adobe suite. It is specifically made to work along side Adobe Flash, the software commonly
used for creating animations. Is was released back in 1997 meaning that is essentially was thee if not one of, the first pieces of
software of its kind. This is not to say that the current version is twenty-one years old. In fact adobe releases a new remastered and
upgraded version of all its software each year. Flash Player provides you with the same functions as QuickTime but it has something a
little extra as it gives uses the ability to complete time remapping, aka reverse the videos, play them at higher or lower speeds and a
few more options.

QuickTime – is a product of Apple Inc. It is a multimedia player that can handle an extensive number of file formats as well as being
made for multiple operating systems like: Windows, IOS or Linux. QuickTime features a simple UI and provides users with the basic
controls. Pause/Play, Volume UP/DOWN and Time viewing controls. Was first released in 2009 and is therefore a more modern entry
into the world of Media Players.
CONCLUSION