CS3352 ANNA UNIVERSITY NOTES UNIT 4.pptx

CS3352

1. UNIT IV - ANIMATION Principles of animation: staging, squash and stretch, timing, onion skinning, secondary action, 2D, 2 ½ D, and 3D animation, Animation techniques: Keyframe , Morphing, Inverse Kinematics, Hand Drawn, Character rigging, vector animation, stop motion, motion graphics, Fluid Simulation, skeletal animation, skinning. Virtual Reality, Augmented Reality

2. Introduction Animation is a method of photographing successive drawings, models, or even puppets, to create an illusion of movement in a sequence. Because our eyes can only retain an image for approximately 1/10 of a second, when multiple images appear in fast succession, the brain blends them into a single moving image. In traditional animation, pictures are drawn or painted on transparent celluloid sheets to be photographed. Early cartoons are examples of this, but today, most animated movies are made with computer-generated imagery or CGI. To create the appearance of smooth motion from these drawn, painted, or computer-generated images, frame rate, or the number of consecutive images that are displayed each second, is considered. Moving characters are usually shot “on twos” which just means one image is shown for two frames, totaling in at 12 drawings per second. 12 frames per second allows for motion but may look choppy. In the film, a frame rate of 24 frames per second is often used for smooth motion.

3. Different Types of Animation: Traditional Animation Rotoscoping Anime Cutout 3D Animation Stop Motion Motion graphics

4. The 12 Principles of Animation The 12 Principles of Animation is a group of key teachings for the professional animator. The list has served Disney animators since the 1930s and was outlined by Ollie Johnston and Frank Thomas in the 1981 book The Illusion of Life:Disney Animation. Many of these foundational ideas are still utilized in classrooms and studios around the world almost 40 years later. While technology and industries have evolved with new and different ideas being integrated into animation, the principles can still be seen in movies and web design today. The 12 Principles of Animation are as follows: 1. Squash and stretch 2. Anticipation 3. Staging 4. Straight-ahead action and pose-to-pose 5. Follow through and overlapping action 6. Slow in and slow out 7. Arc 8. Secondary action 9. Timing 10. Exaggeration 11. Solid drawing 12. Appeal

5. Understand Disney's 12 principles of animation Disney's 12 principles of animation may have been created several decades ago, but they remain just as relevant today, even though the technology used to animate has changed considerably. These 12 basic rules of animation still apply to almost any type of project, not just movie animation and cartoons. These principles of animation were first published in 1982 in The Illusion of Life: Disney Animation, written by animators Ollie Johnston and Frank Thomas and one of the best animation books out there. The authors painstakingly examined the work of leading Disney animators from the 1930s onwards and broke down their approach to create these 12 basic principles of animation. You can use the Disney principles of animation as a starting point for your animation work, whether you're using a tablet for animation or a pencil. But the rules also have relevance for areas like UI animation and CSS animation for interfaces or websites.

6. 01. Squash and stretch The squash and stretch principle is considered the most important of the 12 principles of animation. When applied, it gives your animated characters and objects the illusion of gravity, weight, mass and flexibility. Think about how a bouncing rubber ball may react when tossed into the air: the ball stretches when it travels up and down and squishes when it hits the ground. When using squash and stretch, it's important to keep the object's volume consistent. So when you stretch something it needs to get thinner, and when you squash something it needs to get wider. 02. Anticipation Anticipation helps to prepare the viewer for what's about to happen. When applied, it has the effect of making the object's action more realistic. Consider how if might look if you were to jump in the air without bending your knees, or perhaps to throw a ball without first pulling your arm back. It would appear very unnatural (it may not even be possible to jump without bending your knees!). In the same way, animating movements without a flicker of anticipation will also make your motion seem awkward, stale and lifeless.

7. 03. Staging Staging in animation is a lot like composition in artwork. What we mean by that is, you should use motion to guide the viewer's eye and draw attention to what's important within the scene. Keep the focus on what's important within the scene, and keep the motion of everything else of non-importance to a minimum. 04. Straight ahead action and pose to pose There are two ways to handle drawing animation: straight ahead and pose to pose. Each has its own benefits, and the two approaches are often combined. Straight ahead action involves drawing frame-by-frame from start to finish. If you're looking for fluid, realistic movements, straight ahead action is your best bet. With the pose to pose technique, you draw the beginning frame, the end frame, and a few key frames in-between. Then you go back and complete the rest. This technique gives you a bit more control within the scene and allows you to increase the dramatic effect of the motion.

