Lesson plan for a lesson in computer science and information technology on the topic: Placing graphic objects on presentation slides. Apply animation effects to slide objects. Summary of a computer science lesson on the topic "Creating GIF animation using graphic editors." Prog

Inserting pictures and graphic objects:

Select the Insert / Drawing command. The selected picture or graphic object will be displayed on the slide.

To format a picture (autoshape), you need to select it and select the Format / Picture (autoshape) command; the Format Picture (autoshape) dialog box will open.

Video clips

Inserting video clips:

Select the command Insert / Movies and sound / Movies from a collection of pictures. Next, in the Clip Collection panel in the task pane, you can select a clip and view it. To do this, you need to hover your mouse over the clip and click on the drop-down list button, from which you need to select the “View and Properties” command. After viewing the clip, click the Close button.

To add the selected clip to a slide, click on the clip in the Clip Collection panel with the mouse, it will be displayed on the slide.

Inserting sounds

1. Open the slide to which you want to add music or sound effects.

2. From the Insert menu, select Movies and Sound, and then do one of the following:

Inserting a sound file

Select Sound from File, find the folder that contains the file, and double-click the file.

Inserting sound from the Picture Collection

Select Sound from Collection , Find the clip you want and click it to add it to your slide.

Burning from CD

Select Burn from CD, find the file you want, and double-click it.

Record sound

Select the Record Sound command, the Sound Recording dialog box will open, in which you need to click on the Start Recording button. Using a microphone, record sound. After recording, click on the "Stop recording" button

Animation

Animation is adding a special video or sound effect to text or an object. Animation effects can be applied to elements on a slide such as text, pictures, graphs, diagrams and other objects. Text animation effects can generally be applied to letters, words, and paragraphs.

The commands you use to add animation in PowerPoint are Animation Effects and Custom Animation. Pre-made animation effects can be applied to all elements of selected slides or all slides in a presentation. Animation settings can be applied to individual elements on a slide.

Animation effects :

    If you only want to add an animation scheme to certain slides, select the slides you want in the Slides pane.

    From the Slide Show menu, select Animation Effects.

    In the Slide Design task pane, select the desired animation effect from the Apply to selected slides list.

    If you want to apply the animation effect to all slides, click Apply to all slides.

Animation settings

    IN normal mode Open the slide whose text or objects you want to animate.

    Select an object to animate.

    From the Slide Show menu, select Animation Settings.

    In the Animation Settings task pane, click Add Effect and select desired effect from the sections that appear: Input, Selection, Output, Motion Paths.

Diagrams

The editor allows you to add different types of charts to your slides that are not based on spreadsheets or numerical values. These diagrams are used to illustrate material presented in presentations. These include: cyclic, radial, pyramid, Venn and target diagrams.

Adding a chart:

Select the Insert / Schematic diagram command or on the Drawing toolbar click the Add diagram button.

Select one of the chart types and click OK.

You can then use the Chart toolbar commands to replace a chart, reverse a chart, add text to a chart shape, add a shape to a chart, and so on. You can also apply a preset style to your chart by clicking the AutoFormat button on the Chart toolbar and certain areas charts, you can enable chart animation.

Lesson objectives:

  • educational: to form in students an idea of ​​animation, its types, methods and programs for creating computer animation; develop the ability to use the Internet to search for information;
  • developing: develop the ability to highlight the main thing and independently acquire knowledge.
  • educational: cultivate interest in the history of computer science.

Lesson type: lesson of learning new material.

Methods and forms of training: explanatory-illustrative, heuristic.

Means of education: computers with Internet connection, multimedia projector.

The lesson is accompanied by a presentation: a presentation (Appendix 1) and cartoons or fragments thereof.

Lesson plan:

  1. Org. moment – ​​2 min.
  2. Introduction to the topic of the lesson – 3 min.
  3. Learning new material – 20 min.
  4. Independent work on the Internet – 15 min.
  5. Lesson summary – 3 min.
  6. Country house homework- 2 minutes.

