First Maya Animation

Last week in Matt’s class we learned the 12 principals of animation, then we were taught how we could animate a cube to lift/jump and fall again by using the pose-to-pose method. When I went home that night I decided to texture a cube myself, and create a small scene, including some of the features I have learnt about, of this cube rolling around and jumping a bit.

I textured the cube into a dice first of all, and added three point lighting to my scene.cube-texture-neatAll of that was only to enhance my animation,though, because I was really enthusiastic to complete even a small project like this, since I’ve wanted to learn how to animate since being young.

Unfortunately, though I finished it last week, it took me ages to figure out the right Playblast settings. Firstly it exported really low quality, then in high quality but totally stretched. I eventually put it to the settings of 1280 x 720 and it rendered correctly.

I’m totally happy with how my animation experiment went, and that I could finally upload a decent video of it to YouTube. I can’t wait to do more.

12 Principals of Animation

  1. Timing and Spacing refers to how many frames are used to animate an action, and how close together these frames are. If there are 10 frames of a ball rolling and the ball is spaced out and travels further, the ball will roll faster; whereas if the ball was closer together in each frame, not moving as far, it would appear slower.Image result for timing and spacing
  2. Squash and Stretch shows flexibility in a model. Squashing an object on impact and stretching it when it’s rebounding, or if something’s about the close back up, exaggerates the movement of the animation because it will be smoother and more realistic when it’s played back.Image result for squash and stretch
  3. Anticipation is used to sell a realistic moment in a scene where characters interact, for example. If someone walks into a room, other characters in the scene would look at them before they get into frame to prepare the audience.
    It is also used to make a movement believable; before a person walks forward they may lean back, and before they jump they bend their knees. This makes the animation make more physical sense.Image result for anticipation animation
  4. Ease in Ease Out/ Slow in Slow Out is the acceleration and deceleration of an object. During a movement there may be closer frames at the beginning and the end of the action, with exaggerated frames in the middle to highlight those frames, as they’re what the easing was leading into- and they’re what the animator wants you to see.Image result for ease in ease out
  5. Follow Through and Overlapping Action are similar but still slightly different. Follow through is not everything on an object moving at the same time, so when a truck carrying boxes suddenly stops, for example, the boxes might still roll forward once the truck isn’t.
    Overlapping action just means for one part of an object to lead the rest into an action, following its course. An example of this is someone kicking forward- the hip leads the thigh to lift, then the knee will stretch out straight and the calf/ankle will swing forward afterwards.Image result for follow through and overlapping action
  6. Arcs make animations look far smoother. If an action follows as arch it looks realistic and has a flow to it. It makes a subtle movement.Image result for arcs animation
  7. Exaggeration is used to enhance a movement, like making something move further than it should to imply more impact when being hit, or a higher bounce to add flexibility and airiness to an object in the scene. It adds extra emotion and personality to even daily (inanimate) non-living objects.Image result for exaggeration animation
  8. Staging is used to set the scene of an animation. How your camera is angled and where objects are placed and set out changes the scene a lot, and you can choose the focus here. The way a character is set out affects how much of it you can see; This ca be improved by assessing its silhouette.
    Image result for staging animation
  9. Secondary Action compliments a primary action- aka. an accessorising animation. If a character runs and their arms swing with their legs, the arm swinging makes the character look alive and makes the action smoother.
    Image result for secondary action animation
  10. Straight Ahead animation is different to Pose to Pose; straight ahead means to animate frame by frame, whereas pose to pose is animating between two key frames.
    Image result for straight ahead and pose to pose animation
  11. Appeal is what makes an animation interesting to the viewer, though it may not be pretty. A villain cold have exaggerated eyebrow movements when they’re angry, or a lot could move when a heavy object smashes into the ground- all of this is appealing and interesting to catch the viewer’s eye.Image result for appeal animation
  12. Solid Drawing can made 2D animations far more realistic, were someone could add a 3D style realism background to a 2D character, making them seem to be plausable and accessible in a three-dimensional scene.
    Image result for solid drawing animation

Lighting and Rendering

We’ve been learning a lot about lighting and rendering in Matt’s class. We need to know all of the aspects because we can render our models with lighting so we know how it would look in a scene, especially in Maya.

