Category: Ben – Motion Graphics

Motion Graphics/Animation Proposal

A sheet containing both my animation and motion-graphics proposal for my project.

(I had to re-upload this post due to WordPress being seriously un-cooperative. Hopefully this one works)

Proposal 1

Proposal 2

This text exists only to prevent the blog post from bugging out and breaking. It seems that WordPress doesn’t like posts with just images, you have to have at least some sort of text to go with it.

Motion Graphics – Sequence Planning

Proposal

The motion graphics in my animation will be relatively simple until the very end title segment. For the most part, the motion graphics will take the shape of text sequences informing the viewer of certain aspects of the game, whilst the other part will be the player’s actual HUD in-game, highlighting different objects and providing very brief descriptions. The final title sequence is where the motion graphics become more visually appealing, involving an animation for the game logo and subtexts.

I aim to upload my trailer to Youtube, and for it to be used as a Youtube ad viewable before a video.

 Technical issues

Technical issues present themselves in the form of resolution and compression. I plan to produce and release my trailer  in a format that is suitable for a youtube trailer, and this means taking a few variables into account. The first issue is what parameters Youtube has for it’s adverts. At present, youtube limits the maximum resolution of adverts to 1080p, and the maximum frame-rate to 30. The length of the ad also affects weather or not the ad is ‘skippable’, and this parameter varies for different regions.

These parameters are widely acceptable in most cases, and I aim to produce my animation to fit within these quality standards.

When uploading, Youtube will automatically convert almost any file type into the FLV format, however Youtube does provide certain recommendations. I aim to save my final animation to the MPEG4 format as It provides the best compromise between quality and file size.

Ideas/Brainstorm/Concept Art

I want design of my motion graphics to be simple, but also engaging and recognisable. For instance, for the main logo of my game, I’m going to  be using the same original font from Jaws, as well as a piece of iconic imaginary from the film integrated into the logo. These recognisable shapes and styles should help people bridge a connection between the game and the film.

I attempted a few designs before deciding on my final peice.

Jaws Logo 1

This is the most basic design I had in mind, and would set the general look for my other experiments. I wanted to mimic the famous visual of the shark from the Jaws movie posters into my graphic to help people make that connection. In the end I felt design felt far too basic and crude.

Jaws Logo 2

A step in the right direction, adopting a slightly more minimal style. For this logo I used the same font used by the original film, further bringing it closer to it’s famous hollywood roots. The image of the shark remains an important part of the design, but I redesigned it slightly and removed the teeth.

Jaws Logo 3

The final rendition of the logo. I added a gradient to provide some depth, and water caustics either representing the surface, or giving the impression the logo is submerged underwater.

Jaws Logo 4

 

This design harkens back to the original style even further, adopting a mennacing red giving the impression of blood stained water. I added the black background for dramatic effect, but I think this style may be too similar to the original, and I want to present my own style.

Gameplay

The integration of motion graphics into gameplay can be achieved through HUDs, waypoints, notifications and menus. One of the gameplay features of Jaws is the ability to scan objects and creatures, highlighting them and displaying their name. I want this feature to be showcased in my trailer at least once, integrating motion graphics into the gameplay.

Tetra 1

Tetra 2

Again, I tried a few different styles that give different effects. I really like both of them but I favour the last design, simply because it’s easier to see.

Moodboard

Jaws Mood Board

A similar moodboard to the one I created for UPGRADE. I wanted to give a sense of the ocean depths, by having lighter more colourful settings at the top, that gradually gets darker as you decend. Not only that, but the moodboard mimics certain scenes that will appear in my animation. It’s helped me gain an idea of what colours and what settings I want to use when I come to animate.

Motion Graphics Storyboard

This is the basic premise for my animation. The art is very rough, and doesn’t represent the final style of the animation.

The scenes not containing motion graphics have been included, but are greyed out. Any motion graphics that occur between these scenes have been noted below inbetween the panels.

JawsBoard 1 MG[BETWEEN SCENES] “Stranded and alone”

JawsBoard 2The first real motioin graphic in the animation. A small holographic ring appears around the fish and tracks it’s movement, while a small white line appears and displays the it’s name at the end. This is used to display a gameplay element in which the player can scan and identify various forms of marine life.

JawsBoard 3[BETWEEN SCENES] “What would you do to survive?”

Ditto with the holographic display.

JawsBoard 4 MGJawsBoard 5 MGJawsBoard 6 MGJawsboard 7 MGJawsBoard 8 MGJawsBoard 9 MGJawsBoard 10 MGJawsBoard 11 MGThe finale of the animation when the logo is displayed. The logo floats slowly down to the center of the screen, at when the ‘shark’ part of the letter A rushes up to meet the logo, forming the complete graphic. I decided to include this quick animation as it mimics the way Great White sharks attack their prey.

JawsBoard 12JawsBoard 13A large shoal of fish swim quickly from right to left, densley covering an area just below the logo.

JawsBoard 14When the fish dissipate, the words “COMING SOON” are visible as the fish swim off screen. This concludes the motion-graphics portions of the animation.

Motion Graphics

Cowboy Bebop – Opening sequence

This is the opening sequence to Cowboy Bebop (1998), a Japanese anime set in a sic-fi late-1900’s western style.