During the classes

1. Organizational moment.

2. Introduction to the topic of the lesson.

Teacher: Every year the role of media technologies in the transmission of information increases. No matter how anyone wants it, but gradually text information cedes some positions to graphics and multimedia. For example, computer presentations in educational process have become the norm, and as Internet speed increases, the proportion of graphics in website content increases. Why do you think this happens?

Answer: The reason for this is the ease of perception of such information. In addition, the volume of information is growing, and, therefore, ways to more quickly and easily assimilate it should appear.

Teacher: I suggest you watch one video.

Demonstration of the first computer cartoon “Kitty” (Can be downloaded on the website “Mathematical Etudes”).

More than 40 years ago, 1968... A group led by Nikolai Nikolaevich Konstantinov creates mathematical model movements of the animal (cat). The BESM-4 machine, executing a written program for solving ordinary problems (in the mathematical sense of the word) differential equations, draws the cartoon "Kitty", which contains, even by modern standards, an amazing animation of the cat's movements, created by a computer. This was done as part of the creation of programs that simulate mechanisms. What is especially interesting is that to create the actual film with the cartoon, each frame was printed on a printer, and the role of a pixel was played by the letter “Ш”.

So, what is the topic of today's lesson?

Answer: Computer animation.

3. Studying new material.

Let's first define the term, what is “Animation” and how does “animation” differ from “animation”?

The vast majority of people have an idea about animation. Probably, many will immediately present some kind of animated film (something like “Shrek” or “Winnie the Pooh”).

Try to define it.

Answer: animation - it is the movement of hand-drawn images.

The words "animation" and "cartoon" mean the same thing. In many countries, animation is called animation. It's hard to say why this happened. In Latin, the word "multiplikato" means multiplication. It’s clear why they used it when coming up with a title for films in which you need to repeat it many times, i.e. multiply drawings to make the characters on the screen move. And the word “animation” is derived from the Latin “anima” - animation. This means that everything depicted in the movie looks like real, alive, animate.

It turns out that both names are suitable, so people in this moment use both.

In the “Western manner” we will use the first option.

Which types of animation can you name?

  1. volumetric animation (example “Plasticine Crow”).
  2. pictorial animation (most cartoons).
  3. shift animation (example “Good night, kids!”).
  4. computer animation (for example, Shrek).

Student reports about types of animation. The messages are accompanied by an example of this type of animation, showing a fragment of a cartoon.

Material for messages can be found on the Website for computer science teachers by N.A. Filatova. .

Teacher: So, let's move directly to computer animation and consider its types. I think you will give the definition yourself.

Answer: Computer animation is animation created using a computer.

Or, computer animation is the creation of the illusion of objects moving on the monitor screen.

Types of computer animation.

Since the basis of computer animation is graphic images, animation can be divided into two types:

  • Raster (animation in presentations, Gif animation);
  • Vector (Flash animation).

Let's consider ways to animate objects.

Keyframe animation. The placement of key frames is done by the animator. Intermediate frames are generated by a special program. This method is closest to traditional hand-drawn animation.

Let's imagine a timeline (film) as a track consisting of individual frames. Let's say that in frame No. 1 the object should be on the left, and in frame No. 100 - on the right. These two frames are marked as key frames for of this object. In them it is located at the beginning and end of the movement (Fig. 2). All other frames - intermediate - do not require fixation of the object - the image in them will be created by a computer program. She herself will calculate where and at what moment the object should be. It is clear that if we want to move an object along a curve, then we will have to make more key frames (or use special means provided by the program to create a trajectory).

Motion recording. Animation data is recorded with special equipment from real moving objects and transferred to their simulation on a computer. A common example of such a technique is Motion capture. Actors in special suits with sensors make movements that are recorded by cameras and analyzed by special software. The resulting data on the movement of joints and limbs of actors is applied to three-dimensional skeletons of virtual characters, which is achieved high level the reliability of their movement.