8. 05. Follow through and overlapping action When objects come to a standstill after being in motion, different parts of the object will stop at different rates. Similarly, not everything on an object will move at the same rate. This forms the essence of the fifth of Disney's principles of animation. If your character is running across the scene, their arms and legs may be moving at a different rate from their head. This is overlapping action. Likewise, when they stop running, their hair will likely continue to move for a few frames before coming to rest – this is follow through. These are important principles to understand if you want your animation to flow realistically. 06. Slow in and slow out The best way to understand slow in and slow out is to think about how a car starts up and stops. It will start moving slowly, before gaining momentum and speeding up. The reverse will happen when the car brakes. In animation, this effect is achieved by adding more frames at the beginning and end of an action sequence. Apply this principle to give your objects more life.

9. 07. Arc When working in animation, it's best to stick with the laws of physics. Most objects follow an arc or a path when they're moving, and your animations should reflect that arc. For example, when you toss a ball into the air, it follows a natural arc as the effects of the Earth's gravity act upon it. 08. Secondary action Secondary actions are used to support or emphasise the main action going on within a scene. Adding secondary actions help add more dimension to your characters and objects. For instance, the subtle movement of your character’s hair as they walk, or perhaps a facial expression or a secondary object reacting to the first. Whatever the case may be, this secondary action should not distract from the primary one.

10. 09. Timing For this principle of animation we need to look to the laws of physics again, and apply what we see in the natural world to our animations. In this case, the focus is on timing. If you move an object more quickly or slowly than it would naturally move in the real world, the effect won't be believable. Using the correct timing allows you to control the mood and the reaction of your characters and objects. That's not to say you can't push things a little (especially if you're creating an imaginary world) – but if you do, be consistent. 10. Exaggeration Too much realism can ruin an animation, making it appear static and boring. Instead, add some exaggeration to your characters and objects to make them more dynamic. Find ways to push the limits just beyond what's possible, and your animations will pop.

11. 11. Solid drawing You need to understand the basics of drawing. This includes knowing how to draw in three-dimensional space and understanding form and anatomy, weight and volume, and lights and shadows. While you can push the limits here, too, it's important to remain consistent. If your world has wonky doors and a warped perspective, keep that perspective throughout the entire animation. Otherwise, things will fall apart. 12. Appeal Your characters, objects, and the world in which they live need to appeal to the viewer. This includes having an easy-to read design, solid drawing, and a personality. There is no formula for getting this right, but it starts with strong character development and being able to tell your story through the art of animation.

12. Onion Skinning In 2D computer graphics, onion skinning is a technique used in creating animated cartoons and editing movies to see several frames at once. This way, the animator or editor can make decisions on how to create or change an image based on the previous image in the sequence. Adobe Animate, a comprehensive animation software, incorporates onion skinning functionality to empower animators to effectively plan, execute, and refine their frame-by-frame animations. By enabling onion skinning, animators can visualize previous frames, ensuring consistency and continuity throughout the animation. This visual aid facilitates the creation of smooth and fluid motions, adding a layer of polish and refinement to the animation

13. Benefits of Using Onion Skinning Onion skinning offers a plethora of benefits for frame-by-frame animation, including: Smooth and Natural Transitions : Onion skinning facilitates the creation of smooth and natural transitions between poses, making it easier to achieve realistic and fluid movements. Consistency and Accuracy : By visualizing previous frames, animators can maintain consistency and accuracy in the positions and transformations of objects throughout the animation. Refined Animation Timing : Onion skinning provides a visual reference for timing the animation, allowing animators to finetune the timing of actions and transitions to create a polished and engaging animation. Error Checking and Correction : Onion skinning allows animators to easily identify and correct mistakes or inconsistencies in the animation, ensuring a high level of quality.