Directional light is light which is coming from a source. It controls where an object is hit with light on an angle, and therefore where a shadow is cast. Indirect light is bounced direct light (reflected).

Ambient light is automatic simulated bounced light. It is flood light so it makes the scene flat. It isn’t the best effect but it is the fastest way to light a scene.

Point light is a point source which emits light in all directions from anywhere it is located.

Area light is when light is emitted in one direction  from a particular area/zone.

Volume light goes through an object, it can be useful for lighting through windows.

Light intensity is how strong the light is depending on how close it is to an object.

Light colour is just the colour of the light emitted. Colours can add different moods to a scene and can be used to represent the time of day when used in natural light.

Light linking determines which specific surface a light will illuminate.

Light cookies (or Cuculoris) is used to cast patterned shadows and silhouettes in a scene to create artistic illuminations.

Three point lighting is when 3 (directional or otherwise) lights are placed on an object; the main, fill, and back light. Main lights light the object, back lights make sure you can see the silhouette of it and prevent it blending into the background, and fill lights softly light the rest of the shadows.

Depth Map, and Raytraced, shadows are the way to make a shadow from a light source. On Maya light sources do not produce shadows so both of these can be used and combined to create some. Depth Map is usually the best choice as it is quicker to render.

Maya software renderer is used to produce a high quality image of your final product, including all assets (such as texture and lighting).

Mentalray renderer is an improvement on the existing rendering software- it renders out higher quality images for complex projects quickly.




Platform Engine Game

I edited my platform game on Flash the other day, and I managed to make it visually pleasing and mobile at the same time. I had previously designed a 2D map on Flash by using simple polygons in a silhouette format, and I had to now make it into a game.

Firstly I opened a pre-programmed platformer made by Chris, with a simple black ground and stick-man character. It allowed me to control my character and move him around the map. The (intentional) issue with the code provided was that the character would move the opposite way to the arrows I pressed, so to invert the code for left and right movements I switched ‘+’ and ‘-‘ symbols (appearing twice in correlation to direction in the script) around, which evidently made the character move in the correct direction.

I then opened my own game design which we made from polygons in a previous lesson. Now I had to combine my level with a functioning platformer. To do this all I did was copy across the ground from my level and embed it into the ground in Chris’, then deleted the polygon from his, so my ground was then a solid figure in the game that the character would land on. Then I just changed the background colour to another I liked for the sky.

After that I decided to edit the player’s appearance. I wanted my character to suit the scene a little bit more so I deleted the stick-man and painted a Witch into my game instead. She is just a black silhouette with a hat, exaggerated warty nose, and a broomstick to fly on.

I wanted to animate something in my scene as I’d never done it before, so my choice was the bristles of the broomstick the witch flies on. All this took was editing the keyframes of the object. I added in keyframes as i went, only really doing one change; after a few keyframes I tilted the bristles downwards for a few, so in game the broomstick would flutter continuously.

When I played through, the character didn’t jump very high, so I edited the code again and set the height of the jump to 20, meaning she had a further, longer jump, making the broomstick flight make more sense.

I like how my game looks so far even though I’m new to Flash, coding is hard to do from the start but editing it helped me see what the functions were.

I have no images of my game until next time I get access to my files at college to update this post.

Building 3D Ships (with rendered ship)

Modelling spaceships over the past months has been great, but has been difficult too. We’ve been using Maya to get used to 3D modelling and we had to complete a rendered spaceship.

At first I modelled my own 3d Maya ship.


It was difficult to complete UVs of my own ship, so I only had an un-textured model of that, but I did manage to texture Matt’s ship. It took a while to figure out how Maya and Photoshop could create a textured ship, but now I have done it once, I understand the process.

I used images and manipulated them to make a texture for my UVs and assigned it as a Blinn material to my ship. I then made the windows with a blue PhongE, which I made partially transparent to represent the glass at the front of the ship.

After the ship was fully textured I added in 3-point-lighting (purple, yellow and white) to highlight certain angles of the ship and rendered it.ship-rendered

Afterwards I uploaded it to SketchFab so you can see the whole model. (SketchFab link)

