Practical Implementation of Animation for Students of Pedagogical Studies at MIAS CTU in Prague

This paper shows computer animation as a teaching and learning instrument in technical education. Our aim is to show good practice in creating computer animations. The paper includes an example, which can serve as a practical guide for teachers of technical subjects.


Introduction
The main goal of this paper is to present didactic aspects of producing computer animations for use in education, to categorize types of animations and provide examples.
A secondary goal is to show an approach to creating an educational animation by means of a simple example.The authors prefer a systematic approach to the creation of interactive components, which they consider to be an effective way of achieving the desired results.The first part of the paper will introduce the concept and will explain each step.Specific examples will be shown in the second part.

Creating educational animation -design approach
In the same way that we need to prepare before teaching a class, we need to have a method and to think things out before we can create the educational animations.If we are in too great a hurry, thinking only about creating an animation of some kind, the outcome is not likely to be truly effective.Trial-anderror usually leads to unpleasantly inconsistent results.We should therefore study proven methods, and approach the general process of creating animation as a project divided into several stages.The project can be broken down into the following basic phases: Note that these phases are very similar to the principles and approaches used in any systematic human activity.

Analytical phase
In the preparation stage, we usually consider the concept and display of the problem that is to be presented.We decide which parts of the topic would be suitable for an animated display.In other words, we consider how the subject should be presented in order for students to understand it easily and be able to remember the important facts.The course description is usually a useful starting point.We ask ourselves fundamental questions: whether the animation should be just demonstrative, or whether it should be interactive with direct student participation.A demonstrative animation enables the learner just to observe the issue under discussion, and on this basis to form an idea and acquire knowledge.We also consider the choice of an appropriate technology, whether it is available, or whether it is first necessary to acquire it and learn how to use it.
At this stage it is worth investigating whether something similar does not already exist.In this way, we can avoid making unnecessary efforts.Nowadays, a great number of ready animations can be found on the internet, in various forms.Time spent on making a search is definitely not wasted.

Concept
In the concept phase, our ideas should gain a more precise form.We should set basic forms of parts of animations, consider specific animated features, their properties and location in accordance with didactic principles.On the basis of the outputs of our analysis, we should choose an appropriate software product for creating the animations.[1] The concept phase includes setting a detailed timetable for creating the animation.It is also necessary to decide on the process, and on who will create a specific animated situation, when and how.This proven approach is especially suitable when dealing with a broad subject, which usually requires timeconsuming processing.We also should consider when and how to incorporate the animation into a class or lecture (e.g., use diagnostic animations for recapitulation).Of course, if we want to present an animation during a lecture, it is necessary to ensure that the classroom has appropriate equipment.This may not always be easy.

Realization
The realization stage involves actually creating the animation.With the selected SW tool we create specific objects, models and scenes according to our requirements and needs.However, even at this stage it is necessary to take into account the properties and capabilities of the software product.Depending on the possibilities, we can choose either to create the animation gradually, from the beginning to the end, or to create individual parts separately and then assemble them into the final product.

Piloting
Before using the animation in the classroom, it is advisable to do some so-called piloting, i.e. initial testing of the product.Piloting is a notion drawn from preparing examinations -see [2].Animations are submitted for criticism by a colleague (or by several colleagues) who did not participate in creating the animation.Another option is to test the animation with the help of senior students who have already encountered the problem that is to be presented, and are thus able to share their impressions and opinions.After piloting, deficiencies that had not been picked up, or that had been overlooked, can be removed.

Completion
The completion stage involves publishing the animation.This can be done in various ways.In most cases, the product is published on the internet via webpages integrated into an electronic learning system (LSM) run by the school.This method is convenient if we want the product to be accessible only to a certain number of students with an access password, and not to the general public.If no e-learning system is available to us, we can try to create a simple webpage and publish it.There are many tools available that can export an animation into a form that is relatively easily incorporated into webpages.

Testing
The last step should be to test our work.Initial testing is usually conducted with colleagues who can point out major deficiencies from the outset.Af-ter making corrections, we can proceed to piloting, where we test our project on a group of students.After piloting the pages with animations, we proceed to the evaluation stage, which takes the form of a discussion or a questionnaire.On the basis of the results, we again make appropriate adjustments and changes.Now it might seem that everything is ready.However, this would be a wrong assumption.We must realize that as the world around us changes, the students also change.Thus we are faced with the task of re-checking the suitability of our created animation, in professional terms and in pedagogical terms -see [3].

The process of creating an animation
In this second part of the paper, we will present a specific example of creating an educational animation.For illustrative purposes, we will present a simple animation of the principle of the operation of a paternoster elevator.This animation might be used in mechanical engineering classes for high-school students.We will follow the steps listed in part one, with minor simplifications.

Analysis
Let us consider the following model situation: We are teaching a course on engineering and machinery at a technical high school with an engineering or electro-technical specialization.The audience that the animation is designed for consists of second and third grade students.The students are proficient with computer technology and the internet, and have access to a school computer network.They can also log into a school intranet via a web interface.If some of the students do not have an internet connection at home, the animation can be copied to a CDROM and given to the students.
Before the era of e-learning, we used only textbooks with pictures and photos as didactic tools, together with regular blackboard and chalk, and for a few topics we had a videotape of a program from a public media broadcast.We also used to enrich the class with samples of machine parts, e.g.bearings, cog-wheels, etc.
In order to enhance students' education and increase their interest in the topic, we decided to use an animation of a complicated piece of machinery.
A check showed that there is no available educational CDROM meeting our expectations on the market.An internet search also did not reveal any sources where the topic was presented using animations.We therefore decided to fill the void and to create an animation of our own.We can use ordinary computer technology owned by the school to create the animation.We will assume that the school has bought Adobe Flash software -see [4].We chose this product on the basis of our previous positive experience.