14. Mastering Onion Skinning Techniques To fully utilize the power of onion skinning, animators should practice and experiment with different techniques and settings. Experiment with varying opacity levels and numbers of onion skin layers to find the optimal combination for the specific animation. Additionally, consider using different colors for each onion skin layer to enhance the visual clarity and aid in differentiating between poses. 2D and 3D Animation Two D (Dimensional) refers to the two dimensional (measurement or space) graphical representation of a physical space or figure. It technically refers to any material object, form, shape and space having following two dimensions referred as axis, means directions: 1) Height or Vertical dimension called Y axis. 2) Width or Horizontal dimension called X axis.

15. It is also called two axis graphical representations. The popular examples of 2D graphics (also imagery) are handmade sketches, paintings, illustrations and photographs. The cave sketches of ancient times are the first 2D graphical representation in the world, these sketches in fact are older than the first language the humans learned to speak. After the advent of various art forms and impetus given by technological revolution, the 2D graphics gained enormous popularity and has been applied in various aspect of life. The 2D graphics gained momentum after the advent of computer graphics and enormous use in media and film industry. 2½ D : Layered image or animation is also called 2½ dimensional imagery. It means besides the usual axis of X and Y, it also has some properties of 3D, that means the features of depth or distance (Z axis). The 2½D is close in appearance to 3D but is actually made of the properties and techniques of 2D. Besides the basic coordinates of X and Y, following techniques help to achieve the 2½D imagery: 1. Layers. 2. Shades. 3. Size. 4. Colour.

16. 2D graphics Applications: 1) Media and Film industry. 2) Architecture. 3) Interior Designing. 4) Product Designing. 5) Publications. 6) Graphic Designing. Etc 3D Three D (Dimensional) refers to the three dimensional (measurement or aspect) graphical representation of a physical space/world. It technically refers to any material object, form, shape and space having following properties: 1) Height or Vertical property called Y axis (direction). 2) Width or Horizontal property called X axis (direction). 3) Distance or Depth property called Z axis (direction).

17. It is also called three axis graphical representation. The popular examples of 3D graphics (also imagery) are Computer graphics design (3D) and real world space. However, the definition varies from situation to situation, for example, computer designs 3D imagery using specialized 3D softwares (using mathematical codes called Cartesian coordinate system) and finally produces results in 2D form through monitor displays, prints and video format outputs by the processing called rendering (final processing stage ). The humans perceive and live in multi-dimensional world, however the eyes of humans and other living creature on earth see 3D images due to the eye system (recognizes X and Y axis) and brain system (recognizes Z axis). The 3D is gaining more popularity than 2D due to more realistic results and wide range of applications in every aspect of life. 3D graphics Applications:

18. Media and Film industry. Engineering. Interior Designing. Product Designing. Publications. Medical Science. Industrial Designing. Pharmaceutical research etc. 3D Animation: Animation is the illusion of motion. 3D animation means the illusion of motion of three dimensional graphics generally created by computers. Following stages are applied to create 3D animation production: 1) Character and Object Modeling . 2) Scene Layout. 3) Rigging. 4) Character and Object Positioning 5) Lighting arrangement and positioning. 6) Camera(s) arrangement and positioning. 7) Movement (Animation) by using Timeline. 8) Finally, Rendering.

19. What is The Difference Between 2d, 2.5d & 3d Animation? A 2D animation or 2-Dimensional animation is basically an animation that took place in a two-dimensional space. Modern 2D animation can be created by hand or computer animation software. The movement of the object requires one image to be followed by another with slight different position, followed by another image in another position, and so on. It is a traditional animation drawn with simple motions. The objects can only move in two axes, either up or down, left or right. They are generated by creating continuous consecutive images, or “frames”, thus forming motion by each image showing the next in a gradual progression of steps. Unlike 3D animations, 2D animations are flat images that can move, and represented by height and width dimensions but not by depth.

20. 3D animation, or 3 Dimensional animation is an animation drawn in three-dimensional space. The objects can maneuver in three axes rather than two as in 2D animations. 3-D animations like any other 3-D movies you may have seen, allows you to create a realistic objects that are more exciting. Different textures and lighting are applied to the objects created that appear solid, and can be applied seamlessly into live video elements. However, to create a beautiful, realistic 3-D animation, can only be limited by the capabilities within the program itself. A lot of time, effort and resources are greatly needed towards building a successful 3-D animation, and the returns may not be necessarily as expected.

