Table of Contents



Leaving Certificate Technical Drawing through an e-Learning Animation

Colin O Brien CPMM4

Table of Contents Title Page

Acknowledgements …………………………………………………..4

Abstract …………………………………………………..5

Chapter 1. Introduction……………………………………..6

Brief overlook of the chapters…………………..6

Chapter 2. Evolution of E-learning / Instructional Design

Introduction to E-learning……………………....8

Learning………………………………………...9

Behavioral aspects……………………………...10

Constructive Perspective……………………….11

Methods of e-Learning…………………………12

Why e-Learning………………………………...13

Creating an e-Learning application…………….14

Interactivity in e-Learning……………………...16

Instructional Design…………………………….17

Instructional Media……………………………..23

The future of e-Learning………………………..25

Conclusion……………………………………...26

Chapter 3. Animation

Introduction to Animation……………...............29

The Origins of Animation……………………....29

Traditional Frame by Frame……………………30

Methods of Animation………………………….30

Problems with Animation……………………....31

Conclusion……………………………………...31

Chapter 4. Development Platforms

Introduction……………………………………..33

Flash 8…………………………………………..33

3D Studio Max………………………………….36

Conclusion……………………………………....37

Chapter 5. Design

Introduction……………………………………..38

User requirements………………………………38

Flowcharts / Storyboard………………………...39

Chapter 6. Implementation…………….…………………...47

Chapter 7. Analysis

Products………………………………………...68

Final Thoughts………………………………….68

References ………………………………………………….70

Appendix A Flash 8………………………………………….71

Appendix B 3D Studio Max Swift Renderer………………...76

Appendix C 3D Studio Max…………………………………79

Glossary ………………………………………………….84

Acknowledgements

I would like to thank all who helped me in any way with this project. In particular Helen Fitzgerald my project supervisor, Joe Campbell for help with some action-scripting and Rob Sheehy for help with 3D studio max.

Project Abstract

Chapter 1

Introduction

1.1 Introduction

This project was chosen because technical drawing is a very suitable subject to create an e-learning application for. As technical drawing is a very graphical subject displaying the topics and their development in an animated step approach can give the learner more control over how they view the drawings development. There are few books or revision material for technical drawing and not even exam papers for the subject, this area has been somewhat ignored by Education bodies and publishers. Although some publishers do print exam papers for the subject they were hard to find, and without exam papers it is hard to assume what to revise properly.

Few technical drawing books exist; therefore most students have to keep all drawings from their previous two years as reference for their revision. This is a system that is prone to fault as if you are missing due to illness or a personal matter one will have missed a topic leaving no reference for the final exam for this topic. Technical Drawing is a subject of accuracy; it takes practice and precision to have a final drawing to a satisfactory standard, and having no reference other then the drawings over the year makes revision difficult. The option to have an e-Learning product that offers a definite answer to the problem and then be able to show the proper method to the solution is something that would be very useful.

2. Structure of the Project

Chapter two reviews e-Learning and its origins, development and it possibilities. It also discusses learning itself, what is considered to be good methods of teaching and what should be expected of the learner. The technologies are also researched.

Chapter three researches the methods and variants available in the world of animation are discussed. It explains all the main methods of animation available today and the origins and milestones in the world of animation.

Chapter four discusses the development platforms available for the creation of the final product. It explains some of the main features of these platforms as well as some of the features that will be used for its creation.

Chapter five reflects the implementation of the project. This is where all the methods of creating the final product are explained. It shows all the options open for the creation of the product, all the problems that came about and how all the solutions were found. It shows how each button, animation and section of code work and how they are used.

The final chapter looks at the researchers opinions towards the final product. Its strengths, weaknesses and what would be changed or handled differently if creation of a similar product is needed.

Chapter 2

E-Learning and Instructional Design

2.1 Introduction to e-Learning

E-Learning is instructional information that is delivered electronically by means of Internet/Intranet or CD-Rom / DVD-Rom. Due to its capabilities it has become an emerging technology that’s growing at an incredible rate. A learner wants to be able to have the information needed as quickly and as easily as possible, meaning that e-Learning is a suitable option for those who wish to learn quickly and efficiently. E-learning means that the information needed can be accessed easily in the application whether it be online or offline. With simple tests to monitor progression and ensure that the learning is to a proficient level, one can access the program as needed. In the realms of learning about information based subjects, e-Learning is one of the best applications possible. This is due to its ease of accessibility and its open nature towards its sources and solutions.

It ranges in many different ways, there’s the standalone e-Learning programme. This would be an external device such as a disk and would have all the information you need about a chosen subject as well as tests and links to other relevant information contained within it. On-line learning is a growing way to access the information required online through a purposely designed message board. This board contains numerous learners requesting the same information as the user. As a group they discover how to use this new information and aid one another in its discovery. Distance education is another form of online learning; here you have lectures over distance using video links so you can interact with the lecturer. This is typically held in educational facilities as the equipment needed is available in most schools and collages.

2.2 Origins of E-Learning

E-Learning is a result of necessity being the mother of invention. Learning through media was first introduced in the First World War. During these times military authorities needed to train solders in as quick a time as possible with as little man power as possible. They would show them short films demonstrating the basics of army practises and procedures. Computers were also a creation of a world war, as in World War Two scientists need a way to perform simple calculations, and the first computer was created to perform these calculations.

Computers were considered to be the next major form of media to follow the radio and television, the fact that it could contain both types of media was a great advantage. As its content became more accessible and customizable its advantages became more pronounced. It appeared to become more content rich but appeared to start to suffer the fate as television and radio learning as the medium hadn’t fully matured. The creators of e-Learning applications would focus on the technology aspects to ensure the product would run. Creators would never test the application on the given market, but instead would create the mediums and then source the needed content and then assume that this was all that would be needed. This led to the first fault of e-Learning as the applications did not give the desired effects in the time given. Creators would over-estimate the possibilities of the medium and not meet any of the expected goals as a result.

With this now being realised, developers are beginning to see the faults being made and are starting to apply the proper research and development towards their products. This is leading to the newer versions of e-Learning applications and development.

2.3 Learning

“Learning furnishes our minds with the skills and capabilities that we depend upon” (Howe M, 2003, pg 1). Learning is the capability that has made man the dominant species on the planet. Our curiosity and want of knowledge has changed the face of our planet and ensures more change in the future. A process that starts from birth and continues through out life learning is our greatest asset.

In the case of learning specific subjects, learning changes a student’s behaviour and confidence toward the subject and learning itself. Learning is a very interactive process acquired through experience, this experience changes the way one would react in a situation which shows proof of learning.

The way a person reacts to a subject depends on the extent of knowledge they have learned about that subject. Learning can be sectioned into two separate models, objectivism and constructivism. Objectivism is the idea that learning is best evoked through a teacher, meaning all students learn the same information and standardised test can give accountability. Constructivism centres around the idea that the student best learns through hands on self experience. This gives experience towards subjects but makes testing hard as no two students might learn a topic in the same manner.

2.3.1 Behavioural aspect

Education has certain effects on people’s behaviour as learning is described as “a change in the probability that a person will behave in a particular way in a particular situation.” (Newbie T, 2004, pg 27) The best demonstration of this is the way people learn application and the practical use of information. An example is learning to perform a certain process (for example a puzzle, or construction of a simple object). At first a student may perform the task with a few common mistakes, but as their experience and confidence towards the task increases they become better and more efficient at it. Showing that the change in behaviour has had effect on the result of the task.

“Behaviour is shaped by its consequences, the pattern of reinforcements (or rewards) in the environment.”(Boyle T, 1997, pg 86) This shows that there has to be a very good approach towards the psychology of teaching and learning. The goal is to have the student showing the target behaviour; this would have them showing appropriate motivation, attitude and approach towards the subject. With all of these factors taken into account the programme could optimise the process of learning.

2.3.2 Information Processing

Minimalism is an approach in the context of the content that the subject contains. With minimalism, instructors reduce the amount of explicit instructional material and support more natural forms of learning. This means that theory and practical work are used as they would be best and easiest learned, rather then when the subject syllabus dictates.

Learners take in information in a similar way to computers. Learners pay attention to the source that conveys the information, be it a teacher speaking about a subject or some slides projected onto a screen. We absorb this information into our short term memory similar to the Random Access Memory (RAM, temporary memory) of a computer, over time we them transfer it into our long term memory similar to a hard drive. To retrieve information from our long term memory we have to transfer it into our short term memory to properly recall the information, just as long term data is transferred into the RAM in a computer.

2.3.3 Constructive Perspective

“Constructive perspective brings about context to the student for the subject” (Newbie T, 2004, pg 34). It is needed for the working world for the student to encounter differences in perspective. As they will encounter different perspectives and will have to realise how matters in their industry can change from country to country. This is needed for exchange of information and methods of communication.

There is a flaw to this method though, as a young child cannot understand perspective. There have been numerous experiments and test to prove this, the following is a simple version of one of these tests given. “Some children were shown a model of three mountains on a table and then shown three pictures of this model from different perspectives. The children were asked to choose the picture which would have been view by someone sitting opposite of the model. The children picked out there own perspective of the model and not someone sitting opposite. Children usually don’t beginning to under the concept of perception till the age of eight.” (Boyle T, 1997, pg 93)

This is not the final word on perception for a child though; it is believed that the reason that children failed this test is because the children found no meaning in it. In their lives they had never encountered such a task and found it had to interoperate what the exams meaning was. If the example had been something that the children had encountered or experienced the passing rate became over ninety percent, showing children have perspective but the perspective must have meaning to the child.

Further research into such subject revealed Jean Piaget’s Child Development Theory. This theory gives the four stages that a child goes through in order to fully understand the world around them.

• Sensorimotor stage (birth – 2 years)

Children explore the world around them through their senses and motor activities.

• Preoperational stage (2 - 7 years)

Development of speech and symbolic activities, general counting, but certain concepts still evade them, such as different shape dose not mean greater area.

• Concrete operational stage (7 – 11 years)

They show an increase in abstract reasoning and generalise from concrete experiences.

• Formal operations stage (12 -15 years)

Thy can organise and test information, reason scientifically and show results of abstract thinking with symbolic materials.

2.4 Methods of E-Learning

E-Learning is a broad subject as it includes all forms of electronic learning; this refers to E-Books, all online courses as well as video conferencing for lectures, as well as all specifically designed E-Learning applications. With this being a new and emerging technology there are still experimentation in the fields of what methods are the best towards teaching certain subjects. There are three main streams that Computer integrated learning can be compiled into the following categories.

• Computer as teacher

• Computer as assistant

• Computer as student

Computer as teacher would be best given by example, such as online typing courses. The computer will display how your hands should be placed on the keyboard and will slowly introduce you to typing by testing you in levels of difficulty and speed. The computer will allow you to proceed to the next level of learning when you have shown the proper application and experience of what it has thought by means of a simple test.

Computer as Assistant is a term for most applications a computer has to offer such as word processors, spreadsheets and presentation programmes. These programs are used to be a medium of education; message can be conveyed through these programs by giving a lecture on the material given or simply including all the necessary information in the file.

Computer as student is when the computer is given specific instructions by the researcher as the application is being created. The computer is given the necessary instructions and all materials that will be needed for the creation of an E-Learning application. This will include definitions for variables, formulas for calculations and other variable attributes and their purpose.

2.5 Why e-Learning?

