Visual Essay- 3D Animation Character Design

Drown To Life from Mauro Affronti on Vimeo.

The main thing that appealed to me about animation are the characters themselves. Their exaggerated features that make their role in the animation instantly recognizable if something I find to be very effective in quickly giving a personality to a character in a short space of time. I can see similarities between this style and that of Pixar studios characters such as the Incredibles. 

Each character is recognizable for their individual physical appearance that in some cases is exaggerated to make it abundantly clear. This aspect of producing characters that are visually interesting and stylized in a caricaturist manner is something that has always appealed to me. One reason for this is their simplistic design that has a sense of humour to it, coupled with the animating style that complements the characters appearance with an exaggerated movement style that suits the visual style as a whole. For example, the Drown to Life animation has two characters, the small child character that has a scrawny body with a large head. His movement is very quick and nimble, which is something expected from a character of his style. Meanwhile the other character, the large, angry man has a much bulkier movement to him that reflects the character being big and overweight. However, even though both characters are very different in terms of their physical design, they both also move in a slapstick manner later in the animation with them bouncing around, fighting each other.

Fallen Art from Mata Leao on Vimeo.

This other animation also uses this exaggerated style for its characters, but also utilizes it for the environment and structures as well, with very elaborate contraptions and rickety tower buildings that would be impossible in reality. The emotion conveyed, much like the first one, is done very effectively without the used of words, but rather the facial expressions used. In the first animation they are all very exaggerated and comical and compliment the theme of it, however in 'Fallen Art', the second animation, each characters facial expression is much more detailed and realistic with slight sighs or audible cues narrating their emotion as well.

Typography Research

I also looked into types of fonts that would be suitable for use in my website.

Calibri

Arial

Times New Roman

Verdana

Courier New

The above fonts could all be used for the majority of the text used as they are all very simple and clear to read. Personally I would want a san-serif font for my site. The fonts above are all useable through Dreamweaver and I believe are standard fonts used on the web, making it simpler to apply them without having to produce a graphic that contains the font.

Dimitri Swank

Segoe Script

Today

Vivaldi

Criticized

For my header text however I would prefer something much more stylized that gives the page a visual appeal. The above examples are just a few styles that might be useable, having both handwritten designs along with vector graphic style text. The issue with using these however would be both that I would be required to make a image for a header rather than typing the text because of the compatibility issues as well as it defining a style for the page I must adhere to.

Another reason I would consider using an image graphic made in Photoshop rather than typing in the text would be the amount of modifying I can do to it. Whilst it is possible to adjust the majority of the details in Dreamweaver it is still rather limited in the positioning of the text and the page and the vertical spacing of each word. An example below I made in Photoshop captures the style I want to use on my website and was simple to make by using the variety of text editing tools and freedom to move it wherever within the page. As long as the image matched the dimensions of the header itself it was simple to move the text into a position where it would be placed correctly on the actually webpage.

Image File Types

As part of my research for designing my web portfolio I looked into image file types and optimization to get the best quality image whilst keeping a high quality. The image below is split into thirds showing three of the different file types, left to right: GIF; JPEG and PNG. The difference in quality is most noticeable with the GIF section of the image that has a lot of the images as blocks of a single colour that doesn't maintain the detail of the original image. This is mostly due to GIF being used for vector images that have limited amounts of block colour because of a GIF's limited colour palette. The JPEG and PNG sections both have a higher quality compared to the GIF, however I think for the majority of the images I put on my site I will use JPEG images because of file size.

File Sizes:

• GIF:  515KB
• JPEG: 170KB
• PNG 24-bit: 1.04MB

 The large difference in file size between the JPEG and PNG files is substantial and with little noticeable difference it seems unnecessary to have such a large image file that would require more loading to access my website.

For the images I want to be of the highest possible quality, namely my gallery images, I might still use PNG as there is still a high amount of data lost when a JPEG is placed onto a website, making the quality reduced, whilst PNG's, being lossless, maintain the same quality and would be best for large detailed images.

 

Website Wireframes

Some designs I have made for my online portfolio. Looking at different existing sites and examples I am planning to have a sidebar navigation layout with the main focus being on the rest of the page where the main content shall be.

 The last three designs feature moving tabs that extend when hovered over to make it clear which one is selected. This would be something I would want to achieve as I believes it gives it a professional appearance, however the research I have done so far into the effect has been unsuccessful in finding out any methods to produce it, other then some similar examples utilizing Javascript.
I still like the rest of its simplistic design with the navigation located where it is along with the header aligned to the right.

Narrative and Authenticity Reflections

Having recently watched a video discussing narrative and the authentic self there were a few points that interested me when I considered them. One point stated was that of the two being connected by associated values in the sense of maintaining consistency through coherency and growth possibility. From this I gather that in the same way that a story has plot points or aspects that allow for further development of these ideas or twists in the story arc, ones description of their authentic self through narrative is used to show possibility and change the unordered chaos of life into a more logical order show development and progression.
Another point made by Father Tim Clancy in the discussion was the way we cast ourselves in a narrative has an effect on our esteem or emotions. Stating that bringing coherence to everyday events or activities can empower or dis-empower you depending on the genre in which they are told and what character within the story you play, be it the protagonist, antagonist, hero or victim. To me this reflects on how we see ourselves and the part we played in a particular narrative, effecting our emotions and the opinions of those around us.
Something I thought was related to the idea of esteem and others opinions was a point that they want to be individual, but not separate and stay within a community, making me think of popularity as well as wanting to stand out among the crowd and be unique.

Overall I found the discussion rather interesting in terms of how it approached the subject and the different arguments made for it and to some degree could understand the concept they were describing whilst not having a complete grasp of their ideology.

Narrative and Authenticy 11-16-09

by Gonzagau University

http://www.youtube.com/watch?v=aeT6zO2P5mw

Interactive Moodboard

This moodboard is for my interactive design project to explore some of the different graphic styles I am interested in. In particular I am keen on science fiction and fantasy genres, which could be incorporated into the design, however looking at some more basic graphic images and styles such as pixel art would be more suited to the task.
The fonts I considered all had some character to them and some examples such as the 'cubic' font in the lower right corner might be effective as it is a simple design with straight edges that could look professional for header text.
I also looked at some other work including sketches and concept art, which is one style that could be used, giving it a hand drawn feel, however this would be very complex and might not work well if done poorly.

Simon Cornish- Context Practitioner Research

 

Simon Cornish is an independent animator, illustrator and scriptwriter who provides the Mental Roy character illustrations for a monthly column in 3D World magazine as well as writing other articles and reviews.

Originally starting with a chemistry degree where he worked under a Nobel Prize winning professor, he moved on to a motorcycle instructor business to fund his animation degree. Cornish produces work in a variety of fields including visual effects, 3D CGI and animation working for and having worked with a variety of companies including Future Publishing and related magazines, producing illustrations and writing articles for them as well as a variety of other projects he has worked on for different companies.

One particular reason I like his style is because of the simplistic, comical work he produces. In particular his Mental Roy character illustrations are very varied and in some cases of a mature nature that are very effective at conveying a message whilst maintaining the same style and character traits.

Links:

http://www.simoncornish.com/

http://www.itchypictures.co.uk/

http://www.3dworldmag.com/

Blue Monday by cloudminedesign

http://cloudminedesign.deviantart.com/

 by nilTrace
http://niltrace.deviantart.com/

Laiterie by neoshambella 

http://neoshamballa.deviantart.com/