I’m pleased with the shape of my model and with the rendered version of my textures on Matt’s model. Hopefully what I’ve learnt will translate into my future work and I’ll be able to create a model and completely render it, textures and all, myself.




Creating a Room Game

In Unity I’ve been making a 3D project which is a walking simulator, interactive game. Firstly I modelled the room; 4 walls, a plane and a door. I then used the (X) file to import Ant’s table, key, and chairs and scaled them onto my scene.

I added in a ‘Character’ and made them the main camera for the game by deleting the existing one. I added in code for the key which would delete it upon ‘MouseOver’. Then I also coded for the door to open at 90 degrees whenever you have contact with the key (which symbolises unlocking the door).

I then added in a spot light to represent a flashlight which would follow the camera around when you viewed things. To make the effect of the flashlight more intense I dimmed the ambient light (sunlight) surrounding the scene so you would rely more on the torch.

I also added text into the scene which instructs you to pick up the key, though in the scene at the moment there aren’t many other factors which you may confuse as being the objective.

I need to add a lot more into my room and into the game in general, but I haven’t ran into too many issues with the code so far.

Flat Shading

On Friday I did some flat shading on Photoshop. This basically meant picking a photo in grey-scale and picking out the three (high, mid, and low) main shades and making 3 layers, one for each.

On the fist layer I did the mid-shade, a silhouette of the image. The second and third were for the dark and light shades so I could add shadows and highlights.

For mine I did a picture of Audrey Hepburn. It turned out alright but with practice I’ll hopefully learn where to map contours and highlights more naturally.


Flash Games

I used to play flash games a lot as a child. One of my favourites was definitely Line Rider.
Image resultI used to play Line Rider all the time as a child. I liked the very simplistic style of the game; so simple, yet so versatile. You had the ability to create your own levels, and even design them with other pens which didn’t affect physics, in which your design could be as complex as you liked. For such a basic idea, I could play the game for hours.

Image result for transformiceTransformice is another game I obsessed over when I was younger. It’s an online multiplayer game where a group of players (mice) are led by one player (shaman) through different levels. The shaman has powers and there’s a chat system where the mice tell the shaman what they need them to do to help everyone complete the level in the fastest time possible. This game is more complex and has a very distinct design. You can make levels in this too but the entire system is nothing like Line Rider.
Just going by these two games you can see the large variation of games which can be produced on Flash.

Silhouettes in Photoshop

Last Friday I used Photoshop to draw for the first time. Tony taught us a technique some character designers use to come up with imaginative new body designs without having to think about it, which is to use the lasso tool.
We used the lasso to scribble a shape which vaguely represented a person’s body but messily- this could take any type of form- and then we used the paint pot tool to fill in much of it in black. After adding a second layer we then had to paint in black around the shape, neatening it up, and turning it into a silhouette.
Silhouettes are useful for designers because, as a first design, the character has no detail, but their distinct features stand out immediately. By having to tidy the silhouette up, you end up using the scribble design to pick out parts of it which could become a specific asset of the character, like their hair, or a bag or gun they’re holding.

My two designs ended up being very different to each other. My first came out like a man with a gun, wearing a hat and bullet belt. My second came out like a stylised woman in a pencil shirt and heels. There was a large circle above the head which I embellished into a fringe also, which set my style for the rest of the character.silhouettes

It was really fun to try a new way of coming up with designs as I would especially have never come up with a gunman by just thinking about it. It would be a lot easier to use a silhouette to move onto a colour drawing of the same thing since the placements are really already there, where if I just tried to draw it completely I’d get the form wrong.


Self Portrait on Flash

After we learnt how to manipulate shapes on Flash, we then had to use the tools to draw ourselves. I used circles which I formed and cut to make into a face shape and eyes, then I used lines (which were manipulated to form smooth curves) to outline the hair, body and other facial features.
I completed it by fill-colouring the features in, but where some areas were difficult I had to use the paint tool to fill in the gaps. I’m happy with how it turned out (some people said it looked like a Bit-strip from those Facebook comics) because it looked simplistic.
I feel better about designing with flash now which is good and I hope I can improve my art skills on it as we continue.