Effective Use of Animation in Multimedia: A Comprehensive Guide for Web Design Students
Learn how to effectively integrate animation into multimedia projects for web design. Understand the importance, types, and tools for creating engaging animations.
File
Multimedia Element - Animation
Added on 09/30/2024
Speakers
add Add new speaker

Speaker 1: So I have already informed them in the whatsapp group But should you have another whatsapp group that does not include me or any of the lecturers perhaps? You can you know remind your friends to join I think Okay, because this is still a class yeah, okay, and the attendance is only Half of the class yeah, so hopefully that they can join I have already informed about this since yesterday Okay, so hopefully they can join here, so please, all right, okay, all right, Sulaiman, you may want to off your mic for a moment, all right, thank you, however, throughout my um I mean uh when I explain on the topic if you have a question just shoot in the chat box and later I will if the once in a while or I'll just finish uh the lesson until the end and I'll just go around with the questions that you have posted and try to you know or if you don't have questions or you want to ask or seek further clarification you know or you have things to to ask about your follow-up activity and whatnot, do let me know, yeah? OK. OK, if you are unable to see the slide, do let me know, yeah? OK, so this week, we'll be looking at animation. I think last week, I hope that you have gone through my lecture on video and sound. So basically, animation is part of the video and sound as well, where we have animations, or we include animation in our so-called video, yeah? All right, OK, this is the outline, all right? I'm not going to read one by one. Let us look at the introduction of animations, yeah? Now, a simulation of movement created by displaying a series of pictures or frames, OK? So entertainment multimedia titles in general and children's titles specifically, they rely heavily on animation. So when we talk about animation, I think most of us know that animated video works best for kids or children, even schoolchildren, even teens, teenagers, and so on. However, we must also be reminded that sometimes adults also prefer or may have tendency towards animation. So it is best to include all the elements when you are designing your website, because that helps you to transfer or to disseminate information effectively. So not necessarily that, because sometimes when you use animation throughout, then it will bore some of these adults down here. But when your website is off animation, that means there's no animation in it, then sometimes it can be quite dull and dry. So you need to work together with your friends in order for you to just hold on, yeah? OK, when you work together with your group members, you may need to discuss together and decide on which part in the so-called website that you may want to include animation, on which part that you may want to use video, or on which part that you may just want to stick with images or maybe narrations, and so on and so forth, yeah? So animations are useful in multimedia in the areas of entertainment, education, and training. In fact, I guess there was this one study that I read before. Even for training purposes, most of the training agencies or companies that provide trainings, they prefer to use animation as their attention getter or attention grabber to the audience or their so-called trainees. So you may also want to look in a sense of a research. Maybe some people may have conducted recent research on what is the best element to be included. Also later, when I explain about your project or web design project, you will realize you may also need to conduct a small-scale, what I call this a small-scale research or needs of analysis. Sometimes you may want to ask your audience or your potential audience or your potential viewers of your website what they really need to know or what they really want to be included in the website. And also to ask the same question to the owners of the website. Since you are the developers, so you don't own the website, you're doing a favor to a person, or you're doing a work or a job to a group of people or to a person. So you may also want to ask that group of people. Sometimes, if a website belongs to a company, certain companies, they prefer to hear the sees of their employees or people of that company, what they think to be included in the website. So this is when you need to include a small-scale study. I call it needs of analysis study for you to get more information, what to be included. And not necessarily that you have to use everything that is given by these people. So a good website is, I mean, in a sense of saying this, a good website is developed based on what is needed by the owners of the website together with what you think, as developers, what you think that best fit for the website. So it's a combination of both. You cannot always listen to what they want, because they can just simply say what they want, but not necessarily that is basically the best thing to do or the best thing to display on a website. Because you, as the experts, you also have with you your knowledge and experience based on also some readings that you have done. You know what is the best for a website. So we need to integrate of these two, yeah? Bear that in mind when you are designing a website. So coming back to animation, they can be used to create simplified illustrations of a simulation or dramatization. They can be much easier to understand because they are less complex than video, all right? So it allows for real world to process, sorry, processes to be modeled, enriching graphical representations, attracting attention, visual interest. Some videos, the images that you put in the videos can be static. So that is why when people, although it's a video, but because of the images are static, that means they are at one point and they don't move. Sometimes some people, this is where animation comes in handy. So when you have animation to replace these aesthetic images, it helps people to understand better. And also, just now earlier, I mentioned images every once in a while I have to accept. So that is why it is very, very important for you to join on time so that I won't be having to accept this. All right. I hope. Kalau ada pun lepas ni, just have to wait, yeah? Because this thing is recorded, so. OK, coming back to this one. Earlier just now, I mentioned that certain companies, although this is the use of animation is actually good to gain the attention of the website readers or viewers. It's like in your introduction, you put something like a form of animation so that when people watch, oh, this is interesting, this is nice, so you have gained their attention. And on top of that, animation can also be used to retain their attention, first to get and next to retain. So sometimes when you want to explain on something, so when you have moving animations or moving images in the form of characters, so on and so forth, it makes people to understand better. It's like watching a cartoon, for example. And nowadays, even if you go to certain length, you will notice that animations has gone beyond then just having like a cartoon strip. You can even have cartoons that look like normal human beings, like human-like cartoon, I think a lot of cartoons. But of course, that one itself requires a program for you to join. For the purpose of this designing a website, your knowledge is not to actually learn on how to create animation from scratch, because this is not part of the syllabus, where you need to create cartoons or animation from scratch using basic platforms. But what you'll be learning is more on how to actually utilize available online tools that can actually assist you to come up with animated video. I think by now, you should be already familiar with websites like PowerPoint, and then there's another one, animations or something, if I'm not mistaken. And I'm pretty sure there's a lot of websites available online, as well as mobile apps that can actually assist you. And I may want to also remind you that these websites, sometimes when you want to use, you may need to create an account. And sometimes, they will just give you the trial version. When you create a video, if I'm not mistaken, for Powtoon, you'll be given with limited characters. And also, there will be watermark. And the duration of the video will not be really that long. The other one is animated something-something. You can create, but you are unable to download the video. So there are a few restrictions. And undeniably, yes, that is the, how should I say, the downside of this available ready-made template animated websites or tools. So there are also some other ways that you can actually explore in order for you to create animated video for free. Later, I'll share with you a video done by this person who actually created an animated video using PowerPoint. Surprisingly, we can actually use PowerPoint in order for us to create an animated video, OK? As I mentioned to you just now, attracting attention and visual interest. So there are two types, 2D animation, 3D animation, OK? So 2D animations, two-dimensional 2D animation software, adds movement and action to static images. So these programs use either vector-drawn or bitmap images as objects. The motion of animation is perceived by the viewer from a series of frames. And then from the motion to appear smooth, a minimum of 15 frames per second is generally required. So 2D animation methods like cell animation, path animation. Now, this is just general knowledge. As you know, we don't have final exams. You will not be tested on the theoretical part of this. This is just for you to understand. But even up until now, if you don't understand, it's OK. Because when we assess your final projects, we don't see whether or not you use 2D or 3D. No. What we see is whether you include animations in your web design or not. That's all. If you have included animated, we'll just look at the purpose of this animated video or this animation, whether it is effective, whether it is developed well, so on and so forth. And cell animation is based on a series of frames or cells in which the object is redrawn in each consecutive cell to depict motion. And then cell comes from the word celluloid, a transparent sheet material, which was first used to draw the images and place them on a stationary background. I guess since the invention of animation or the emergence of animation in 40s, 30s, when they started to create cartoons, they used this kind of method in order for them to create the movement, you know? So basically, this is cell animation. Path animation is the simplest form of animation and the easiest to learn. It moves an object along a predetermined path on the screen. The path could be a straight line, or it could include any number of curves. So often, the object does not change, although it might be resized or reshaped, like the ball, from one point to another. And yes, you can even use this on PowerPoint, where you can actually move an item or an image. And as it gets to another point, the item becomes bigger, larger, or smaller. Yes, you can utilize the animation panel that is available on PowerPoint. But the one that I'll be sharing you later is just something that is simple. And sometimes, when I share this, even with my colleagues, the reason why we use PowerPoint or PowerPoint, Microsoft PowerPoint, to create animated video, because number one, you are very familiar with the techniques, with all the buttons available in PowerPoint. So it'll be much easier for you to adapt and to learn. Whenever you watch tutorial videos, it'll be easier because you already know where to go, where to find the Animation tab, so on and so forth. And also, since they have the ability to produce animated video and you are familiar with it, this combo is basically good in order for you to come up with a good animated video. So that is why the focus of today's lesson later, I'll be sharing with you on how to use PowerPoint for you to create your own. But then again, I'm not going to make it too rigid to a point that you have to use PowerPoint, like not necessarily. And I'm pretty sure that you are also familiar with other Web 2.0 tools or online tools that are available to create animated videos. And you are free to use them. So I'm not going to restrict your creativity and also your resources. So you can actually outsource or you can actually not outsource. you can actually go beyond then using PowerPoint in order for you to create your animated videos. But all I'm seeing here is why it is because given the circumstance now with the internet connection issue, with the laptop issue, so on and so forth, I guess using PowerPoint is the best or perhaps the best alternative to create also in creating animated video. So we come back to this path animation. So 3D animation, creating 3D animation is considerably more complex than 2D, of course. It involves two steps, modeling and rendering. So modeling is the process of developing a mathematical wireframe representation of any three-dimensional object. The product is called a 3D model, and models may be created automatically or manually. So this is the model. Rendering is the 3D computer graphics process of automatically converting 3D wireframe models into 2D image with 3D photorealistic effects on a computer. So rendering may take from seconds to days for a single image or frame. All right. OK. So animation file formats can be in a form of graphic interchange format. I look up on how to pronounce the word jif. Some of us, because there was an argument about this on the Big Bang Theory, the TV series, the sitcom. So some of the characters in the TV series argued whether to pronounce it as jif or gif. So they went around and asked. Some people say that because grafik is ge, so we pronounce it as gif. But a lot of people pronounce this as jif, as je. So when I look up on the dictionary, both pronunciations are accepted because this is a new terminology in technology. We also have Flash FLA project file format. And even to use Flash is interesting. I've tried this before when I was at your age during my degree program. Instead of using PowerPoint, whenever we have or I had presentations, I used Flash. And it's very interesting. I once created this platform. It's like a platform. I call it Enchanted Jungle, where there will be like stardust and butterflies coming out the moment you move your cursor. And then something else will pop out. And then that will be my presentation. So the basic form is an enchanted forest or jungle. But inside, I can change. So there was this one time I used this one semester because I learned this from my friend, from a Mastcom friend of mine. He taught me how to use Flash. And it's very interesting. But of course, it requires a lot of work. If you want animation, yes, I have to admit, it requires a lot of work. This, sometimes you don't sleep, that happens. So that is why when it comes to your web design, it is a group work. And also, what best is to have everyone to work on the same thing. But then again, sometimes you just have to study smart as well. And that is to assign every multimedia element to the experts in the group. So if, let's say, you have someone who is really good with animation, then ask that person to do animation. But not to say that you don't help this person. Of course, you do. Maybe in finding materials, or in choosing the right graphics, or in coming up with the storyline, so on and so forth. But when it comes to doing the animation, perhaps that person can do it. And likewise, you can also apply the same thing for other elements, like images, videos, sound, so on and so forth. So multi-image network graphics, MNG, Flash, of course. OK, note the difference between animation and video. Video takes continuous motion and breaks it up into discrete frames. Animation starts with independent pictures and puts them together to form the illusion of continuous motion. So lab exercise, you'll be creating a one-minute animation. So this is the end of today's lecture. Before anything, I just need to stop the recording.

ai AI Insights
Summary

Generate a brief summary highlighting the main points of the transcript.

Generate
Title

Generate a concise and relevant title for the transcript based on the main themes and content discussed.

Generate
Keywords

Identify and highlight the key words or phrases most relevant to the content of the transcript.

Generate
Enter your query
Sentiments

Analyze the emotional tone of the transcript to determine whether the sentiment is positive, negative, or neutral.

Generate
Quizzes

Create interactive quizzes based on the content of the transcript to test comprehension or engage users.

Generate
{{ secondsToHumanTime(time) }}
Back
Forward
{{ Math.round(speed * 100) / 100 }}x
{{ secondsToHumanTime(duration) }}
close
New speaker
Add speaker
close
Edit speaker
Save changes
close
Share Transcript