The same method is used to transfer the facial expressions of a living actor to his three-dimensional analogue in a computer.

Procedural animation. Procedural animation is fully or partially computer-generated. The following types can be included here:

  • Simulation of the physical interaction of solid bodies.
  • Simulation of the movement of systems of particles, liquids and gases.
  • Simulation of the interaction of soft bodies (fabric, hair).
  • Calculation of the movement of the hierarchical structure of connections (character skeleton) under external influence.
  • Imitation of autonomous (independent) character movement.

Programmable animation. Two languages ​​are widely used on the Internet, with the help of which the movements of animated objects are programmed:

  • Java-Script - browser language
  • Action-Script is the language for working with Flash applications

The advantage of programmable animation is the reduction in size source file, the disadvantage is the load on the client's processor.

Animation software.

Teacher: Modern man must not only be able to perceive information in “ graphically", but also to produce it.

Since computer animation is an integral part of media technology, we must be able to create at least the simplest types of computer animation. But first, let's look at programs for creating animation.

Teacher: Animation is a section of the “Computer Graphics” topic, think about what programs can be used to create animation?

Answer: Graphic editors.

Teacher: Yes, you can animate objects using some graphic editors, but there is also special programs to create animation. Let's record some of the programs.

Conventionally, we can distinguish two or three types of software for creating animation:

  1. Programs that allow you to create animation from ready-made images (various gif animators, for example, Microsoft GIF Animator).
  2. Software environments, allowing you to create 2D animation (for example, Adobe Flash CS4, Synfig).
  3. Software environments that allow you to create 3D animation (for example, Autodesk 3ds Max, Blender).

In addition, you can create animation using graphic editors, such as AdobePhotoshop or GIMP.

There are also programs for creating animation using a digital camera. Today software, which allows you to use a digital camera to shoot animation, is used as often as the now familiar 3D or 2D packages. Any program of this type provides control digital camera through a computer and working with the received footage.

4. Independent work on the Internet.

Exercise: fill out the table using the Internet " Comparative characteristics software for creating animation" (Appendix 2).

Municipal Autonomous educational institution for children

Vladimir

"City Interschool Training Center No. 2"

Methodological development of the lesson

on this topic " CreationGIF– animation using graphic editors»

Developed by

labor training teacher

BICHURENKO Pavel Andreevich

Vladimir 2014

EXPLANATORY NOTE

This methodological development designed for 2 lessons. During the classes, knowledge on the topic “raster and vector images” acquired by students in previous lessons is tested. One lesson is allocated to complete a practical task. Form of conduct this lesson is a practical lesson.

The content of this development includes the study of types of animation, their advantages and disadvantages, and animation creation technology. During the classes, students gain skills in creating images and their animation using graphic editors, and also acquire the ability to convert vector images into raster ones. The knowledge gained can be applied when designing interactive presentations and web pages.

LESSON ON THE TOPIC: CREATIONGIF– ANIMATIONS USING GRAPHIC EDITORS

Target:To develop students' ability to create GIF animation.

Tasks:

Educational: To develop knowledge about methods of creating animation and types of animation. Give the concept of animation.

Educational: Upbringing information culture students, attentiveness, discipline, perseverance.

Developmental: Development of cognitive interests, creative abilities, independent work, note-taking skills.

Personal:

Showing cognitive interest in the learning process;

Manifestation of an emotional and value-based attitude to the topic being studied.

Metasubject:

Cognitive:

Learn to apply the acquired knowledge in practice;

Learn to summarize the information received;

Evaluate your actions, evaluate the results;

Find answers to questions using your life experience and information received in class.

Regulatory:

Work according to the plan proposed by the teacher, when fulfilling practical tasks;

Learn to formulate a question, problem, difficulty faced by students.

Communicative:

Learn to express your point of view, formulate a statement;

Learn to present to others the progress of work and its results, listen to the opinions of others;

Use verbal means adequately to discuss and argue your position.

Subject:

Master the technology of creationGIF-animation;

Gain the ability to create animation;

Lesson type: learning new material

According to the form of organization: Workshop lesson.

Equipment:personal computers, projector, screen, lesson notes, technological maps, magazine, software (Inkscape, Paint. NET, UnFREEz).

Lesson plan:

    Organizing time;

    Updating knowledge;

    Setting lesson goals;

    Work on the topic of the lesson;

    Practical work “Creating animation”;

    Frontal survey;

During the classes:

    Organizing time.

- Greeting students.

A short description of what will be learned in the lesson.

2. Updating knowledge.

What types of graphics are there? (raster, vector, fractal, animation, 3D).

What is the construction of raster and vector graphic images based on? (on pixels - rows and columns; on graphic primitives).

3. Setting lesson goals.

What is animation?

In what programs is it created?

Today in the lesson we will look at creating animation using graphic editors.

4. Work on the topic of the lesson.

Use the Animation demo to show various examples of animation and their creation.

Animation- this is the creation of the illusion of movement of objects on the monitor screen. Computer animation uses rapid frame changes on the monitor screen. The more frames that change in one second, the smoother the object moves.

In what computer programs oh have you come across animation effects? (in computer presentations).

What types of animation did you use? (changing slides, placing objects on slides, animation effects when the text appears).

Write down the definition in your notebookGIF-animations.

GIF animation –is a sequence of raster graphics stored in a single file in the format.gif. When creating a GIF animation, you can set the amount of delay for each frame; the smaller it is, the better quality animation. You can set the number of times a sequence of frames will be repeated. A large number of frames leads to improved animation quality, but at the same time the size of the GIF file increases.

Another type of animation isflash-animation.

Flash animationis a sequence vector drawings. Its huge advantage is that you don’t need to draw every frame. It is enough to draw key frames and set the type of transition between them, and the editor will automatically build intermediate frames. If there are a lot of frames, then the animation is smooth, if there are few, then it’s fast. Therefore, you can set the number of frames appearing per second. The more there are, the better the animation quality. Another positive point The problem is that Flash animation files take up little space, which is why they are widely used on Web sites on the Internet.

5. Practical work “CreationGIF-animation using graphic editors" (Technological map).

First, I demonstrate the process of creating animation on the screen, then students sit down at their personal computers and complete the task. If problematic issues arise, we solve them individually.

6. Frontal survey.

    What is a pixel? Pixel– the minimum area of ​​the image for which the color is independently set.

    What is the resolution of a raster image? ResolutionA raster image is determined by the number of horizontal and vertical pixels per unit length of the image.

    What is color depth? The amount of information that is used to encode an image is calleddepth of color.

    Name 3 color palettes in color rendering systems? (RGB, CMYK, HSB). Which color rendering is used most often and where? (RGB – for display on the monitor)

    What is a raster image? Raster imagesare formed from points different colors, which form rows and columns.

    What is vector graphics? Vector drawingsare formed from basic graphic objects, for each of which the coordinates of reference points, formulas for drawing the object, as well as the color, thickness and style of the line of its contour are specified.

    Name the vector and raster images. (jpeg,gif, png, svg, wmfetc.)

    Give examples of raster and vector graphics editors (Paint. NET, GIMP, Photoshop,Inkscape, CorelDrawand etc.).

    Name three basic colors, with the help of which the image is formed? (red, green, blue)

    Summing up the lesson. Reflection.

Grading.

Reflection questions:

What advantages and disadvantages of GIF animation did you learn in class?

What difficulties did you encounter when converting a vector image to a raster image?

Do you know an easier way to create animation? Which?