21. 2.5D animation is a 2D animation drawn into a 3-D space as it involves the motion of 2D-animated object in a 3-D space. The trick lies behind the perspective and shadows of 2D-animated objects drawn in 2D-space that appears to be 3-D. Animators use the impression of drawing 2D objects in motion that appears to be moving in a 3D space accomplished by using brilliant art skills in layering, shadows, perspective animations, morphing, and several other techniques. The result would create a fluidity movement changes in depth that deceived us into looking a 3-D animations when it was actually using 2D-animated objects. 2.5D effect can be rendered by using shadows applied to a 2D objects. This can be achieved by having the drawn object casting a shadow behind it on the background.

22. A simple example would be drawing any object on a white, plain piece of paper, and then add in shadows that stretches behind it into the distance, a dimension that does not actually exist for this object unlike 3-D which have 3 axes, but we can imply. Your perspective on the object from 2D now appears to look like 3-D simply by adding a shadow behind it. Programs such as Adobe After Effects allows you to generate 2.5D effects by creating the false perspective, and then animate that perspective changing for 2.5D effect. In short the difference between 2D, 2.5D and 3D is about to their depth that our eyes detect. 2D animation feels flat, 2.5D animation feels like it has some kind of depth and 3D animation give us a feeling that there is 100% depth from every angle that camera follows.

23. Animation techniques: 1. Keyframe Animation: Keyframe animation is a fundamental technique where animators define specific frames ( keyframes ) that represent important positions or poses of an object or character. These keyframes serve as reference points, and the animation software interpolates between them to create smooth motion. Animators can adjust timing, spacing, and interpolation methods to achieve the desired motion style, such as easing in or out. 2. Morphing: Morphing involves smoothly transforming one image or shape into another over a sequence of frames. It's often used for visual effects, transitions between scenes, or transforming one character into another. Morphing typically involves defining corresponding points in the two images and interpolating between them to create the morphing effect.

24. 3. Inverse Kinematics (IK): Inverse kinematics is a method used to animate articulated figures, such as characters with limbs or joints. Instead of manually animating each joint, IK calculates the movement of connected parts based on the position of an end effector (e.g., hand or foot). This allows for more natural and efficient animation of comp 4. Hand Drawn Animation: • Hand-drawn animation, also known as traditional animation, involves creating each frame of the animation by hand. Animators draw images on paper or digitally, often following a sequence of rough sketches (storyboards) and refining them over multiple passes. While time-consuming, hand-drawn animation offers a unique, organic look and allows for artistic expression in every frame.lex movements like walking or reaching.

25. 5. Character Rigging: • Character rigging involves creating a digital skeleton (rig) for a character and assigning controls (rigging) to manipulate its movement. Rigging allows animators to pose characters by adjusting the rig controls, rather than manipulating individual vertices or bones. It's essential for creating lifelike character animations in both 2D and 3D environments. 6. Vector Animation: Vector animation uses mathematical formulas to describe shapes, allowing them to be scaled, rotated, and manipulated without losing quality. It's commonly used for motion graphics, explainer videos, and animated logos. Vector animation software allows animators to create smooth, scalable animations with crisp lines and shapes.

26. 7. Stop Motion: Stop motion animation involves photographing physical objects or puppets one frame at a time and then playing them back to create motion. Common techniques include claymation , puppet animation, and object animation. Stop motion requires meticulous planning and patience but offers a tactile, tangible quality that's visually appealing. 8. Motion Graphics: Motion graphics involve animating graphic elements, text, and imagery to communicate information or enhance visual storytelling. It's widely used in advertising, user interfaces, title sequences, and explainer videos. Motion graphics software provides tools for animating typography, creating transitions, and adding visual effects.