Although e-Learning is a useful method of conveying information why should it be chosen over conventional methods of teaching? There are numerous reasons as to why a teaching method should be chosen, for example young children need a teacher, as they must to bring a sense of order to the classroom and engage the children in the subject. In the working world e-Learning makes ecological sense, also saving time and manpower. With e-Learning in the business world one can create applications and have all employees take the course at once rather then having limits by course instructor arrangements etc.

This makes it very appropriate for the current working world. Although this appears to make e-Learning a great application, these expectations were also given to such applications as learning through television and radio. A large portion of this is due to the high demand placed on the student as the workload is completely independent, they must research their own material, as well as organise their time and acquire the adequate computer literacy. These attributes illustrate why there is a sixty percent dropout rate for e-Learning applications.

E-Learning Advantages

• Easy to maintain and distribute.

• Cheap and effective means of education.

• Can teach large numbers of employees quickly

E-Learning disadvantages

• Could suffer the same fate as television and radio learning.

• High dropout rate for e-Learning courses.

• Little interaction with real world experts.

2.6 Creating an E-Learning application

To create an E-learning application with global meaning is impossible, when considering all the necessary factors that have to be taken into account. The interfaces have to be intuitive and easy to explore. The content has to be easy to absorb and displayed in an appropriate manner, while being made as interactive as possible. Above all though Fail to plan – Plan to fail, developers must have a very good fleshed out idea before starting an e-Learning application. The steps to be taken can be summed up as follows.

• Learning Culture

Is the target audience ready for such a method of learning, and what type of design would best suite that target audience?

• Change Management

The management of the project must understand every pothole and question that could be encountered.

• Project Team

An appropriate development team should consist of a learning strategist, instructional designer, project manager, and technology solution architect. This will maximize the potential of each team member and their individual skills.

• Content Analysis

Content is critical, so it is necessary to extract redundant data and ensure only relevant content is taught.

• Learning Strategy

The approach towards how the content is exchanged to the student; it must be engaging and encourage motivation towards its completion.

2.6.1 Cultural Diversities

This is a key factor when considering making an E-Learning application, as physical gestures and written phrases has different meaning as the cultural region changes. For example in Europe, America and Asia the gesture of a thumbs up is a good gesture meaning yes, OK, good etc, depending on the situation. However in the Middle East this gesture has the exact opposite meaning and would infuriate anyone this gesture was made to. Although language is a major factor this would also be of consideration to global companies with numerous international branches and would have language departments to translate the content appropriately.

2.6.2 Motivation