Raster graphics A raster image is very sensitive to reduction and enlargement. When reducing a raster image, several neighboring points are converted into one, and therefore clarity is lost small parts images A raster image is created using dots of different colors (pixels) that form rows and columns. A set of dot lines form a graphic grid (raster)


Vector graphics Vector graphic image used for storing high-precision graphic objects (drawings, diagrams), for which it is important to maintain clear and bright contours. Vector images are formed from elements - point, line, circle, rectangle, etc. For each element, coordinates are specified, as well as color


Fractal graphics Fractal graphics, like vector graphics, are calculated, but differ from them in that no objects are stored in the computer's memory. The image is constructed using an equation (or a system of equations), so only formulas are stored. By changing the coefficients in the equation, you can get a different picture.


Professional education VISUAL EFFECTS Creating realistic or, on the contrary, fantastic worlds in cinema, interesting characters, spectacular destruction, explosions, tornadoes, and other special effects - this is not a complete list of the functions of visual effects specialists. This profession requires not only the ability to work in three-dimensional packages, but also knowledge of mathematics, physics and various artistic disciplines.




Compositing Compositing is one of the most interesting specialties in post-production. The composer’s task is to collect the filming material and all created by specialists into a single scene (shot). visual effects layers computer graphics, combine them by color and dynamics, carry out a huge amount of corrections and improvements, and produce the final composition. Every scene with special effects that the viewer sees in a movie is the result of the composer’s work.




Motion design Motion designer is one of the most creative and sought-after specializations in computer graphics. It includes the creation of “packaging” for TV channels, advertising, video clips, design of concert venues, media resources, media art and much more. A motion designer is always squeezed into a narrow time frame production process, but has sufficient freedom of expression.




Computer animation On August 30, 1877, a device was patented - Emile Raynaud's praxinoscope. Animation is the process of giving the ability to move and/or the appearance of life to objects and dead bodies. A real revolution in the world of animation was made by WALT DISNEY (), an American director, artist and producer.


Computer animation Currently in existence various technologies animation creation: Classical (traditional) animation; Stop-frame (puppet) animation; Sprite animation; Morphing; Color animation; 3D animation; Motion Capture.














Computer animation Motion Capture is the first direction of animation that makes it possible to convey natural, realistic movements in real time. Sensors are attached to a living actor in those places that will be brought into line with control points computer model for input and digitization of movement. The actor's coordinates and orientation in space are transmitted to the graphics station, and the animation models come to life.


Professional education Animation Animator (from the Latin anima to animate) is an interesting and fascinating profession, relevant not only in animation, but also in cinema, advertising, production computer games, media environment. The course program is aimed at training specialists to work in any area of ​​the modern animation industry - classic production of animated films, advertising, computer games, cinema. Fragments of the cartoon "Little Red Riding Hood".
Professional education Architectural visualization Architectural visualization three-dimensional graphic display object or group of objects in architecture, allowing the most accurate representation of external and internal characteristics future building. Archviz is actively used in demonstrating competitive projects, creating presentations in the field of design and construction, as well as advertising.
Computer game development Game graphics Game graphics is one of the youngest and most popular specialties in graphic art. The responsibilities of a gaming industry artist include creating game characters, locations, visual game development, design game levels and other amazing tasks.

Game Design In the computer games industry, a game designer is simultaneously a director, screenwriter and project coordinator. He not only invents virtual worlds, but also leads a group of artists and programmers to bring to life a game that millions of people will spend time with.


Many people believe that creating simple DIY animations at home requires special skills and a lot of time. In fact, simple computer programs and standard applications Windows operating system.

Do-it-yourself animation using standard Windows OS programs

Animation - sequential demonstration (show) graphic files, which creates the illusion of moving objects. To develop it you only need two standard programs, which are available on almost all computers with an operating system Windows system— Paint and Movie Maker. The first allows you to create and edit graphic drawings, the second is video. The quality of the animation developed will depend on your drawing abilities.

1. Framing