27. 9. Fluid Simulation: Fluid simulation is a computer graphics technique used to simulate the behavior of fluids such as water , smoke, or fire. It's used to create realistic fluid motion in animated films, video games, and visual effects. Fluid simulation algorithms simulate the behavior of fluid particles based on physical properties like viscosity, density, and pressure. 10. Skeletal Animation: Skeletal animation, also known as rigging and skinning, involves animating characters by deforming a digital skeleton (rig) and attaching a mesh (skin) to it. The skeleton is made up of interconnected bones, and each bone influences a specific part of the mesh . Animators pose characters by manipulating the skeleton, and the skin deforms accordingly to create realistic movement.

28. 11. Skinning: Skinning is the process of deforming a digital mesh (skin) to follow the movements of a digital skeleton (rig) in skeletal animation. It involves assigning weights to vertices on the mesh to control how they move with the skeleton. Skinning algorithms calculate the influence of each bone on nearby vertices to produce smooth and realistic deformation . Each of these animation techniques has its own strengths and applications, and skilled animators often combine multiple techniques to achieve their desired artistic vision. Whether creating hand-drawn masterpieces, realistic character animations, or dynamic motion graphics, animators have a diverse toolkit at their disposal.

29. Virtual Reality – Introduction Imagination is to Technology as Fuel is to Fire. Imagination and purpose together drive technology. It is due to these that technology today is evolving at an exponential rate. Virtual Reality on one hand places the viewer inside a moment or a place, made possible by visual and sound technology that maneuvers the brain into believing it is somewhere else. It is an experience of a world that does not exist. Sounds cool, right?! Virtual Reality tricks one’s mind using computers that allow one to experience and more interestingly, interact with a 3D world. This is made possible by putting on a head-mounted display that sends a form of input tracking. The display is split between the eyes and thus creates a stereoscopic 3D effect with stereo sound to give you a graphic experience. The technology feeds in the images of the objects taken at slightly different angles which creates an impression of depth and solidity.

30. The LCD or OLED panels inside are refracted by lenses completely fill the field of vision with what is to be displayed and experienced. Together with the technology and the input tracking, it creates an immersive and exciting believable world that the computer generates. What we know today as VR, has been existing for decades now . Taking you back to when 360° paintings took the world by surprise, giving a virtual element. VR merely is ‘The Wise Guy’ of the digital world. It creates a world that neither functions according to you, nor does it respond to your actions. It gives you a first-hand experience with even the after-effects of an event along with the ability to interact and interrelate with the world created. This technology holds vast potential insights into the workings of the Human Brain. According to researchers and medical specialists, VRs have the ability to diagnose medical conditions from social anxiety to chronic pain.

31. Though the use of VR to tweak the brain is still at a budding stage. While most people were too engrossed in its advancements and leap in gaming and exploring the industry, many are unaware of its achievements in the health sector. VRs have been successfully treating post-traumatic stress disorder since the 1990s, the new programs thus address a much broader range of conditions. The VR content exposes the patients to a virtual, safe, and controlled environment where they can explore and eventually learn that the threats they are worried about can be tackled patiently with time, thinking, and analyzing. VR displays are available in various forms. Ranging from the ones that already contain the display, splitting the feed for each eye using a cable to transfer the feed to the console, to the more affordable ones which depend upon the VR mode and applications on Smartphones . The HTC Vive, the Oculus Rift, and Sony PlayStation VR are a few of the head mounts that use this setup. One can create one’s own Virtual Reality Box at home, along with a smartphone compatible with the VR mode. Irrespective of the use, Virtual Reality produces a set of data that can be used to develop models, communication, training methods, and interaction . In simple words, the possibilities are endless.

32. Types of Virtual Reality (VR) On the basis of the most important feature of VR i.e. immersion and the types of systems and interfaces used, The VR systems can be classified into 3 types : Immersive Semi-immersive Non – immersive 1. Immersive VR system Immersive VR system is closest to the virtual environment. It makes us experience the highest level of immersion . This VR system is expensive than others. It provides the closest feeling of being in virtual world. Tools and gadgets used in this system are advanced and not so common to use.

33. 2. Semi – immersive VR system Semi – immersive VR systems also make us to experience a high level of immersion but the tools and gadgets used are not so advanced and costly. Tools and gadgets used in this system are common to us and utilize physical models. Non-immersive VR system Non-immersive VR system is the least immersive and least immersive VR system. It is not expensive to use this system . It is also known as desktop VR system because the gadgets used are limited to glasses and display monitors and it uses the least expensive components. What are the basic components for VR systems? Input devices Output devices Software