The Cowboy Bebop opening alone presents a whole slew of visuals and themes that are representative of the overall style of the film. Aside from motion graphics in the form of titles, slides and moving backgrounds, a prominent feature in the opening sequence is cel-animation used for the various ‘3D’ objects like the characters, spacecrafts and effects. In certain sequences of the animation, he characters and objects were drawn only as black silhouettes. This is clearly an artistic decision, but it also reduced the animators’ workload when animating complex movement of certain objects and characters, notably the spacecraft.  The bulk of the sequence however is mostly motion graphics using block colour and lettering.

The main technical issue concerning this style of animation comes from the Cel technique, which requires each individual frame drawn by hand onto a physical format, and then scanned into a computer for composition and sequencing. A side-effect of this technique is the resulting quality of the image. In this particular time period, quality depended on the resolution (the amount of pixels present) of the scanned images, and the format it was stored in. Video tapes were the most common method used to store/distribute the content which often degraded the quality both through time, and through continued use.

In addition to the technical limitations of cel, (were it not for the period in which it was made) it may have been more effective and efficient to use heavily stylised 3D renders to create the movement of the more complex objects, such as that of the spacecraft.

In essence, this openeing is an excellent example of setting the tone for the for the film. It’s style is consistent, unique, and showcases the key elements of the film to help inform the viewer on the films overall content and style.

The Coke Side of Life – TV Advert

This is one of Coke Colas’ many different ad campaigns, and this one is unique in that it is entirely motion-graphics.

The advert is effective at conveying its message, and does it through a simple, minimalist style that reflects the colours and shapes we associate with Coke Cola. For the most part, the animation isn’t necessarily complex nor engaging, but with a simple art style, less is generally more. Coke Cola wanted their message to be delivered quickly and clearly and this art style can create that effectively.

This animation was produced and rendered wholly digitally. The main advantage of this technique is that it facilitates the clean and sharp style present in the animation. Were this produced any other way, (stop motion for example) there would be a significant loss in the quality and fluidity required to maintain the minimal art style. The one exception to the techniques within this animation is a small sequence at the beginning where the bottle shatters into many individual parts. It’s likely this small section was produced using a form of 3D animation, due to other techniques perhaps not providing the desired effect.

When you establish an art style, it’s important to keep it throughout your project. This is likely the job of a single animator, as nothing particular varied or complex presents itself. The whole animation is relatively consistent in it’s presentation, and conveys Cokes’ message in a way that is clear and quick, suited for a short snappy advert on TV or an ad preceding a Youtube video.

It’s likely that this was rendered out  as .Mp4, Mov or Avi, as this is a Youtube ad, and these are formats youtube will accept for uploading. Youtube does however convert and compress these formats, but its not necessarily important for an advert that is only shown for a brief 40 seconds.

Starwars – Sky Movies Promo Trailer

This is a starwars TV ad created for Sky Movies, aimed at involving a scene from every starwars movie into one continuous, flowing film.

This is one of the more expertly produced and effective TV ads out there. The film is motion graphics for the most part, relying on still images with various effects applied and  placed in a 3D environment in different layers to provide a sense of depth. The film relies on a theme of flowing continuity, in which each scene creates the beginning for the next. Various 2D animated effects and overlays were used to create fire, smoke and mist that add atmosphere to each scene.

Each scene in the animation is a key representation of a specific film, and it plays them in chronological order. As a trailer for starwars, it is key that they represent the films as best they can in the few seconds available for each scene, this is achieved mostly by using striking action scenes coupled with dialogue from the respective film.  The other large portion of the ad is the 3D animation. 3D animation comes into play when the animators reach the limitations of 2D motion graphics. Starwars is world-famous for it’s 3D visuals, so the inclusion of certain 3D scenes helps sell the movies even more, finishing with a dramatic fully-3D piece.

The trailer is a fantastic example of how to sell a product. The film encompasses almost every starwars film and manages to join them together in a fluid and coherent sequence.

Halo – Midnight in the Heart of the Midlothian

Heart of Midlothian is an animated comic series based on the short Halo novel of the same name.

This short film presents itself in an very stylised and unique way. Of almost all of the scenes, characters and actions in the film, very few are animated in a traditional sense. The animation is presented as a series of moving images and stills, as opposed to any fluid motion; this gives the feel of reading a visual novel where each scene is treated like a ‘panel’ would appear in a comic.

The animation style of more of an artistic decision as opposed to a result of technical limitation, however it doesn’t mean this style is without its limitations. The lack of fluid movements requires the artists and directors to ‘create’ the expression and action and movement in their drawings, and also make their drawings immediately interesting for the viewer, as some images hang for a long time as dialogue is played.

‘Animation’ does present itself to an extent in the film through simple movement in some areas, such as the character limbs and object movement. This was probably included as a way to prevent the motion graphics from becoming to stale and ‘linear’.

The format of this film was dependent on where it was meant to be shown. Halo released these short videos on Youtube and through Halo Waypoint (A social-media style site), which means that the final rendered format of the movie was intended to fit these such sites, i.e: rendering the output as .Mp4, Mov or Avi, all formats youtube will accept.

The basic characterises of this animation are incredibly simple, and be created with relative ease through Adobe Flash or After Effects, so its the artistic direction and story element that hold it up as an impressive short film.