This is a crucial factor to a learner who wants to complete an E-Learning application. This can be the cause for a passing or failing. Without an instructor the demand that can be put on a student is high and some become overwhelmed by the amount of material provided. The reasons behind choosing to take a learning program can dictate as to how far one will advance in a program. Motivation can be categorised as intrinsic or extrinsic. “Intrinsic motivation is generated by aspects of the experience or task itself (such as the novelty or the challenge it presents” (Newbie T, 2004, pg72). In this form of motivation the student has a high percentage of passing as they want to pass the subject they chose as it challenges and interests them.

“Extrinsic motivation is generated by factors unrelated to the experience or task such as grades or recognition.”(Newbie T, 2004, pg 74) This form of motivation means that one would enter an activity or course for the final product and result rather then to take the course itself they only want the final product. Every application with a learning aspect should provide appropriate motivation for the student to pass the course.

Motivation in children is particularly important as they may finish the program but not absorb any of the information just out of simple motivation. “A child may believe (correctly) that the chances of getting high marks in a test depend upon the time spent studying, but unless the same child paces a high value upon a high test score this perception may fail to influence studying”(Howe M, 2003, pg 117).

2.6.3 Diversity

It is impossible to properly predict the user of the program; they could be male or female, young or old, etc. This is diversity; as this program is available to anyone who wish’s to use, the idea is to make as broad-ranged an application as possible. It can’t be assumed everyone using the program is of the same intellect and that a subject can be covered quickly with just the necessary information. All those who use an E-Learning application could originate from a different background although the majority may be similar one can’t assume that all are similar and start using references that people from a specific background alone will understand.

2.7 Interactivity in E-Learning

Interactivity is a critical component in E-Learning. With E-Learning the student has to make progress to enable access to further information. In the earlier years this was all the interactivity that E-Learning had to offer as programmes were limited by the computers capabilities. However the advances in computers and their capabilities increased. This meant that computers and E-Learning programmes could do more to expand boundaries on limits of information and interactivity. More content could be added without slowing down the speed of the programme. E-Learning programmes evolved and could adapt to required needs, if the learner was struggling with a certain topic it could go more in depth or ask you more questions towards that topic.

Interactivity is advantageous in e-learning as just the information needed is displayed, even if the information is required it still does not offer new motivation towards it. With interactivity you can be given reason to complete the programme aside from just completing all the necessary tests. It might be simple, such as complete a task before the computer can complete it or a ranking for the percentage received in the tests. Although reading from a screen as opposed to a book is not preferred, e-learning makes the reading more interactive by showing videos of the process that the text explains or showing a practical application in action etc.

It demonstrates all that the subject has to offer and tries to spark interest by showing all its practical applications and all that can be accomplished by completing this program. It shows how theory can be applied in real world situations. This is one of the many ways that e-Learning introduces motivation by showing what can be achieved with the information that it offers.

2.8 Instructional Design

Instructional design is the method in which one tries to convey the information to the user. Major factors considered would be the method of interactivity you intend to integrate, the desired content that you want them to learn etc. “Learning activity must have value to the learner and that learner must be expected to succeed.”(Salmon G, 2002, pg 12) This is target when creating learning medium. Creating the design with the user completing the program as the aim.

“The point is to travel rather than to arrive” (Salmon G, 2002, pg 10) the experience of learning a subject is so much more valuable then the information itself. The content must be short and to the point, no overlong explanations of a subject if it is not required. For example when teaching young children the process of addition in maths you would not start with the thousands of years of additions history. You would start by showing them examples of addition itself as there is no need for them to know how addition was created or evolved all they need to know is the process and its purpose.

The interface is a major factor. It should follow all the basic rules of interfaces such as clarity of links lack of contrasting colours etc. It’s rare that an interface will make or break a product as it is not the main focus but some applications have built a bad reputation by using complicated and eye straining interfaces.

2.8.2 Planning

The most important stage in creating an instructional programme is planning, as it must be decided which information to use and the method in which to convey them. For the planning to begin you must understand the subject you wish to convey to a teachable standard as well as the information of most use to the user. You must realise how to convey its topics and in which order, and to present the core material from the non-relevant material.

It is important to discover the needs of the target audience. If the subject is specific will the learners have to have special prerequisites? What type of interface or form of interactive learning will they best react to? What amount of contents will be required for them to learn? Is there going to be a specific goal in mind besides just completion of the course etc. Although it is imposable to get all of the target audience one hundred percent satisfied with a design, the aim should be to have at least above the ninety percent region satisfied with your chosen final design.

After this there are numerous smaller issues that need to be addressed, such as the target audience and cultural diversities. There are numerous methods that could be used to help create an E-Learning solution, each situated around a different aspect of your design.

This is the stage in which e-Learning applications tend to fail; developer’s surcome to some expectations by employers who know little about the capabilities of e-Learning. Management tend to focus mainly on the technology and neglect the actual training needs. Some have a badly organised training management area and do not fully apply the capability of e-Learning, and some over anticipate the capabilities of e-Learning and set very high expectations.

2.8.2 Instructional Methods

There are numerous instructional methods available to the market; usage depends on the information that needs to be conveyed and the audience that you wish to convey it to.

2.8.2.1 Co-operative learning

Co-operative learning is one of the most well used methods in tackling a major project as it incorporates a large amount of teamwork. An example is in the construction of a house, their will be several different groups. Block layers, carpenters, plasters, electricians and plumbers, all these groups of people help each other by providing their specified skills to achieve the goal of a well built house. This is how co-operative learning can be applied, the class will be divided into groups and each group has their specific task to perform. When each group have their task completed each group will combined their results completing the overall goal.

This method is the most realistic for the working world as you have to cooperate with co-workers to achieve your work goal, your experience towards social learning increases. “The incentive to help each other causes the increase in learning, not the efficiency in task structures gained by teams.”(Newbie T, 2006, pg 108) This method is weak in its marking scheme as lazier students get the shared grade of the group rather then getting the grade they earned.

2.8.2.2 Discovery

Discovery is a self learning method. In this the student is given some kind of a resource to work with, this could be an encyclopaedia or the internet. The student may have their chosen or assigned topic such as a certain country for geography, a particular law for civics etc. then they have the capability to research this topic for themselves. This method does work to good effect as the student does learn the necessary information for the subject but there are some elements vary. The results from student to student can change depending on the resource used to gather the information.

2.8.2.3 Problem solving

Problem solving is the most real world based method of teaching there is. In this you are given a specific problem and must decide your approach and solution to this problem. This involves five steps,

1. Define the problem and all major components

2. Formulate hypotheses

3. Collect and analyse data

4. Formulate conclusions and/or conclusions

5. Verify conclusions and / or solutions

These are the steps that will be faced in working situations and should be used when approaching any job in working situations to gain the practice needed. Each step has to be properly completed and before the next step can be started and then implemented. The reason that solutions fail is that they haven’t fully considered one of these steps and the end result is lacking because due to this.

2.8.2.4 Games

“Games can promote engagement and delight in learning” (Newbie T, 2004, pg 105). Games convey information to the student as they use the information given to progress, and complete the game. You have to create something that keeps the user entertained as well as giving good motivation as to why they should pass the game. In every game available there will be some information you will have to learn to progress be it to know the storyline solve a puzzle etc. For games a number of tasks have to be integrated into the plot to keep the user learning the topic.

Arcade games are best suited to young children as they are self explanatory with no over complicated story lines, this means you would have a simple challenge in front of you and you have a time limit or number of attempts to get the solution of the problem, a good example of an arcade game would be hangman. As a subject becomes more content based adventure games might be more suited as they can have a storyline being based around the subject and progression in the game depends on your learning and understanding of the subject. Games for learning do have some disadvantages as some students can confuse the game rules and real life rules. “They may then have difficulty transferring their skill to a later non game situation.”(Roblyer M, 2000, pg 95)

2.8.2.5 Simulation

“…integrate the two aspects of knowledge, theory and experience, by presenting the theoretical components of navigation in the context of a simulated experience” (Hodges and Sasnett, 1993, pg60). Simulation is used in many fields when actual field testing could be considered too dangerous. Simulations allow you to experience the event in a simulated environment so even if something should go wrong no danger will be encountered. The best examples could be found in most computer shops as they stock numerous flight simulators as well as some more unorthodox ones such as sim city which allows you to simulate building and managing your own city.

Simulations should engage the leaner in as much interactivity as possible as purely passive simulations can become frustrating as you cannot control the changes and see the result you desire. You also have very little control over the speed at which the program will play at and this can also become an annoyance. Simulations are a form of learning by discovery as you can change the variables in a situation and see the effects that would occur as a result.

Simulations are good for gaining technical experience and knowledge if the simulator is in anyway social it will run into difficulty and if the user doesn’t believe the simulation to accurately represent the situation they will not take it seriously. This is a very good way for people to gain experience towards a specific field without any of the dangers that may be encountered. “Simulations are excellent for relating the abstract to the concrete.”(Boyle T, 1997, pg 69)

2.8.2.6 Drill and practice

This is the most common practice towards learning in the world and is one of the earliest and still best methods towards learning simple information. Every primary school pupil has learned their multiplication and division tables through this method. They simply read through them until they can recite them without effort. There are also other variations of this type of learning method such as rhymes and pictures to remind you of specific information. “Richard Of York Gave Battle In Vein” is one of the more popular methods to remember the sequence of colours in the spectrum of light. This is a very effective way of learning although time consuming and it can only be applied towards most simplistic subjects. It is considered to be a good method by teachers as the amount of grading is quite small and the motivation towards a drill and practice subject is quite good as subjects tend to stay n memory for long periods of time and are easy to relearn.

With certain topics, drill and practice is the only way to learn. Topics such as learning to juggle requires numerous hours of practice and dedication. One cannot simply be told directly how to juggle, the learner would have to be instructed and told depending on their attempts areas that need improvement. Their bodies also have to become accustomed to the movements and goal of the movements for the learner to become fully accustomed to the actions.

This is also the case with musical instruments, the theory behind the list of notes and sequences that they come in may not take long to learn but the physical actions that invoke these sounds will have to be practised until the movements become natural and quick to reaction.

2.8.2.7 Tutorial

A tutorial is a method of conveying further information on a subject to the student. Usually done on a one to one basis to make the information easier to relate and answer back to. It is the most effective way to gain the concept of a subject or to gain further insight as to how something works. This is best done on a one to one basis as the teacher can address specific topics that the student is having difficulty with and create a method to resolve this, also the teacher can explain how they came about to learning the subject and the mistakes they made and how solutions were found as an example to the student. Tutorials are split down to two separate methods, Linear tutorials and Branching tutorials. In linear tutorials the same method of conveying a subject is given to every student regardless of their progression or comprehension of the subject. Branching means that the subject is taught in a sequence depending on the answers given by the student so the effectiveness of the tutorial is greater.

2.8.2.8 Demonstration

A demonstration is done with all the forms of learning particularly physical and real object subjects. This is visible in a maths problem, the teacher will show the information given in the problem and will work through the solution in a step by step manner. Demonstrating how the result is found. This is a very effective manner of teaching as a lot of information can be conveyed in a single demonstration.

Although the theory behind why the demonstration was done, in that manner may not be conveyed, it still explains how the process is completed. This is most effective when integrated with another teaching method such as a presentation, to break from pure theory and add a practical element.

2.8.2.9 Presentation

A presentation is one of the most used methods of conveying a concept or text based information to a class or audience. In a presentation the information is presented to the student in slide format using PowerPoint or hand created slides. This one of the most popular formats for lectures as the student can take down notes as they wish and the content is explained as examples and content is conveyed by the teacher.

2.9 Instructional Media

The media used to convey the information in your programme is one of the most important decisions that will have to be made. Certain things have to be thought in certain ways, you can’t teach how to paint a picture over an audio cassette as it would take far too long for you to describe all the colours and tools that you use. You would have to consider all the forms of instructions that you will be using as well as how you want the student to interoperate them.

2.9.1 Video

Video is an effective method of conveying information, it can show someone performing a task as well as showing the real world applications. Although it is a good method of conveying information it has drawbacks. It can become outdated quickly and is costly to produce and distribute. Video comes in many formats and the quality depends upon numerous factors such as the frame rate, resolution of the camera other format it’s being published in and the medium for its final production. Video for the web can have a low frame rate and resolution as it will have to be streamed at high rates so its size should be as small as possible. With other mediums such as DVD disk or television the resolution and frame rate can be high so as to produce high quality movement as the medium can hold large amounts of data.

2.9.2 Graphics

This is best described as graphic illustrations used as a learning medium. This can range from pictures in books showing a graph image of an object described. Graphics is a popular option in lectures and demonstrations. This is because an instructor can show the topics main points in slides or any preferred format and then tell the students the meaning and purpose of these points verbally. “This is an effective method of communication and learning as there is evidence to support that humans recall pictures better than words” (Faulkner, 1998, pg 154). The method of conveying graphic image varies in computing as the need varies. Bitmap images are the most suited to the internet as they produce high quality images but scale badly. Bitmaps save an image by girding it down to its pixel base and saving the coordinates of each colour. As it scales it becomes pixilated and the quality becomes less as the image scales larger. Vector based graphics save the image as a series of geometrical shapes and lines. This gives it a smaller file size and gives the added feature of scaling without degradation of the image.

2.9.3 Audio

This method of learning is best used when you have a verbal point to get to the student; the best application of this method is used in languages. When learning a language you have to get used to the pronunciation and accent that is used with the language. This is also best used with video to explain what is going on and its reason’s. The user should have as much control as possible over the audio; the option should exist to play, pause, search and skip as necessary. Audio quality depends on its sampling rate and format. The sampling rate is how frequently the sound wave is recorded or sampled. The higher the sampling the better the quality of the recording, however the more a sound is sampled the higher the size of the file becomes. The quality of sound depends on the sampling rate.

2.9.4 Text

Text is the most frequently used medium of a subject as text has been the way we preserve and share information. Text can refer to books, computer screens, any written format. Text must be displayed in a way that does not overwhelm the user; if they are presented with a full page of text they will be hesitant to read it so small size chunks are the best approach. Text must also be open to little misinterpretation and easy for the reader to understand and associate to. Ensure that the text fit its purpose; be specific, definite, concrete and precise. “The internet and other forms of information and communication technology (ITC) such as word processors, web editors, presentation software and e-mail are regularly redefining the nature of literacy. To Become fully literate in today’s world, students must become Proficient in the new literacy’s of ITC.” (Moore D, 2001, pg 2)

2.9.5 Real Objects and Models

Only certain subjects would require for there to be a real object or model used in there teaching. One of the most well used applications of this would be a skeleton in a science lab. This is used to get the student used to seeing the particular bones of the human body and where they are located. This is one of the best applications of a real world object as it would take longer to teach this information in any other way as bones look similar and would only be seen as different as to where they are placed in the body. This is a good way to introduce tools that might be associated with particular jobs and the way in which they are used.

2.10 The future of E-Learning

The evolution of E-Learning follows a similar path to that of the motion picture. Motion picture started recording plays in theatres as these were most natural for recording, the camera didn’t need to be moved and the actors were always in range of a microphone. As time and technology progressed the camera could be moved more easily, smaller microphones meant that actors could wear microphones rather then having to be in range of one. These progressions in technology and techniques in film are also used in production techniques and methods of storytelling.

E-Learning started very close to its pen and paper alternative, slowly taking advantage of its possibilities and adding in other content and teaching methods. It is now adapting to technology in more ways as memory and processing speeds increase meaning that a programme can have more contents on screen and become more complex with no slow down in speed. E-learning will become a very useful tool in education in work as you could educate your entire work force in one lecture by broadcasting it to numerous different locations, saving time and resources.

In the future of E-Leaning, distance learning is going to play a major part, as communications speeds are enhanced, meaning such things as lectures over video link become more normal as the technology becomes more accessible to the user. Future technology is predicted to be as advanced as to be able to tell the emotional state of the user, this will be a very useful tool to developers as the application can now be tailored to suite an individuals needs down to emotional state. For example if it reads that the user is becoming stressed it can slow down the pace, or vice versa.

The trends in learning are becoming more apparent as time progresses. The number of people going into further education is growing as are the number of subjects covered by further education. There is a growing call for courses relating to new subjects and for content in older subjects to be more specific and relevant to the core of the subject. “Demographic forces and economics, as well as political and lifestyle trends all show a growing need for non-traditional education” (Heterick, 1993, pg 56).

2.11 Technology Restraints

The technology aspects can have effect on the final product, as the final medium between the computer and the student will be the screen which displays the information. If the screen is too small or the student has some form of vision disorder then the medium will have to compensate for this lack in function. If the program tries to display too much media or handle too many processes simultaneously the program may stall, slow down or crash in some situations. However this is a changing feature as mediums for computers are becoming more intuitive with technologies such as touch-screen becoming more widely available. Technologies are converging as methods of communication between technologies grow through the use of wireless and increased speeds through fiber optic communication. With portable devices becoming more common and people wanting more applications available through these devices, the wireless medium is becoming more important

2.12 Conclusion

Over the past two thousand years human beings have been learning and creating methods of learning through paper. Although there is no direct difference between the information being presented in paper or on a screen learners still prefer to learn through paper and books. The number of computer literate individuals is constantly growing however this does not mean that they still wish to learn completely through computers. With time learners will be accustomed to the screen as a learning interface and will be more open to learning completely through computers and computer interfaces. Until that time E-learning faces this barrier of traditional teaching methods.

E-learning is a very useful tool in the current working world. It introduces the required information and material to the learner in a friendly and easily interpreted manner. If one can produce a well researched and intuitive e-Learning program the benefits can be enormous. Developers have only recently realized that good content dose not create a good e-Learning solution. Many things must be considered when creating such a product, the target audience, methods of teaching, content management etc. This means that the creation of a successful e-Learning solution requires a large amount of work and taught in the specified area. It requires content to be concise and to the point, all forms of media used must be relevant to the topic and easily controlled by the user.

E-Learning seems to be suffering the same fate as its video and radio predecessors as earlier programs were poorly taught through due to poor project management. Developers are finally starting to realize there are downfalls.

E-Learning still has hope in it’s future with it’s creative aspects and advantages such as allowing games to be played if desired, having all forms of virtual and digital as available contents, it can even be thought in real time through the added application of local and wider networks as well as the internet. Most e-Learning applications become exceptional if handled by educators and people who understand how learning is created and translated to the learner. E-Learning solutions tends to fail because the software and methods of creating programs are easy to obtain and as a result companies might not give the appropriate people the chance to create something of good quality. In most situations they will keep an application’s creation within the company and use terms and methods unknown to newly hired staff or may neglect certain areas which are unknown to the learner.

The product being created will have to abide by the information discovered in this research. Drawings will have to clearly display their development. Text will have to be short but without loss of description or detail. Measurements will have to be shown clearly as to how they were obtained and manipulated. The information will have to be easy to understand and easy to interoperate. The product should be as close to its pen and paper alternate to enhance its use and understanding.

The ideas and methods of creating and manipulating content discovered in the research will greatly aid its development and in turn the user’s interaction with it. The methods of conveying this content will also be used to ensure that the content is properly conveyed.

Chapter 3

Animation

3.1 Introduction to Animation

Animation is a motion picture made from a series of drawings simulating motion by means of slight progressive changes. This is achieved by moving the characters and backgrounds in small increments for each frame to gradually achieve the movement wanted on the screen. The best demonstration of this is through stop motion animation, in this the characters are created in clay as its an easily moveable material and placed in an appropriately sized environment and then there’s a picture taken of the scene and the character is moved slightly and another picture taken for another frame etc. When all the pictures of the scenario are taken and shown in quick succession it gives the impression of movement.

Various animation methods are available ranging greatly in the amount of detail it can produce and technology needed for its creation. The most detailed methods of animation can require up to two or three years for the creation of a feature length film. With some simpler methods requiring as little as six months.

3.2 Origins of animation

The first animated features were in black and white as that was the limits of the motion picture technology of the time. These animations were short and simple; they had no sound and were under the length of a minute (usually based on a single gag, joke or activity). The first animation to break these limits was “Steam Boat Willie” the first Mickey Mouse cartoon, which had sound (the first animation which had synchronised sound) as well as a three minute life span. This was the first breakthrough by the Disney studios. “Snow White” was the first feature length animation as cinemas stopped the television like broadcasts and focused on feature films. Snow White was years in production and was a make or break moment for Disney animation studio, the film was a success and set the mark for animation around the world. In time animation studios such as Warner Brothers broke into the market with their approach to animation. And as many as fifty years after Disney had set the standard other countries started to show different approaches to animation with Anime and Magna (Eastern Animation) becoming a global voice.

3.3 Traditional Frame by frame

This was and still is the most reliable method of animation as every frame is available for editing. This animation method is little used now as the manual labour costs are very high as each frame has to be drawn individually. Every 12-20 frames are drawn by a key animator (a highly skilled drawing artist) and all the remaining frames will be created by an in-between animator (a lesser skilled animator). Each studio has its own standard towards the level of animation it produces, for example the cost of a Disney short to a Warner Brothers short can be ten times the cost. As Disney feel that since they set the standard they have to have is very detailed and of high quality and may go through a short animation up to five times before its final version. While Warner Brothers will go through a short only once as it only has to be good enough.

3.4 Other Methods of Animation

A traditional hand drawn frame is not the only way to create the simulation of movement. Some other methods have been developed through the use of computers and simpler versions of the motion picture camera.

3.4.1 Computer animation:

This is a very broad range and can range to animations as complex as “Final Fantasy” or as simplistic as “Family Guy”. 2D animations can be more easily produced with computer aids. This can be through packages such as macromedia Flash 8. 3D animations become far more complex as the more realistic the animation becomes. Some of the more well known 3D animations include “The Incredables” and “Finding Nemo” to name just a few. For a 3D computer animation to be as real as possible there has to be complex algorithms to ensure that the movement of the elements in the world are realistic. For this to be properly implemented physics formulas are entered into the animation to simulate gravity, wind, water etc. Many animators can come from a science background as their knowledge of physics can be invaluable in creating a realistic 3D animation. Animation studios tend to create their own animation packages if the software on the market dose not suit their requirements or if they feel it is not effective enough.

3.4.2 Stop Motion (Claymation)

Stop motion (or Claymation as the characters used are clay made) is a very time consuming method of animation, made famous by the “Wallace & Gromit” short animations. The sets and characters are physically created and are filmed a single frame at a time with the slight movements being physically made in between the frames. Stop Motion animation is a very well used animation method as animator’s use the time creating the feature to read through the story and ensure that the time being used to create this feature is worthwhile. This method is becoming less used as computer animation can achieve similar results but with more realistic fluid effects.

3.5 Problems with Animation

Although animation is a remarkably effective method of conveying a message there are drawbacks associated with it. Production and cost being the two most recognised. To create a good quality animation may take numerous years and the cost of keeping a production team in employment as well as the materials needed can become a very large amount and as many animations cost more then expected or run over budget. Computer animation is becoming a better used method as it can be cheaper then other methods if implemented properly and can give very good final products. The programs used to create this type of animation are also becoming more open to the consumer market as such products become more user friendly and easier to obtain in the open market. Animation is still finding its voice in certain cultures and areas as this is still quite a young medium.

3.6 Conclusion

Animation is a very powerful medium if it is created to a satisfactory level. It is the breakthrough format for many of the most entertaining films in the past ten years and even more so with the introduction of computer animation. Although it was originally used as medium for children’s stories with Walt Disney being one of its main pioneers, but it has found its methods of conveying to every age and nationality in their own individual way. Television became the perfect medium for animation with cartoons being an easier way to create special effects, as implementing them in real life became complicated with only average results.

Although the medium may becoming more advanced technologically the methods available still resemble large similarities to its original pen and paper origins, with use of the timeline (all the individual frames in the animation) as well as setting the frame rates and creating the original characters and backgrounds. Although the computerised versions do allow some nice features, most of these are simply time saving methods for the animation jobs that would have been done by in-betweeners in the original animations.

The method of animation in the final product is a combination of both simple 2D animation and simple 3D computer animation. The 2D animation will be used for the creation of the drawings, the topics and steps. This will include all the topics content, the page frame and the navigation buttons. 3D animation will be incorporated to aid the learner in fully understanding the topic in question. The 3D animations will be simplistic, simply showing the drawings being created. This will include cylinders rolling and points being created as they roll to certain points.

More objects will simply have to be created and available for viewing in 3D, as their 3D projection may be the solution to the question. The 2D animations will simply be lines and curves needed in the solution of a Technical Drawing question. These lines will have to be very precise and mathematical and will require heavy use of grids and rulers to ensure that the drawings are of an adequate standard.

Chapter 4

Development Platforms

4.1 Introduction

The development platforms used for the creation of the final product are both animation packages. Flash 8 is a drawing and tweening method for 2 dimensional animations; you can create your drawings within the program and give them appropriate motions such as movement across the screen or interactivity with the user. 3D Studio Max is a far more complex animation package for creating 3 dimensional animations. This package is far more mathematical in comparison to Flash 8 and has far greater capabilities in creating animations but lacks macromedia interactivity.

4.2 Macromedia Flash 8

Flash 8 is the latest version of the Flash animation and interactive website design series. It’s a Macromedia product aimed at giving the user the capability to create interactive products. Most of the animations on the internet are created and published in Flash.

There are numerous reasons as to why Flash has been such a success, why it was chosen over other animation products such as “Adobe After Effects” or “Swift 3D”. The most noticed reason is probably its ease of use and availability. You can download a free trial version of Flash 8 at any time. This makes it easy to access and experience. Its use is straightforward, the tools are easy to understand and use.

One of the reasons that it would be chosen over most other products is its use of Actionscript and its variety of possibilities. Actionscript is a coding language developed purely for use of Flash and designed with the specific intention of interactive multimedia as its product. It’s used for the actions behind buttons and some of the movements in animation. The wide variety of options that Flash has available provides flexibility; such packages as Gmax only focus on one particular area of multimedia (Gmax is a strictly gaming development package). This area might be gaming, web based animation or interactive design, yet Flash due to its combination of all areas is the forerunner.

Although if you were creating a package with one particular medium in mind an area specific package might be an advantage, but with Flash one can combine the elements of each of these areas to your advantage and create a truly interactive product.

4.2.2 Actionscript

Actionscript is code with instructing control over all the actions of the product. Actionscript code is precise and the user must first understand what it is exactly that they want the action to be and when this action occurs should occur. The desired code is entered into the Actionscript panel; this is where all code relating to the product will be entered.

An example for these actions would be the basic buttons that come with all media players play, stop, pause etc. The code that operates behind these buttons is straightforward, for the stop button to cease the movement of the playhead is

OnRelease {

Stop ();

}

This code is embedded into the icon that represents the stop button. This means that when this icon is released the playhead stops. This code can be entered in a number of ways, it can be hand typed into the Actionscript panel. This allows for more control over the code, as one can write the code to dictate what the action will be for every occurrence. This requires experience with coding language as a newcomer to this could be overwhelmed by the amount of contents and if mistakes are made then a solution may not be obvious. The code could also be entered by going to the actions library this is in the actions frame panel and allows code to be selected from a list that Flash has on file. This is appropriate for newcomers to coding as one won’t be able to make any grammatical errors as the code will be generated but this does not mean that it will generate the exact code desired.

The code must make logical sense; it cannot just be placed in without specific order and expected to properly function. The code has to be placed in proper working order. This means that the code would have to be written in the same sequence it is expected to work in, for example if you want an action to happen when a button is released you have to start the code with

OnRelease {

And then enter the action that is to be implemented when the button is pushed such as go to the frame, stop etc. To finish the OnRelease command you must always close it with another curly bracket.

4.2.3 Flash encoder

The Flash encoder is one of the most utilised encoders on the market. It is the preferred choice of media player as it can compact media content to a considerably good level for the internet. It is used for the creation of content on many websites as the format enables quick downloading. Any product developed through Flash can be converted to a smaller more manageable size using this encoder although when it is converted it can no-longer be manipulated as a Flash product, it is now the final product unless you have separately saved the Flash file before encoder.

On the internet, most games, animations along with some banner ads would have been created, produced and encoded in Flash. Flash is also used to create interactive websites and web-based content. It is also used for extra content on singles and albums as there encoded size means that they can fit easily onto a CD without restricting the main content to a lesser size.

4.2.4 JavaScript

One of the newer features of Flash 8 is the ability to code in JavaScript. Java is currently one of the most well used computer language. This is down to it’s compatibly and its library options. Flash 8 is a very good programming language as it is completely unlimited in the contents and formats that can be created in it, which is one of the many reasons as to why it was added. JavaScript is a very good language as it has a lot of the attributes of Java but not some of the more complicated ones, which are not required for Flash’s format.

The developers have taken all basic attributes of the basic Java programming language and converted it into a script alternative. It contains all the variable options that Java has as well as its loops and attributes variables. In JavaScript you can set the individual height and position of contents such as buttons and images in pixels (as well as centimetres or inch’s) for very accurate measurement. You can assign variables names and set their variables such as if activated etc. Although this can also be done through Actionscript, if you understand the Java language it is easy to convert over to this simpler method in which all you have to do is set simple loops and attributes.

4.3 Autodesk 3D Studio Max

Although Flash 8 is one of the best used animation solutions for web based content, it doesn’t reach into 3D as Flash 8 is purely for 2D animation. Although it is possible for you to create 3D animation with Flash it is very time consuming as it wasn’t the intention for it to be used in that way. For 3D animation, 3DStudio Max is one of the leading animation packages on the market. This product can be used to create such computer based animations as “Toy Story” or “Shrek”; however companies creating feature length 3D animations prefer to create their own application to have complete control over the animation.

3D animation is far more complex than its 2D counterpart. When the third dimension is entered you have to account for things such as camera positions and lighting. In 2D animation the camera was always in a simplistic position looking straight at the character and the background, while in 3D the entire environment has been created not just what is in view so you can place the camera where you wish without any of the background being blank or repetitive.

3D Studio Max is a purely animation package and does not offer much in the lines of interactivity. Since the animation method is 3D it is much more difficult for a button to be created as it would have to be a three dimensional object accessible from any angle.

4.4 Conclusion

The final product will be very time consuming to create as all the drawings images and buttons will have to be created in Flash 8 to allow full control over them. With a subject such as technical drawing the lines will have to be at certain lengths and angles which make the drawings very precise and mathematical to create. Having two separate animation packages will make the final product more interesting as it will have two perspectives of the same topic, making clear the difference between the two animation packages. It will also give the learner a greater idea of the final version of the drawing and as to what is asked in the questions. 2D animation will also be useful in creating the construction lines that can be very time consuming to draw. As these lines can be animated and created in a few seconds the learner will get a better view of all the main steps rather then spending time on working on the repetitive construction lines. 3D studio max is also a very mathematical method of creating animations as animations can be created by using coordinates and sizes of planes. This package is very suited to the animations that have to be created for the final product as they are very symmetrical and rely on precise angles and movements. The two packages should merge together well as the final product in 3D studio max can simply be exported as a finished animation file. This file can then be imported into Flash 8 and run in a media player or simply imported into Flash and added to the file as an element of the animation.

Chapter 5

Implementation

5.1 Introduction

The design of an E-Learning feature is one of the most crucial steps that need to be taken in its creation. There are numerous things that have to be done in its preparation and have been described in the report so far. These steps have been taken in this project to help create an effective product.

5.2 User Requirements

After the completion of this program the user will be quite proficient in the uses of technical drawing. One will be able to draw at a Leaving Certificate standard. However at the start of the program the preresqites of a Junior Certificate standard of the subject is required. One will be able to understand the concepts of roof geometry, trocoids, revolutions and projection, as well as the mathematics used in their creation and the reason for their use. The end capability will be, to be able to answer Leaving Certificate questions at a higher level standard at the chosen topics to a satisfactory standard.

5.3 Reasons for Choosing Design

The purpose in using e-learning is to become more experienced and obtain more knowledge about the subject. Each line will have to be drawn in sequence to show the it’s proper construction. It would have to give step by step descriptions of how and why the lines are drawn. The user will have to have very good control over the flow of information to see to a closer degree what is happening. Their should always be a direct link to the home page if one has accidentally entered the wrong subject. These were some basic ideas that are common in all E-learning applications. The researcher also decided to keep the environment of the program as close to an actual Technical drawing sheet as possible. The lines were going to have to simulate a pencil drawing and the lines would have to be crisp and accurate. The final product was kept as close to the actual experience of technical drawing as possible.

5.4 Methods of Creating Design

All the images and drawings in this project were created in Flash8 or in 3D Studio Max. The images created in Flash8 were very time consuming as they had to be very precise and mathematical drawings. The outlines and shadows for the buttons were created using the line and fill tools which made for quite a minimalist look. The icons for the buttons were developed in Photoshop as this package had some better tools for the creation of symbols and icons.

5.5 Project Storyboards

Following are the project storyboards; a storyboard is created for each unique page.

|Project Storyboard |

|............................................................................................................. |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|............................................................................................................. |

|Screen: 01 of 07 Screen description: Home Page |

|[pic] |

|Links from screens: Topic Selection, Gallery. |

|[pic] |

|Links to screens: All other pages |

|[pic] |

[pic]

[pic]

| |Technical Drawing Sheet |

|Background | |

| |Selection of possible actions to start or conclude the course |

|Action/Activity | |

| |Introduction symbol, pencil, set square, two navigation buttons |

|Graphics | |

| |None |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

[pic]

|Project Storyboard |

|......................................................................................................... |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|......................................................................................................... |

|Screen: 02 of 07 Screen description: Gallery |

|[pic] |

|Links from screens: All other pages |

|[pic] |

|Links to screens: Home page |

|[pic] |

[pic]

| |Technical Drawing sheet |

|Background | |

| |Choosing topic and step that you wish to view |

|Action/Activity | |

| |Scrolling box containing topic/step icons, Graphics icon, up button, down button |

|Graphics | |

| |None |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

|Project Storyboard |

|........................................................................................................ |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|........................................................................................................ |

|Screen: 03 of 07 Screen description: Topic selection |

|[pic] |

|Links from screens: All other pages (excluding gallery) |

|[pic] |

|Links to screens: Home page start course button |

[pic]

[pic]

| |Technical drawing sheet |

|Background | |

| |Links to all topics and steps |

|Action/Activity | |

| |Written links to all topics and steps, Home button |

|Graphics | |

| |None |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

|Project Storyboard |

|............................................................................................................... |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|............................................................................................................... |

|Screen: 04 of 07 Screen description: Trochoid steps |

|[pic] |

|Links from screens: Topic Selection, Gallery. |

|[pic] |

|Links to screens: Home, 3D alternative, text alternative, next step, previous step, next topic[pic] |

[pic]

[pic]

| |Technical Drawing Sheet |

|Background | |

| |Trochoid creation steps |

|Action/Activity | |

| |Navigation buttons, title, course position, step content |

|Graphics | |

| |None |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

|Project Storyboard |

|............................................................................................................... |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|............................................................................................................... |

|Screen: 05 of 07 Screen description: Trochoid 3D alternative |

|[pic] |

|Links from screens: Trochoid steps |

|[pic] |

|Links to screens: Home, Trochoid steps, Text alternative. |

|[pic] |

[pic]

[pic]

| |Technical Drawing Sheet |

|Background | |

| |Home, 2D alternative, Text alternative |

|Action/Activity | |

| |Navigation buttons, title |

|Graphics | |

| |Perspective trochoid, End view trochoid |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

[pic]

|Project Storyboard |

|............................................................................................................... |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|............................................................................................................... |

|Screen: 06 of 07 Screen description: Trochoid text alternative |

|[pic] |

|Links from screens: Trochoid steps |

|[pic] |

|Links to screens: Home, Trochoid steps, 3D alternative |

|[pic] |

[pic]

[pic]

| |Technical Drawing Sheet |

|Background | |

| |Next steps, 2D alternative, Home, 3D alternative |

|Action/Activity | |

| |Text step descriptions, navigation buttons, title |

|Graphics | |

| |None |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

|Project Storyboard |

|............................................................................................................... |

|Project: Leaving Certificate Technical Drawing through an e-Learning Animation |

|[pic] |

|Date: 14 / March / 2007 |

|............................................................................................................... |

|Screen: 07 of 07 Screen description: Final page |

|[pic] |

|Links from screens: Homepage, skoool.ie , |

|[pic] |

|Links to screens: Projection final step |

|[pic] |

[pic]

[pic]

| |Technical Drawing Sheet |

|Background | |

| |Homepage link, two internet links |

|Action/Activity | |

| |Technical Drawing logo, Home button, 2 external links, finishing text. |

|Graphics | |

| |None |

|Video | |

| |None |

|Audio | |

| |None |

|Narration | |

Project Flowchart

[pic]

[pic]

Chapter 6

Implementation

6.1 Implementation

The implementation of this project was an extremely time consuming matter as all the lines had to be created in a specific order and at specific lengths and angles. The wording of explanations also had to be carefully considered to avoid confusion. Each topic was completed in a completely new scene to save confusion. Each area of a topic (main drawing, solution, 3D Animation, text alternative) was created in a new layer as in would become far too complicated to have them on one layer.

6.2 Topic contents Frame

The first piece of media that had to be created was the back ground and frame; this would stay the same in each section of the final product and would be a good starting point. The frame was simple in its construction, as every Technical drawing page is framed it had to be replicated in a similar fashion. The frame is in ten millimetres from the top, bottom, left and right of the sheet which compensates for ware and tare of the sheet as well as to add a constructed and ordered feel to the drawing. The frame also has a title bar across the bottom of the frame. This is a place to put the drawing title, date and creator but only the title is relevant here as the date and creator are unneeded.

The first new feature that would have to be introduced to the frame were some simple navigation buttons in the top right of the screen. These would be needed for simple navigation from the current drawing frame to the home page, the 3D alternative or the text alternative.

[pic]

These three buttons will be a constant but will change depending upon what frame the user resides in. for example if you are in the 3D frame, the 3D button will be invalid so it will be replaced with a 2D alternative button which will bring the user back to the 2D drawings. As with the text frame you will have the option to go to the 2D or 3D options. These buttons were the only place where constant colour could be added without taking away from the drawings and making them seem unnatural for the subject.

The final feature of the frame is the next, previous and pause/play button. These buttons have been placed in the title bar to prevent any occlusion of drawing calculations or obstruction of text. The buttons give the user control over the flow of the animation. This means that they can stop on specific frames, or skip ahead if they know the information and skip back if they missed some information. At times it can become difficult to tell if the step is an animation or a series of static steps, to help ease this transition from static to dynamic the next frame button is disabled for the first four frames of animations. Previously if a user mover from single frame steps into an animation pressing the next frame button would stop the animation. This was bad flow for the animation as you would have to press the next frame button numerous time to get to the end of the now static animation. With the next frame button inactive for the first frames of an animation, the user has adequate time to realise the start of the animation and see it progress or skip through it one frame at a time by using the now active next frame button.

[pic]

These buttons can change or disappear depending on the stage of the topic that you’re in. For example in the first step there will be no need for a skip backwards button as there is nothing to skip back to. Also when you have reached the end of a topic you are given a new button instead of the skip forward button, this new button is the next topic button which allows you to skip forward to the next topic.

[pic]

All buttons had to have alternates attached to them; an alternate is a text explanation of what the button or image is. Originally I thought that this would be similar to html. Html is a web based programming language used to create and display a webpage. In this when all buttons or images are imported an alternate in attached which is displayed if the image cannot be displayed any particular reason. So I assumed that there would be an alternate option to fill in for each image in a flash file but this was not the case. Each alternative had to be created through the rollover and rollout functions.

For this to work properly I had to create a dynamic text box, this would display the text when the icons are rolled over. There had to be code behind each button to state which button references which textbox and the appropriate caption that has to be displayed.

[pic]

The frame above is a general layout for all the topics through out the product; although some variants change this layout displays the position of the elements. The boxes with dotted lines are the rollover alternate text and are not displayed when the product is being interacted with; these are purely a development display. The main stage is 1000 by 600 pixels; this leaves space for the drawing and the text explanations.

The 3D and Text alternative buttons have quite similar code behind them, an example follows.

on (release) {

gotoAndStop("TrochoidTxt");

}

This code controls the target of the button, in this case the target is “TrochoidTxt” this is the variable name given to the frame containing the text alternative. The target frame has a variable name so as if the frame has to be moved for any reason the target will stay the same where as if there was just a frame number in place of the variable name then the number would have to change every time frames are added or removed from the timeline.

The 3D and text buttons also have one extra line of code to set a variable. The 2D buttons have to return the user to the frame that they were previously on, and because this frame can be any variable frame between 1 and 90 in some cases the number of the frame must be saved in a variable. To save this when the 3D or Text button is pressed the current frame is saved as a variable and this frame can then be returned to by pressing the 2D button which returns the playhead to the variable frame.

On (release) {

var var2D = this._currentframe - 3;

}

This small piece of code took quite a bit of time to properly format as for a large portion of the trials I was calling the variable 2D, this would create a compiler error as a variable cannot begin with a number. Finding the code for the current frame was also a bit of a challenge as this method is not used that often so references for it were hard to come by and in some references they explained how the variable _currentframe was an unreferenceable variable. Three frames are subtracted as in testing, the code would return back to the variable frame plus three. Subtracting three corrected this error and was suspected to be a simple math error when saving the frame number.

The code behind the 2D button itself was quite simplistic; it just simply had to reference the new variable var2D.

On (release) {

gotoAndStop(var2D);

}

This is just the same code as all the other links but it references the variable number which contains the previous frames number rather then an individual unchangeable number. There is one very unusually error with the code within the 2D button in the projection button.

Upon testing it rather than going back to the 2D version the button moved the playhead to the final ending page which is another scene. After trying numerous methods of correcting this error sending the playhead to the trochoids scene was tried to ensure that the button could work if director to another scene. This code which should direct the playhead to the trochoid scene now directed the scene to the projection scene which was what was desired. Not knowing how this error was occurring but now having the desired result the unusual code was left in place.

6.3 Introduction page

The introduction page was just as the name dictates, just a page to introduce the program and state the options to start off with. The user has the options to start the course from the start or to go to the gallery which will display sections of the program to visit. The page is a basic frame with no navigation buttons that the other frames have. It just states the title of the program and displays the start course and gallery buttons, both buttons have rollovers to add a sense of depth to them when they are pressed. They allow you to navigate to your chosen topic. The images used on this page were all created in Flash and were quite time consuming to make as the letters were quite intricate when the distances were taken into account and all the methods about how to create them taken into account.

The pencil and Set Square were quite straight forward to create as straight lines and appropriate colouring created a large portion of it.

[pic]

6.4 Gallery Page

The Gallery page is a place to choose individual topics and steps; these are displayed graphically as well as through text. This required the creation of a scrolling box as all the topics and visual steps would not fit into one page. The scrolling box became quite a challenge as few demonstrations exist. This is because when creating a scrolling box over ninety percent of the time it is created for text and a text box can easily be created to hold all the content. It could not be a text box in this case though as it would have to hold graphic symbols which would link to another frame.

First all the content had to be created for the gallery, all the text had already been created in the introduction page at the beginning of the course. All the topics and steps thumbnail alternatives had to be created and scaled appropriately for the gallery scroll box. The thumbnails had links encoded within them to connect them to the steps that they are representing. Following is a simple demonstration of the code needed for the gallery links.

On (release) {

_level0.gotoAndStop(‘TrochoidStep1’);

}

This code was very hard to find as _level0 is not within the Flash help directory but was the only way to get this link to work. This was because methods such as _root and _parent were used in attempts to get the links working but were unsuccessful as the timelines were still referenced incorrectly. For the _level0 code to work every frame that was going to be linked had to be given a name that would be referenced in the code. In the example ‘TrochoidStep1’ was created in the Trochoid scene and labelled the frame that step 1 begins in.

Originally there was a sound effect of a page turning over activated when the button was pressed. This became tedious after time if the gallery was accessed many times. This code is still behind the buttons in the topic selection page as this page is used less and the sound will not be overused on that page

Next all of the links created had to be put within a scrolling box as all the items were too much to fit into a single sheet and placing them into two separate pages would be an overlong method of separating the gallery. The scroll-box was not as simple as it was originally thought as some of the simpler methods would not work as it was not scrolling text.

First the original movie clip was made this was simply a white box converted into a Movie clip. In the gallery scene this would be the one item directly accessible for editing. A movie clip has a separate timeline of its own, so when the item is double clicked it reveals the movie clips timeline. This now gives one the option to create a separate movie within the movie clip. Within this timeline the mask, buttons and actions were created. Following is a screenshot of the movie clip timeline.

[pic]

The content layer contains the links and thumbnail links. The actions layer is simply the stop(); action encoded into the frame to prevent the links from scrolling out of control. Control1 and Control2 are the layers containing the buttons which invoke the scrolling action. The code behind the buttons is quite simplistic it just calls the alternate button’s frames.

on (release) {

tellTarget("Content"){

nextFrame()

}

gotoAndStop("down2");

}

This code is behind the up button and means that when the button is rolled-over the target “Content” (This is another movie clip containing all the links and thumbnail) to go to down2. This alternates between the buttons, the up button tells the content to go down and the down button tells the content to go up.

The mask layer is the most important as this hides all but the desired content from being viewed at once. It is a simple white box which becomes a viewing window to the main scene, this means that whatever is within this box will be seen in the main gallery scene and anything outside of this mask will not be scene until scrolled into the mask.

The Move clip containing the links and thumbnails is named content so it can be called by the code for the buttons. This movie clip now has to have some alterations to its own timeline; these alterations will introduce the scrolling action.

[pic]

This is a motion tween. In the first frame the content is placed with the top against the top of the mask, so all that can be seen is the start of the contents. In the second last frame the tween stops so the bottom of the contents is against the bottom of the mask. In the second last frame the tween stops this designates the length and speed of the tween. If the tween was longer then the scrolling action would be slower. The last frame is a simple stop(); action which stops the tween when the contents is scrolled to its end.

The gallery seemed to have adverse effects with the topic selection page. When the gallery was added originally the links were not fully functional as they were within numerous movie clips and this effect transferred to the topic selection page and the links no longer linked to the appropriate page. Because of this the gallery was made into its own independent scene and this solved the topic selection pages problems.

6.5 Topic page

When the user clicks on the start course button they are taken to the topic select screen. This screen allows the user to select where in the course that they would like to start. They are presented with a list off all the topics and their steps. Each step or topic is a link to that step or topic. They also have the option to start the course from the beginning which takes the user to the first step of the first subject. This page gives you complete navigation to the complete course; it also has a home button if you wish to return.

Each link on this page also has a sound attached to it. The sound is a page turning over which adds the effect that the drawing selected is being withdrawn from a large selection of technical drawing solutions.

[pic]

The code used to create this sound is straight forward; it’s placed in an onRelease handler which activates this code when the link is released. First a variable called my_Sound is created and is given the variable attribute of a sound. This is assigned as a new Sound method.

var my_sound:Sound = new Sound();

Next the variable sound is loaded and assigned to a Boolean value success to see if the sound loads successfully. The sound is then started using the start method.

my_sound.onLoad = function(success:Boolean) {

my_sound.start();

};

Finally the Variable my_sound is assigned to a sound file, in this case “paper.mp3”.

my_sound.loadSound("paper.mp3", true);

6.6 Trochoids

A trochoid is the path of a single point on a cylinder as it rotates across the ground. Trochoids are a straight forward subject to teach, their methods never change as the solution can only be applied to a specific type of problem. Basically all that needs to be drawn is a grid of the movement that the cylinder will take and mark out the appropriate points. The grid was very appropriate to be animated in Flash as the lines can be added one by one in a single animation. The topic starts by giving the learner the measurements for their own creation of the drawing and shows how from this drawing the final solution is achieved step by step. Measurements are only needed in the first step as the methods of finding the measurements needed for following steps are explained. In the following steps animations are used to show such steps as separating the circle into segments and creating the grid. These animations are done at a steady pace to ensure the learner can view each line being added to the drawing and how the lines may need to be numbered or labelled. The final solution is displayed using black lines to make it’s viewing clearer through an animation to display first the points needed to create the solution, followed by the solution curve itself. As trochoids were the first topic created it meant that this was where one would have to designate how the animations would flow together. This was a large area of trial and error, to properly determine how many frames should be assigned for each step in an animation.

[pic]

6.7 Revolutions

Revolutions are similar to trochoids in that they are a rotating circle but the revolutions don’t happen across a straight ground line. They occur across an arc like surface, making the final solution much more drawing intensive to find. There are different methods available to find the points on the revolution and I felt that it would be best to convey at the least more than one way of achieving the final solution. In theory, revolutions are quite simplistic; one draws the circle in numerous points of its revolutions and marks the positions of an individual point through this movement.

This topic was split into two separate subjects Hypnocycle (Like a hypnotic disc moving across the circumference of the lower quadrant of a circle) and Epicycle (just as a hypnocycle but across the top quadrant of a circle). These topics are best taught individually as they result with different solutions and teaching both in one lesson could result with confusion. Also different methods of achieving the solution can be shown more clearly. The steps are straight forward; it resembles a grid in the shape of a quadrant of a circle and requires a large amount of compass work. To demonstrate the steps was a matter of breaking down the topic to its individual stages and deciding which would require simple animation and which would require frame by frame individual lines and explanations. Since this topic creates a grid like structure it could demonstrate simple animation, when numerous points or lines are created using the same method. This was used numerous times in this subject. It was used to create the grid and its contents of circles as well as the lines to segment the circles. The final curve and the points needed to create it were also generated using this method.

[pic]

There are some simple animations used in these topics. When the grids are being created each line of the grid is added in sequence as part of a short animation, as the theory of why and how is being explained. The lines being created are simple to create and there theory is more relevant then seeing them being created. As a result the theory explanation remains static as the lines are being added to the screen one at a time. The same method is used for the marking of the final points and the creation of the final curve. The location of the final points becomes clear once all of them have been created; this also gives the user the option to go back to find out how these points were created for full understanding. As with the creation of the final curve, this is more of a formality as with all the points created all that is needed is to see how the curve joining all these points should look.

The practice is achieved in stages and is run at a pace that the learner can see the points or lines being added one after the other. This demonstrates general construction before their eyes to thoroughly explain how the solution is achieved. The final points for the solution as well as the points generated for its construction are displayed in black to further enhance its effectiveness in the learners mind as they will be more eye catching as they are displayed as the darkest lines on the screen.

[pic]

6.8 Asymptote

An asymptote is an hourglass like figure that’s derived from two cylinders of equal height but varying diameters. The topic of asymptotes is quite straightforward to explain and work through. The start of it works through some constructor line which will be used for the construction of the final solution. One of the first lines created is the Asymptote which is the line that will be used to create the shape of the solution this line is a variable set by the height and diameter of the cylinders and will always deriver a similar result from cylinders within a certain threshold as two cylinders of almost equal diameter will not create a proper final solution. The steps are straightforward every line is explained and introduced in series towards the end goal of the curve. There were few places that an animation could be introduced as at first every line had to be explained as to where and why it’s drawn. The only area that an animation could be introduced without causing confusion was when creating the final points. As there are three lines to be created once it is known how to create one line the other two are simple formalities and can be animated as a result. The text alternative has a greater explanation as to why the lines are drawn and as to all the variables in this problem that can occur. The 3D version of this was something that was not of great importance, because the object is cylindrical in its design the shape stays the same as you rotate around the object. The only view of any major advantage is the perspective which shows both the top of the cylinder as well as the hourglass shape to fully show its finished version.

[pic]

6.9 Projection

Projection is easily the most time consuming to draw and requires the most accurate lines and angles to produce the solution. In projection you are given the plan view and end view of an object, as well as the position of a spectator and you must develop the view of this object from this spectator’s perspective. All the lines of the projected perspective will be created by creating two view points and running all points from the plan to an intersection with some angles from the view points. This was very time intensive to get the drawing to a satisfactory level; all lines had to be to scale and at the precise angle as well as introducing the alternate angles for the slopes at the top of the object.

This drawing is quite extensive as it demonstrates just about all the methods one would need in an exam question (although curved surfaces were not explained as they are not asked in exam questions). There was a certain amount of alteration in this drawing to get it to clearly fit into the stage but this has no effect on the methods of teaching the subject and the only effect generated by this is that the final projection is a little shorter then it could be. The drawing could also have been spaced out a little more to properly display how the lines are extended but once again this has no effect on how the method is thought. Although the extent of lines on the page did make the drawing difficult to understand at the finish, this is common with a question like this which has many points and angles to be calculated and extended into the projection.

[pic]

6.10 Solids in Contact

The topic solids in contact uses all the smaller methods that will have been leaned in technical drawing so far, this includes bisecting angles, plan and end views etc. Although in theory this topic is straight forward and logical a simple error can lead to complications and result in an inaccurate drawing so it is advised that this subject be slowly thought to avoid over long explanations and unnecessary complications.

To go through the steps required to create solids in contact didn’t require much animation as the steps have to take place one after the other in sequence with no multiple parallel lines to be drawn or numerous points to be found. The first step simply required a brief explanation of what the topic Solids in Contact means and entails. It showed the learner what you will need to start a question and gave the measurements for them to attempt the question for themselves.

[pic]

6.11 3D Animations

The 3D animations were created through 3D Studio Max; this package allows creation and publishing of 3D animations. Exporting the animations was not as straight forward as I thought it would be, I assumed that 3Ds Max would export its project into a well known format however this was not the case. There are few commercial 3D animation packages and as a result of this it becomes difficult to convert or export your animation to the desired file type. 3Ds Max can only export to one or two moderately well known packages and methods to convert these files or to get the package to export an animation into a well known format are hard to come by. So this posed as a problem that would take some converting and finding compatible programs.

Some promise was found in the company “Electric Rain” they also create multimedia packages and are similar to a company such as Adobe. Electric Rain have approval from macromedia (the creators of Flash) to export their products into flash .flv format. Originally the only method open was to import a 3Ds Max file into electric rains 3D animation package Swift 3D then to publish this imported file in .flv format. This was not as easy as it would have been hoped, the file would first have to be rendered by a compressor not available on the trial version I was using. As a result more research into the area was required.

The company Electric Rain once again came to my aid as they had created a renderer for 3D studio max to convert files into Flash format. Although it was a renderer and I was unsure how to render animations it still showed promise as the final file version was now accessible. The final product of this process was not exactly what I wanted as it converted the working 3Ds Max file into a finished flash .swf file. When the swf file was imported into the flash library, all the individual frames of the original 3Ds max file were imported as bitmap images. When the swf file was brought onto the stage it was basically a window that would slide through all the images at the specified frame rate, giving at first a jerky but a well organised animation.

This was not exactly as I had expected or hoped but there was little choice left as this was the only method available for me to change a 3D file into flash. Originally I wanted the animations to be interactive; the user could move the camera around the objects to give them a better idea of how the topic was implemented. This could no longer be done as the files accepted by flash were limited and could not achieve such interactivity. The best alternative now available to me was to create several 3D animations per topic, one for each of the major vantage points needed to see the creation of the drawing. This does have advantages as it shows the plan and perspective views which are two major views but to be able to move the camera for a topic such as projection would have been fantastic. It would have displayed how the drawing comes about very easily as the user would have had a set perspective for the drawing but would have been able to move the camera to other views such as plan and end view to see what projection truly is.

A control button was also added to this page to pause the animation if desired. This button is graphically the same as the previous pause/play button but the code behind it dose differ. The 3D animations are published swf files and once imported into the library could simply be dragged onto the stage as a finished animation. This means that simple timeline controls would not work as you would have to direct the code to the animation in question. This required one extra simple line of code tellTarget, which tells the target animation the control that you wish to be executed.

The method used to control the switch between the pause and play was more complex then first expected but still runs to good effect. A variable calling the state of the play-head in the timeline is first declared.

tellTarget('Trochoid Perspective')

_root.pause = true;

This tells the target Trochoid Perspective that its root timeline status is paused. Its paused status is what needs to be changed to toggle the value of the timeline and play-head into and out of paused mode. The code below is the key to switching between the two states. It changes the current state of pause to its alternate state, so it would change true to false and vice versa.

on (release) {

_root.pause = !_root.pause;

The code below simply states what should be done when the play-head is in either state. If the paused status is false it stops the animations using the tellTarget method.

if (_root.pause == false) {

tellTarget('Trochoid Perspective')

stop();

tellTarget('Trochoid Front')

stop();

If the play-head is in any other state then the animation plays again.

} else {

tellTarget('Trochoid Perspective')

play();

tellTarget('Trochoid Front')

play();

}

}

Very similar code was added to the 2D pause/play button; the only difference between the code is that the 2D button did not need to have the tellTarget code as the target was the main root timeline.

6.12 Text Alternative / Content Management

This stage was more intensive on the descriptions of the diagrams as you had to further instruct how the solution is obtained. This was done by sectioning the entire content into steps and creating a clear explanation of what is happening. This became complicated at times as this is a graphic subject so the text alternative could only further explain the diagrams and their solutions. To have a clear concise and easily interpretable text alternative to the drawings would be impossible as one would have to describe a sheet full of lines, where they overlap, angles, dimensions etc. A picture really is worth a thousand words in this subject and explaining how measurements and angles were obtained will make its explanation and interoperation clearer to the learner. The alternatives do give clearer instruction to the learner as to how the lines are obtained and used in the construction of the final solution but still rely on the 2D drawings for complete understanding of the subject.

The already existing text in the content was copied into the text alternative but further details were added to give a greater explanation as to what is being demonstrated. Projection became the most extensive of the explanations and required a full four pages of text to completely explain the lines as well as why and how they are being created.

6.13 Final Page

This page was quite simplistic as all it was needed for is to inform the user that they have reached the end of the product. This page gives the user three options, return to the home page, use the first hyperlink () or to go to the second hyperlink (skoool.ie). The home button used was similar to the button used in the home page in its implementation and style. The two hyperlinks were trickier to implement than first considered. Originally it was taught that an external link would be quite simple to invoke but the link was quite intricate, the text would have to be converted into a button and on (release) code would have to designate how the link would work. The code was quite simplistic.

getURL(“”, “_blank”, “GET”);

GetURL is a flash method for creating hyperlinks; the first argument passed is the address of the link requested. The second argument is stating how this link should be invoked (in this case a new blank explorer page) there are three possible arguments that can be entered here relating to the screen and its content in relation to the screen the link is on. The other arguments are “_top” and “-parent”, top replaces the content of the frameset window and parent replaces the current content with that of the link. The final argument states the method of communication used in this hyperlink. There are only two possible methods of link communication “GET” or “POST”. The differences between these methods are simply security and privacy. Get is used as there is no need for security or privacy as it is simply a webpage, post would be used if it concerned passwords or private information.

After numerous attempts of getting these buttons to link to the appropriate pages with no avail a different approach was taken. Instead of writing the code behind these buttons the text was recreated. This text was now changed to dynamic text and in its properties the appropriate link was attached. Although the code version would have been preferred for more control, the getURL command searched the C drive rather then opening a link to the internet.

6.14 Finishing Touches

The finishing touches were just a simple matter of going over all the drawings and making sure the lines meet at right angles and perspective’s etc. As the subject being taught is mathematical, this required a good extent of accuracy and precision with the finishing touches. Ensuring that all the lines are their correct colours; that curves were made as smoothly as possible and that the rollovers worked correctly. Also that all links were linking to the indicated frame or scene. This was very time consuming with a subject such as this. Every line had to be in the correct proportion, angle and in some cases colour.

This also was when drawings were given their final look over and this involved going over each topic to ensure that all lines were correctly orientated. Some intersecting lines and precise work did need to be a little more accurate and were adjusted accordingly.

Two of the links in the start course screen were also inappropriately labelled so both of them had to be recreated to describe the step it links to more clearly. All the links in this page were also checked to ensure that they were functioning properly and linking to the appropriate scene and frame.

Alignment and size of text boxes was a very time consuming part of this step. All button had to be consistent, moving from one page to another all the buttons had to remain in the same position. If new buttons were being added to the page they would replace an unneeded button so as to retain consistency in the pages layout. Applying the text to a consistent size was also a major issue as text could not jump around the screen. It would have to stay in the same grid and stay within the same width to promote consistency.

Chapter 7

Analysis

7.1 Products

The products used for this project were quite effective, Flash was quite straight forward to become accustomed to and although 3D Studio Max was more complex the animations that were needed just used the basics of animation. Flash was the easier of the two to become accustomed with as it was more intuitive in design and nature. 3D Studio Max was far more complicated to understand as there are numerous buttons that are not very intuitive or well labelled.

There were some inconsistencies in Flash’s action-scripting guide. There was a pause method on file in this guide which was originally used in the product. This method did not work though, as numerous attempts to get it to work failed. The method was explained to be a simple toggle between the play(); and stop(); states but refused to work when properly encoded. The error with the 2D button in projection also became a mystery as to how it worked.

Other problems that occurred within action-script were simple variable setting which had to be within event handlers, naming variables and references to them. These errors although preventing the code from performing properly gave errors that the Flash Help guide did not show in its demonstration of the code.

Although the use of 3D Studio Max did make the creation of the 3D animations relatively straight forward, it was worrying how few common file types it could export a project into, as well as how difficult it was to find an application to render images into a useable format. At times it also offered too many variables. This became confusing at times as some of the properties that were expected to be default were unchecked or set to null. The products were very good when adequate experience with them was obtained, although the exporting time for flash became well within the three minutes due to the 3D swf files.

7.2 Final Thoughts

I am moderately happy with the resulting product. There are certain aspects that I would have preferred in this project. Interactive 3D animations would have been very good, in that the camera would be able to move in the 3D animations but this would not be applicable in Flash as it only accepts Flash files or published flash files (.swf). This would have given the user very good understanding of topics such as projection. I would have liked to create the main Flash animation in Java script as this is a new feature and it would offer the option of greater control of the code being created but time constraints prevented me from being able to do this.

After numerous tests of the product there seems to be an error with the 2D button. Currently it seems to be going to the frame one or two frames after the frame that is saved as var2D. The reason for this I can’t seem to understand, it should save the frame the playhead is currently on. This could be due to a simple math rounding error, but this is unlikely. This is why three is subtracted when var2D is saved. Some of the errors seemed to be completely unique and quite hard to find solutions to. Such as a button within a tween, which any good explanation was hard to find.

I would also have liked to have become better able to use 3D studio max, as the animations created were quite straight forward. Although the animations created will suffice for the final product I would have liked to become better experienced with 3D Studio Max so as to create more complex animations.

References

Author Year Citied Publisher

|Berg, Gary |2002 |The Knowledge Medium |Information Science Publishing |

|Boyle, Tom |1997 |Design for Multimedia Learning |Prentice Hall |

|Darbyshire, Paul |2004 |Instructional Technologies: Cognitive Aspects of |IRM Press |

| | |Online Learning | |

|Hodges and Sasnett |1993 |Multimedia computing: / case studies from MIT Project|Addison-Wesley Longman |

| | | |Publishing Co |

|Howe, Michael |2003 |Psychology of Learning |Blackwell Publishers |

|Moore, D |2001 |Position statement of the International Reading | (accessed |

| | |Association |January 2007) |

|Newbie, Timothy |2004 |Educational Technology for Teaching and Learning | |

|Pilling, Jayne |1997 |A Reader in Animation Studies |Indiana University Press |

|Roblyer, M D |2000 |Integrating Educational Technology into Teaching |Pearson |

|Salmon, Gilly |2002 |E-tivities: Key to active online Learning |RoutledgeFalmer |

Appendix A Flash 8

The Stage

The stage is where most of the work in flash 8 will be done. This appears as a blank page in the centre of the stage, this is where you will be creating all your content. Your characters backgrounds and buttons will be created in this area unless you import them. The stage appears as a blank page of white paper on a grey background. The white sheet is your stage this is going to be the final size of your product screen. This means that if you have a character in the grey part of the screen they won’t be seen in the final product until they set foot into the white sheet area.

[pic]

To control the properties of the stage the properties box is available underneath the stage. Here one can control the frame rate of your product, by default set at twelve frames per second (this is the standard frame rate for internet animations) although you can set it to whatever rate you want. Anything under ten and your animation will seem to be moving in slow motion but anything over twenty and it will seem to be moving too fast. You can control the size of your stage in whatever measurement system you desire. You can choose the colour of your background as well as the publishing settings you want for your product from the properties section as well.

The Toolbox

The toolbox that you have available to you in flash is a little complicated the first time you set eyes on it but all it takes is practice and you’ll be creating colourful characters in no time. The first ones you should learn are the colours you wish to select, there are two colours that you have, the fill and the stroke. If you were drawing a circle the stroke colour would be the colour of the line creating the circle and the fill colour would be the colour of the inside of the circle.

Every tool selected has an appropriate options menu at the bottom of the tool bar as you select the appropriate tool, the options for this tool become available for you to select. There are the two selection arrows, the black one and the white one. The black arrow is used for selection, with this you can select the fill or stroke of a shape by double clicking on it. You can also select a specific area with this tool by selecting an area with the black arrow in the same way you would select multiple objects in windows explorer.

You can also change the sharpness or curvature of a line with this tool. The white arrow is used to move fill or stroke, this is the sub selection tool.

There is the free transform tool this allows you to modify the length and breath of your shapes this can also allow you to change the scale of your shape. Next is the gradient transform tool, this allows a regular shape to appear to be more 3D. Like a red circle when you add gradient to it, it becomes more spherical as the gradient shows shadow on one side of the ball. Some tools are pretty intuitive when you first see them; the line tool is just represented by a straight line and is used to create straight lines in the stroke colour.

The lasso is another selection tool this allows you to create your own selection area; you draw a line around the area that you wish to select as if you were lassoing it. There’s the pen tool that can be used to draw straight lines from the points you select with it. There’s the letter ‘A’ which is your text tool giving you the ability to put text onto your stage. There are the shape selection tools for drawing the basic shapes. Two of the most important tools are next they are the paintbrush and the pencil tools, these are the most used tools that will be used for freehand drawing. When these are chosen you have numerous options, for the paintbrush you have the choice of the type of head that you wish to use as well as the size of the size of that head.

With the pencil you only get choice of what type of lines you wish to draw, curved or cornered. You have this choice to make the freehand drawings you make more cartoonists, which is useful as it is hard to create good crisp lines from freehand. There is the dropper tool this is the tool in the shape of the eyedropper, this is used to select a colour from the stage and have it as your line or fill colour. There is the paint bucket tool used to fill an area selected with the fill colour you have selected.

There’s the ink tool used to fill the selected area with the stroke colour you have selected. The last creation tool in the tool box is the eraser. At first word of this you would think that this is simply a way of erasing what you have created, but the eraser is a remarkably useful property when used with the options menu. The option menu gives you the options to erase just the fill colour or the stroke colour or all contents of the stage.

The viewing tools are just below the creative and selection tools in the toolbox. There are two viewing tools, the magnifying glass and the hand viewing tool. The hand tool allows you to move the stage to whatever position you wish, you simply grab the stage with the tool and move it to wherever you wish. With the magnifying glass you simply click on the area you want to increase in size, or select an area that you want to fill the entire screen.

The Timeline

The time line is your most important resource available to you, this is located on top of the main stage and this is where you see what frame you are currently working on. This is where you insert your frames you then enter your content into the frames, as the content changes from frame to frame you can create movement in you characters and bring them to life. It is most vital to know what frame that you are currently stopped on as if you are on an incorrect frame you could cause actions to happen out of step with the rest of your animation.

You will know what frame you are stopped on by watching the play-head; this is the red line coming down through all the frames. It has a red box at its top to show which frame it’s located at. When your project is playing you will see the playhead move through every frame at the speed you designate for the project. This shows how animation is a frame by frame process.

[pic]

The timeline also has the ability to have as many layers as needed; the best description of the layers would be given in a character and a background. The character will have their own individual layer which will be located above the backgrounds layer. This means that the character will always be shown on top of the background. The layer position describes its priority, if it is the lowest layer then all the other layers will be placed on top of it in order, and then the background will be covered up by all the contents of the other layers. If a layer is high in priority (one of the higher layers) this means the contents of this layer will be seen above every layer with lower priority. Higher layers are usually characters that you want to see in front of backgrounds and objects.

You have to be careful at times to ensure that you are working on the right layer, you will know what layer you are working on as a pensile icon will appear in this layer. You can also lock and hide layers. This ability can be useful at times as sometimes you might have object paths and other technical information displayed on a layer but you won’t want this layer to appear in your final animation so you can just hide this layer by clicking under the eye icon in the desired layer, blocking this layer from view. If a layer is hidden an x icon will appear under the eye in this layer. Layers can also be locked to prevent you from accidentally changing it this is best done to backgrounds as they rarely have any changes made after being made. This works in the same way as the hiding feature but has a padlock symbol instead of an eye.

Scene’s are a very useful part of flash, scenes allow you to have an entirely new timeline for another section of your project. But you can still transfer from scene to scene with ease making the integration seamless. This is an incredibly useful feature if you have created a much filled timeline; it can be hard to distinguish between the individual frames in a crowed timeline so it can be useful to have the ability to create a new timeline to make it easier to distinguish between the frames.

Convert to symbol

Convert to symbol is a process used in flash to make graphic images more interactive. You can convert images you have created into one of three separate forms, a movie clip, a Button or a Graphic symbol. A movie clip means that you can perform motion tweening (a simple method of moving a character on the screen) as the image is now given its own individual timeline embedded within the root timeline. If you change it to a button you can add the code to make the button do a required task, such as stop the motion, cause a sound, all general button actions. A button is given a timeline with only four frames; each frame is activated if a different action is evoked by the button. A frame is given to its original inactive state, if the button is rolled over, when the button is being pressed and finally if the button has been pressed previously.

[pic]

Appendix B 3D Studio Max swf Renderer

To create a file acceptable for flash in 3Ds Max a special renderer had to be imported into 3Ds Max. This renderer was far from easy to find as with the application the researcher was looking for an exporter to create a finished animation, however this was not what was needed. With animations in this package you do not have to export a file to create the final product. Rendering is the process that was overlooked as this creates the product in a format without exporting it but rather using the current data to create a file using the current information in the file.

The default render in this platform was not adequate for the files one wished to create so a new one was found that would render to the desired format. The renderer found for this task was created by a company called “Electric Rain”. This company also produce 3D Studio Max and had received permission from the macromedia company (producers of Flash) to create a renderer that can create file types used by macromedia products.

The renderer was quite simple to install, files had to be added to the renderer file in 3Ds Max’s files directory. There was also a simple instillation program which just set the variables for the renderer such as its location on the C drive.

Below is a screenshot of the renenderer in 3d Studio Max. The renenderer converts the images from the workspace into an image file acceptable by swf files. The result is a single frame of the animation converted into a single image or a series of frames converting into numerous images which will be played in sequence to form an animation in the swf file. The swift renenderer gives the user options of how they would like aspects of there rendered files to become. As shown in the screenshot you are given options towards the fill and edge options as well as the curve options. These options allow the animation or still to be given a more hand drawn or ink created approach. This is the type of type of animation that suites flash as most animations in flash are created through its own toolkit and have an ink or hand drawn approach.

[pic]

There is also some other options attached to the bottom of this window but these options are common to all renderers. This screenshot displays these options which are just aimed towards the specific details of your work. Which includes which view port is requested to be rendered. If there is a specific preset saved with all the appropriate details. The option of activating production or active shade is simply a user preference and results with just some minor differences in the final render. The render button is then pressed to create the final animation or image.

[pic]

Appendix C 3D Studio Max

3D studio Max is a 3 dimensional animation package used to create three dimensional characters, environments and animations. Some of its basic features will be discussed in this appendix. For the animations needed for the final product only three topics needed actual movement, the other three did not need movement so a simple 3D image shown from multiple angles as this is the best alternative due to the fact that the rendered image’s will have a static camera.

3D studio max has four separate stages all giving a different perspective of the main stage to allow for better control. The views are front, top, left and perspective.

[pic]

The appropriate x, y and z axes are labelled in the respective view. The view currently in use is surrounded by a yellow square; in this case it is the perspective. There are numerous tools surrounding these views. To the right of the views is the creation toolbar, this is a toolbar specifically aimed at the creation of shapes and objects in the views. This ranges from 2D and 3D shapes to cameras as well as tools to manipulate their shape position in space and view given by the camera. Lighting and display as well as the help tools are found in this toolbar.

To the left of the stages is a list of preset objects that can be dragged onto the stage. These items can range from bipeds, toy cars or even moving objects like motors, wind or water.

[pic]

At the bottom of the screen is the timeline for the animation being created. As with this there are all the appropriate tools for manipulating the timeline. These are methods to insert and setting the key frames. The play, stop , skip forward and back buttons are also located here to monitor the creation of your animation to ensure you are creating smooth realistic movement. To the right of this toolbar are the viewing tools. These tools are used to manipulate the views in the four views. This can be moving the camera to an appropriate position moving the contents of a view to a particular spot etc.

[pic]

Finally the toolbar at the top of the view ports is a general toolbar for the program. This includes the selection tool, the movement selection tool, numerous different snap methods, material editors and general shortcuts including undo and redo buttons.

For the animations being created in the final product the methods of creation being used were quite simple. For the movement of the cylinders it was simple key-frame animation. This means that the cylinder was moved into a new position every two to three frames. The animation has a total of forty frames, by frame twenty it was half way on its path, and every two or three frames it moves an appropriate distance and direction. This was used in both the epicycle and hypnocycle animations. In the trochoid animation the cylinder moved in a straight line so only the start and end points need to be defined.

The addition of the points for the creation of the final solution was also key frame animation. Each circle is created in a new key-frame. The key frame is being created in the same order as the points.

The static images were created in 3D studio max and then rendered and added as an image to the Flash version. The solids in contact question was quite simple to create as spheres are quite a common object to be created in 3D studio and can simply be dragged onto the stage. All that had to be set was their position and size. The lines and text were quite confusing when first added. Originally they were simply added to the stage in the same manner as the other objects but when rendered the text and lines would not appear. This was because lines and text have a separate options list to that of 3D objects and shapes. There is an option as to whether or not the objects should be rendered, as well as its fill type and exterior line type.

This became an occurrence purely with 2D objects as 3D objects are rendered by default. For the creation of the Asymptote and the object for the projection question, default 3D objects could not be used so new objects would have to be created using the tools at hand. The projection object was quite straight forward as all that has to be made is several rectangles with corners cut off. The base was simply a rectangle and all the extruding shapes were initially rectangles. The reshape tool was used to manipulate the rectangles into their new shape. This tool allowed the user to drag the corners of the rectangle into a new position.

The final topic to be created was the asymptote this didn’t need an animation so all that would be needed is the 3D version of the final solution. This was quite awkward to create as none of the 3D objects could be used to create it due to its unusual shape. What had to be created was an hourglass figure and this would be created through the lathe feature of the toolbox. First the line that is going to be spun to create the shape would have to be drawn. This shape would have to be carefully taught through as this shape would be spun around as if it were on a woodturning lathe to create the appropriate shape. After numerous attempts the final line was found this line was like the middle section of an s or the shape below.

[pic]

When this shape is rotated through its centre it becomes an hourglass shape all that had to be added is two circles to cover the top and bottom of the shape. This was the same as any 2D shape in this package and had to have numerous values checked before it would appear in the rendering window.

Glossary

Key frame – A frame in animation in which a particular action or section of an action occurs.

Prerequisites - A prerequisite is an ability that the user should have before attempting to start the E-Learning application they have in mind.

(For example if there was someone wanting to learn geometry through an E-Learning application they would have to have a good maths background and be able to understand all the basics of shapes and angles as well as have all the general maths such as multiplication and division. These would be the prerequisites of the application as without these the user would find the course very hard as they wouldn’t understand certain topics as they arise.)

In-Betweener – An animator who creates the movements between the key frames.

Perspective – a view in 3D Studio Max, at default looking down at a forty five degree angle at the object.

-----------------------

B.Sc. In Computing with Multimedia Year 4

Abstract

Computing Project 2006/2007

Name: Colin D O Brien

Title: Technical Drawing E-learning through Animation

Supervisor: Helen Fitzgerald

Abstract:

The focus of this project is to create an effective e-learning animation product to help Leaving Certificate students to learn and revise the subject of Technical Drawing. This would be quite a useful tool as bookshops do not sell any books that deal with this subject; this means that students would only have their previous drawings as a reference. This makes some elements hard to reference and revise without the proper notes.

Animation was chosen as a delivery medium as it is a powerful and effective communication tool. The 2D drawings are standard in an exam situation. In this product there is also a 3D version available to clarify how drawings are created. A text alternative is also available for the user to read more in depth as to why such calculations are made and why certain lines are drawn.

Projection Text

Projection 3D

Solids in Contact Text

Solids in Contact 3D

Epicycle Text

Epicycle 3D

Hypnocycle Text

Hypnocycle 3D

Asymptote Text

Asymptote Text

Trochoid Text

3D Trochoid

Individual Steps

Individual Steps

Individual Steps

Individual Steps

Individual Steps

Individual Steps

Projection

Solids in Contact

Epicycle

Hypnocycle

Asymptote

Trochoids

Topic Selection

Gallery

Homepage

Final Page

................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download