34. 1. Input Devices Input devices in VR are the tools for the users to interact with virtual world. Using Input devices , the users communicates with the computer. Example – 3D mouse. 2. Output devices Output devices is used to represent the virtual world and it’s effect to the users. It generates the feeling of immersion to the users. Example : LCD shutter glasses. 3. Software Software has a key role in VR . It is used for the handling Input and output devices, data analysis and generate feedback . Software controls and synchronize the whole environment. Basics of Augmented Reality Augmented Reality or A.R is a way by which technology can change how we perceive the world around us. It’s also very useful in various fields, but first, we need to know what is augmented reality and how it is different from virtual reality.

35. What is Augmented Reality? Augmented reality is made up of the word “augment” which means to make something great by adding something to it. So basically, augmented reality is a method by which we can alter our real world by adding some digital elements to it . This is done by superimposing a digital image on the person’s current view thus it enhances the experience of reality. Difference between Augmented Reality and Virtual Reality We all know about Virtual Reality. Virtual reality makes a virtual environment and puts the user in it whereas Augmented reality just adds the virtual components into the user’s real-world view. Virtual reality sends a person into a virtual place created by a computer whereas augmented reality brings the digital world into our real world. T o experience virtual reality the person needs to wear a special VR headset that is connected to a computer like the Oculus Rift or a gaming console like PlayStation VR but there are devices that work with a smartphonelike Google Cardboard.

36. In this, all you have to do is insert a smartphone , wear a headset, and immerse yourself in virtual reality. For Augmented reality you only need a modern smartphone then you can easily download an AR app like Google’s “ just a line” and try this technology. There’s also a different way to experience augmented reality , through special AR headsets, such as “ Google Glass“, where digital content is displayed on a tiny screen in front of a user’s eye, or “ Microsoft Hololens ” which displays the information in real-world all you have to do is wear the headset and you can see the digital images.

37. The Reality- Virtuality Continuum The reality- virtuality continuum is a scale that was given by Paul Milgram . It is a scale which has two extremes one part depicts the ‘ virtuality ’ or an environment which is completely virtual and, the other part describes a real environment or ‘reality’ and the middle part is termed as “mixed reality”, thus this scale contains all possibilities for one object or plane being completely digital or completely real.

38. Examples: One of the best examples of augmented reality is the app “ Pokemon GO“.so what that game does is that it imposes the images of pokemon which are digitally created and puts them into our real-world view which we can see through our phone’s camera. T he newest development in augmented reality technology is done by Google through their ARcore app. ARcore is a platform for developers to design and run AR apps on their devices. Google also created an app called “ just a line” which lets users draw virtually in the real world. There are tons of apps on google play store that uses AR technologies like “ houzz ” or apple store like “ amikasa ” which helps you style your room and helps you design a room layout by implementing the furniture in your room using your phone’s camera. one of the biggest examples that use AR is H.U.D. A head-up display (HUD) is a transparent display that presents data without requiring users to look away from their usual viewpoints . They were developed for the aviation industry and now they are now used in automobiles, airplanes, military, and other applications.

39. Why Augmented Reality is Important? The development of AR technology is set to revolutionize industries from retail to military to education to tourism and transform the way we interact with the digital world every day. Augmented reality has many uses in different fields like archaeology, architecture. visual arts, commerce, education , video games, and military training, etc. some applications of AR are 1. AR is being used to aid research in archaeology. AR can be used to recreate different structures and overlay them in the real environment so that researchers can study them correctly. 2. AR applications in smartphones include Global Positioning System (GPS) to locate the person’s location and its phone’s inbuilt compass to find device orientation. 3. Augmented reality can be used in the field of tourism to enrich visitor’s experience during visits like the Eiffel tower has an AR app that can show you it looked throughout history when it was being built. And the list goes on that’s why AR and VR companies have raised more than $3 billion in 2017 in funding, thus 2018 has been doubled the year when AR goes mainstream, we can be sure that in the coming years it will change the way we look at technology and improve the integration of technology in our daily lives.

40. Thank You