Open Paint. Select a brush from the toolbar, select the desired color and draw any object on the working field. We save the drawing in a previously created folder under the name “Frame 1”. Then we draw the same object again, but slightly changing its position (for example, in the first frame the clock hand may be at “12”, and in the second at “1”). Save the image under the name “Frame 2”. Thus, we develop several frames. The greater their number, the smoother the object’s movement in animation will be.

2. Combining drawn frames into one video

Opening Movie program Maker. In the taskbar, select “Import images” and load frames. They will appear in the Collection panel. We transfer them one by one to the path located below. Click on “Display timeline”. If you do not change the program's standard display time, the animation object will move abruptly and slowly. To change this, click on the frames and move the bar that appears to the left. The frames will become narrower, which means their display time will decrease.

3. Voice over animation

You can add comments to the animation by recording them through a microphone, or put background music. In the first case, go to the “Service” tab and select “Comment Timeline”. Then click “Run”, voice the character or read the voice-over text. Upon completion, click “Stop”, save the comment, add it to the project, and then soundtrack in the bottom panel.

4. Saving animation in the desired format

Select the “File” menu item and sequentially click “Save movie file”, “Show additional options", "Other options". Then select the format of the future video file. We recommend saving the animation as popular format(for example, AVI, MPEG, PAL, etc.) so that it can be played on many players and easier to upload to YouTube.

Creating GIF animation

GIF animation (“gif”) consists of individual frames, for which a parameter is set such as the duration of display before the next picture appears. It only supports an 8-bit palette, which means that no more than 256 colors are displayed, which is an advantage over other formats. Most often animated GIFs files are used as navigation elements on websites and advertising banners.

The simplest program for GIF creation animation is Easy GIF Animator Pro. Download it, open it, in the main window click “Create” new animation", after which the "Animation Wizard" will open. Next, add images (we select them on the Internet or draw them ourselves in Paint program). Click "Forward". Set the duration of each frame. If necessary, select to show the animation in a circle.

If images are selected different sizes, the program offers several options for positioning pictures relative to the largest image:

  • in the center of the frame;
  • left top corner frame;
  • Enlarge smaller pictures to the size of the largest image.

Also GIF animation can be created using the UnFREEz program. To do this, it is enough to develop frames and “drag” them into the program window. Then you need to specify the delay time between frames and enable cyclicity. At the end, you need to click “Make Animated GIF”.

Programs for creating animation

A program with great functionality and clear interface. It allows you to create hand-drawn characters and bring them to life in 2D animation. Its capabilities:

  • set of raster and vector tools for creating and processing images;
  • the ability to draw with a pen or brush;
  • creating shapes using a “broken line”;
  • background import;
  • working with layers,
  • adding an audio file for export in swf format.

Synfig Studio

With this free program can be created simple animation in 2D format - similar to the one used in feature films. Its advantages:

  • “tweening” function, which allows you to automatically develop intermediate frames;
  • gradient overlay;
  • support for vector elements;
  • distortions;
  • filters;
  • tools for creating fractals.

ToonBoom Studio

The program has two operating modes: Drawing and Script. Contains necessary tools for developing vector drawings: brush, pencil, rectangle, broken line, ellipse. Functions: drawing using a tablet, vectorization of raster images, overlaying animated scenes on a real video, exporting data (for example, individual fragments from photographs).

This is a popular program for creating 3D animation. Its advantages:

  • realistic imitation of objects (for example, fabrics and hair) and phenomena (collisions of objects, wind);
  • a large set of functions for creating interactive games;
  • a wide range of primitives (cylinders, spheres, cubes, rings), from which you can easily create your own models;
  • support for non-linear editing.

Other popular programs to create animation with your own hands: Plastic animation paper, Creatoon, 3D Studio Max, Adobe Image Ready, MyPaint, Jasc Animation Shop.

Order animation creation, script writing or developing an idea for a video from KINESKO- We will do our job efficiently!

Contact Information:

>