Concept
Let us consider a simple animation, which will reflect the essential features of the functioning of the paternoster lift.We will not go into much detail.The constituents in the animation will be relatively simple symbols, so that students can understand easily and will later be able to explain the principle and draw a scheme of the lift -see Figure 1.If we should find out later (e.g. during piloting) that the animation could be more detailed, it will not be a problem to update it and go into greater detail.
For a simple representation of this kind, it would not be advisable to attempt to make the animation three-dimensional, because the work would be much more time-consuming.We would like to create the animation in a relatively short time, and with minimum effort.This is why we chose Adobe Flash.Its controls are similar to the controls of other graphic tools that are widely used in computers.In addition, it is not difficult to understand the elementary principles for creating an animation, and a fairly computerliterate person should be able to master them.Moreover, Flash contains several tutorials through which even a beginner can find out the possibilities and options.
In an animation we distinguish between static components, which do not change during the animation, and dynamic components, which show certain changes, e.g.: • Motion (Motion Tween)

combination of the previous options
Adobe Flash supports this distinction between static and dynamic symbols, and offers three basic types of symbols to the user [4]: 1. for static symbols it offers the Graphic type, which can contain both graphics drawn by the user and inserted raster images and photos, 2. for dynamic symbols it introduces the Movie Clip type, 3. for creating buttons it offers the Button type.
In our case, we will use only the first two types, because we want to create a demonstrative animation without any interaction with the user.Our symbols from Figure 1 can thus be divided according to the following table: Let it be added for clarification that the symbol of the animated rotor contains a symbol for the rotor itself.The Movie Clip type is therefore usually composed of individual static symbols of the Graphic type.We can also see that the cables do not have to be represented by a symbol, but can be drawn completely freely with a line.
The next step in our consideration of the design concepts for the paternoster animation should be to allocate the individual symbols to sub-layers.This is therefore a logical separation of symbols with a different meaning.However, there are also graphic reasons for this separation.We usually use it when we need to emphasize the correct order of the symbols on the screen, or for animations in which the symbols are supposed to overlie in a specific way.Adobe Flash fully supports layers, and even offers several different types of layers.Four layers of the following types are sufficient for our animation: • two layers of the Normal type for the symbols for animated rotors and cables, • a layer of the Guide type for the invisible line on which the cabin will move, • a layer of the Guide type for the cabin which will move on the line from the previous layer.The names of the individual layers and the order of the layers will be described in the following section.

Implementation
The implementation is the process of creation, when we gradually create the sub-components with the use of Adobe Flash.Then we compose the subcomponents into the final animation.The repetitive motif of the rotor can be used to our advantage, since we need to draw and animate it only once, and then use it four times.For better orientation, we can follow the sketch presented above.
In the previous section, we generally indicated the types of symbols that would be appropriate for our components.We also allocate the symbols approximately into layers so that they will make sense and will correspond with our ideas.The creation of the paternoster elevator is thus divided into the following implementation steps: 1. Customize IDE (Integrated Development Environment) 2. Draw the symbol for the rotor 3. Create the animated rotor -see Figure 2 4. Draw the symbol for the cabin -see Figure 3 5.Arrange the symbols into layers and distribute them on the canvas 6. Draw the guiding cables -see Figure 4 7. Create the line for the movement of the cabin 8. Create the animation of the cabin on the line 9. Export the animation into a format displayable on the webpage -see Figure 5 All these steps will be implemented in the IDE of Adobe Flash.In this way, we will not need any other software tools.

Piloting
At this stage, the animation is already complete.Next, we should carry out initial testing and present the results of our work to someone who is unbiased, but who has knowledge of the topic and can offer objective criticism.We therefore ask a colleague to evaluate a demonstration of the animation.It is also good to approach some senior students, show them the animation and ask for their informal but important opinions.In both cases, we should consider their suggestions and make any necessary changes.The opinions will probably not be the same.However, we consider that both groups of evaluators are important, and neither should be omitted.

Completion
The work on the animation project will be completed as explained above.We will modify our presentation in Flash for publication on the internet by saving it in an appropriate format.With the permission of the school network administrator, we will place it on the school intranet system where it will be accessible for the students.If there is a student who is unable to connect to the network from home (which will become highly improbable in future years), we can also save the animation on a CDROM.A CDROM can also serve as a backup.

Testing
The last stage is to test our animation and find out how useful the students consider it.In this step, the targeted group of students will discuss the animation or respond to a questionnaire to let us know whether it was useful and whether it helped them to understand the topic better.After the evaluation we can make further adjustments.As was already mentioned above, we must not assume that our task is now over.After some time we should revise all the animations that we have created and consider their validity and purpose.In this way we can ensure that we are keeping up with the latest didactic and professional standards.

Conclusion
The goal of this paper was to acquaint readers from the professional public with the topic of creating educational animations.This problem has not been dealt with theoretically before (the authors were unsuccessful in their efforts to find any relevant references).We have noted that many animations are being created without taking didactic considerations sufficiently into account.In our opinion, this is not a satisfactory approach.We have therefore attempted to bring some theoretical order into the issue of making animations for e-learning.This could form a basis for further research on the theoretical bases for creating educational animations.The paper ended with a practical implementation of our theoretical principles.The topic is extensive, and it is obvious that the set of three papers presented here cannot deal exhaustively with the whole topic.With the availability

Table 1 :
Choice of type for individual symbols