0% found this document useful (0 votes)
807 views

Ccs352-Multimedia and Animation Lab Manual

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
807 views

Ccs352-Multimedia and Animation Lab Manual

Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 50

TAMILNADU COLLEGE OF ENGINEERING

Accredited with Grade ‘A’ By NAAC


Karumathampatti, Coimbatore -641659

LABORATORY RECORD

NAME .........................................................................................
CLASS III – AI & DS
BRANCH ARIFICIAL INTELLIGENCE AND DATA SCIENCE
SUBJECT CCS352 – MULTIMEDIA AND ANIMATION LABORATORY

UNIVERSITY REGISTER NO: ROLL NO:

This is to certify that this is a bonafide record of work done by the above student for the
CCS352 – MULTIMEDIA AND ANIMATION LABORATORY during the academic year
2024-2025 /05th semester.

LAB IN–CHARGE HEAD OF DEPARTMENT

Submitted for the Anna university practical examination held on

INTERNAL EXAMINER EXTERNAL EXAMINER


lOMoARcPSD|439 767 71

EX. DATE NAME OF THE PAGE MARKS SIGNATURE


NO EXPERIMENT NO
Use Different Selection
And Transform Tool To
1(a)
Modify Or Improve An
Image
Create Logos And Banners
1(b) For Home Pages Of
Websites
Working With Audio
Editing Tool Audacity For
2(a) Sound Mixing And Special
Effects Like Fade In Or
Fade Out
Working With Audio
Editing Tool Audacity To
2(b) Perform Audio
Compression By Choosing
A Proper Codec
Working With Video
Editing Tool Open Shot To
Edit And Mix Video
3(a)
Content, Remove Noise,
Create Special Effectsadd
Captions
Working With Video
Editing Tool Open Shot To
3(b) Compress And Convert
Video File Format To
Other Popular Formats
Working With Web And
Mobile Authoring Tool
Word Press To
4(a)
Design Simple Homepage
With Banners, Logos,
Tables And Quick Links.
Working With Web And
4(b) Mobile Authoring Tool
Wordpress To Provide A
lOMoARcPSD|439 767 71

Search Interface And


Simple Navigation From
The Home Pages Of The
Websites
Perform A Simple 2D
5(a)
Animation With Sprites
Perform Simple 3d
5(b) Animation With Key
Frames, Kinematics
Working With E-Learning
Authoring Tool Edapp To
Demonstrate Screen
6
Recording And Further
Editing For E-Learning
Content
lOMoARcPSD|439 767 71

Ex. No 1.a USE DIFFERENT SELECTION AND TRANSFORM TOOL


Date: TO MODIFY OR IMPROVE AN IMAGE.

Aim:
To use different selection and transform tool to modify or improve the
image using InkScape Software.

Procedure:
1. Go to the browser and paste the link
https://inkscape.org/release/inkscape-
1.3/
2. Download the Inkscape software based on your OS.
3. Don’t use app image if you are using Linux or Debian based OS, use
app instead.
4. Once you install the software, it shows the below image as a welcome
screen.

Working with InkScape:

Step 1: Click on the Time to Draw Option on the Welcome Screen.


lOMoARcPSD|439 767 71

Step 2: Click on the New Document, once you done it shows like this.

Step 3: Download any image of your choice from the internet

Step 4: Import the image using File menu in the navigation or click on the
icon as shown below

Step 5: After importing the screen looks like this


lOMoARcPSD|439 767 71

Step 6: Click R to use the rectangle tool and make a frame as in the image.

Step 7: Hold Shift button and select the image and the rectangle then press
ctrl+G to group the both layers.

Step 8: Adjust the grouped layer to the full frame as shown in the image
lOMoARcPSD|439 767 71

Step 9: Now we are able to use selection and transform tool to make changes
in the image.

RESULT

Thus the selection and transform tools to modify or improve an image


using image editing tools was implemented and verified successfully.
lOMoARcPSD|439 767 71

Ex. No 1.b CREATE LOGOS AND BANNERS FOR HOME PAGES OF


Date: WEBSITES

Aim:
To Create Logos and banners for home pages of websites using InkScape
Software.

Procedure:
1. Go to the browser and paste the link
https://inkscape.org/release/inkscape-
1.3/
2. Download the Inkscape software based on your OS.
3. Don’t use app image if you are using Linux or Debian based OS, use
app instead.
4. Once you install the software, it shows the below image as a welcome
screen.
lOMoARcPSD|439 767 71

Working with InkScape:

Step 1: Click on the Time to Draw Option on the Welcome Screen.


Step 2: Click on the New Document, once you done it shows like this.

Step 3: Press on the Ctrl+Alt+N, then click on the screen and choose your
desktop resolution as shown in the picture.
lOMoARcPSD|439 767 71

Step 4: Click on the R button and place the rectangle on the top of the screen
as shown below

Step 5: Press T to add the Text button and edit the text as shown below
lOMoARcPSD|439 767 71

Step 6: Add Home, About Us and Contact text in the Banner as shown below

RESULT
Thus, the logos and banners for home pages of websites was created
successfully by using inkscape.
lOMoARcPSD|439 767 71

Ex. No 2.a WORKING WITH AUDIO EDITING TOOL AUDACITY


FOR SOUND MIXING AND SPECIAL EFFECTS LIKE
Date: FADE IN OR FADE OUT

Aim:
To create sound mixing and special effects like fade in or fade out
using Audacity Software.

Procedure:
1. Go to the browser and paste the link https://www.audacityteam.org/
2. Install the Software based on your OS.
3. Once you have done it, the welcome screen looks like this.
lOMoARcPSD|439 767 71

Working with Audacity Software:

Step 1: Click on the File menu and Import the audio file then the screen looks
like this

Step 2: Select the Starting and end point as shown in the image
lOMoARcPSD|439 767 71

Step 3: Click on the Effect option in the navigation bar.


Step 4: Click on the Fadding.
Step 5: Click on the Fade in option for the starting region and Fade out option
for the ending region.

Result:
Thus, the expected fade in and fade out sound mixing using Audacity
software was executed successfully.
lOMoARcPSD|439 767 71

Ex. No 2.b WORKING WITH AUDIO EDITING TOOL AUDACITY


TO PERFORM AUDIO COMPRESSION BY CHOOSING A
Date: PROPER CODEC

Aim:
To perform audio compression by choosing a proper codec using
Audacity Software.

Procedure:
1. Go to the browser and paste the link https://www.audacityteam.org/
2. Install the Software based on your OS.
3. Once you have done it, the welcome screen looks like this.
lOMoARcPSD|439 767 71

Working with Audacity Software:

Step 1: Click on the File menu and Import the audio file then the screen looks
like this

Step 2: Click on the effect in the Navigation Bar and click on the volume and
compression then adjust the volume as shown in the image.
lOMoARcPSD|439 767 71

RESULT
Thus, the expected audio compressing using Audacity software was
executed successfully.
lOMoARcPSD|439 767 71

Ex. No 3.a WORKING WITH VIDEO EDITING TOOL OPEN SHOT


TO EDIT AND MIX VIDEO CONTENT, REMOVE NOISE,
Date: CREATE SPECIAL EFFECTS, ADD
CAPTIONS

Aim:
To edit and mix video content, remove noise, create special effects and
to add captions using Openshot software.

Procedure:
1. Go to the browser and paste the link https://www.openshot.org/
2. Install the software based on your OS.
3. Once done, the welcome screen looks like this

Working with Open shot Software:

Step 1: Click on the File menu in the navigation bar and then import required
files for editing.
lOMoARcPSD|439 767 71

Step 2: Drag and Drop the video to the track then the screen looks like this

Step 3: Right click on the Video, then click on the slice option and click on
the keep both sides
Step 4: Click on the first part of the video then click on the Transitions which was in
the upper side of the track.
Step 5: Drag and drop the transition effect between the sliced video part, and the
screen looks like this.
lOMoARcPSD|439 767 71

Result:
Thus, the expected output after adding transitions and simple effects
using Open shot software was achieved successfully.
lOMoARcPSD|439 767 71

Ex. No 3.b WORKING WITH VIDEO EDITING TOOL OPEN SHOT


TO COMPRESS AND CONVERT VIDEO FILE FORMAT
Date: TO OTHER POPULAR FORMATS

Aim:
To compress and convert video file format to other popular formats
using Open shot software.

Procedure:
1. Go to the browser and paste the link https://www.openshot.org/
2. Install the software based on your OS.
3. Once done, the welcome screen looks like this

Working with Openshot Software:


Step 1: Click on the File menu in the navigation bar and then import required
files for editing.
Step 2: Drag and Drop the video to the track then the screen looks like this
lOMoARcPSD|439 767 71

Step 3: Press ctrl+E then the screen looks like this

Step 4: Click on the target then choose any of the other format except mp4.
Step 5: Click on the Video Profile and choose your resolution.
Step 6: Click on the quality and then choose the quality of the video.
Step 7: Once finished all the settings, click on the export video button, then
the screen looks like this
lOMoARcPSD|439 767 71

RESULT
Thus, the expected output after converting the video to various formats
using Open shot software was achieved successfully.
lOMoARcPSD|439 767 71

Ex. No 4.a WORKING WITH WEB AND MOBILE AUTHORING


Date: TOOL WORD PRESS TO
DESIGN SIMPLE HOMEPAGE WITH BANNERS,
LOGOS, TABLES AND QUICK LINKS

Aim:
To design simple homepage with banners, logos, tables and quick links
using Word press.

Working with Word press Online:


1. Go to the browser and paste the link https://wordpress.com/
2. Click on the get started and create a account.
3. Choose free plan as shown in the picture.
lOMoARcPSD|439 767 71

4. Click on the third option choose a design as shown in the image.

5. Choose any of the design as shown in the image and start editing.
lOMoARcPSD|439 767 71

6. Once done, your site looks similar to the image as shown.


lOMoARcPSD|439 767 71

Result:
Thus, the expected design using word press was achieved successfully.
lOMoARcPSD|439 767 71

Ex. No 4.b WORKING WITH WEB AND MOBILE AUTHORING


TOOL WORDPRESS TO PROVIDE A SEARCH
Date:
INTERFACE AND SIMPLE NAVIGATION FROM THE
HOME PAGES OF THE WEBSITES

Aim:
To provide a search interface and simple navigation from the home
pages of the websites using Wordpress.

Working with Wordpress Online:


1. Go to the browser and paste the link https://wordpress.com/
2. Click on the get started and create a account.
3. Choose free plan as shown in the picture.
lOMoARcPSD|439 767 71
lOMoARcPSD|439 767 71

4. Click on the third option choose a design as shown in the image.

5. Choose any of the design which has a search bar as shown in the image
and start editing.
lOMoARcPSD|439 767 71

6. Once done, your site looks similar to the image as shown.


lOMoARcPSD|439 767 71

RESULT
Thus, the expected design using word press was achieved successfully.
lOMoARcPSD|439 767 71

Ex. No 4.c WORKING WITH WEB AND MOBILE AUTHORING


TOOL WORD PRESS TO DESIGN RESPONSIVE
Date: WEBPAGE FOR USE ON BOTH WEB AND MOBILE
INTERFACE

Aim:
To design responsive webpage for use on both web and mobile interface
using Wordpress.

Working with Wordpress Online:


1. Go to the browser and paste the link https://wordpress.com/
2. Click on the get started and create a account.
3. Choose free plan as shown in the picture.
lOMoARcPSD|439 767 71
lOMoARcPSD|439 767 71

4. Click on the third option choose a design as shown in the image.

5. Choose any of the design as shown in the image and start editing.
lOMoARcPSD|439 767 71

6. Once done, your site looks similar to the image as shown.

7. In the above image you can see in the upper side as Desktop view,
Tablet view and Mobile View.
8. Thus, We Created a Responsive website.

RESULT
Thus, the expected design using word press was achieved successfully.
lOMoARcPSD|439 767 71

Ex. No 5.a
Perform a simple 2D animation with sprites
Date:

Aim:
To perform a simple 2D animation with sprites in Blender.

Procedure:
1. Go to the browser and paste the link https://www.blender.org/download/
2. Open Blender: Launch Blender and make sure you are in the 2D
Animation workspace.
3. Import Sprites: You'll need your 2D sprites in a format that Blender
can use (such as PNG). To import them, go to File > Import > Images as
Planes. Select the images you want to use as sprites.
lOMoARcPSD|439 767 71

4. Click on the new Sprite Frames resource and you'll see a new panel
appear at the bottom of the editor window

5. File System dock on the left side, drag the 8 individual images into the
center part of the Sprite Frames panel. On the left side, change the name
of the animation from "default" to "run".
lOMoARcPSD|439 767 71

6. Next, select the frames from the sprite sheet that you want to include in
your animation. We will select the top four, then click "Add 4 frames"
to create the animation.
lOMoARcPSD|439 767 71

7. You will now see your animation under the list of animations in the
bottom panel. Double click on default to change the name of the
animation to jump.

8. Finally, check the play button on the Sprite Frames editor to see your
frog jump.
lOMoARcPSD|439 767 71

RESULT
Thus, the expected design using a simple 3D animation with key frames
kinematics in krita was created successfully.
lOMoARcPSD|439 767 71

Ex. No 5.b PERFORM SIMPLE 3D ANIMATION WITH KEY


Date: FRAMES, KINEMATICS

Aim:
To perform simple 3D animation with key frames, kinematics in Blender.

Procedure:
1. Go to the browser and paste the link
https://krita.org/en/download/kritadesktop/
2. Open Krita and Create a New Document You can specify the canvas
size and resolution as per your preference.
3. Go to Settings > Switch Workspace > Animation. This will switch
Krita to

4. In the timeline panel at the bottom, click the "+" button to add a new
animation layer.
lOMoARcPSD|439 767 71

5. On the first frame of the animation layer, draw the initial state of your
object or character.

6. Use the "Transform Mask" tool to manipulate the object.


lOMoARcPSD|439 767 71

7. To draw the two extremes of the walk cycle.

8. Click the "Record Animation" button (the red dot in the timeline
panel) to start recording your key frames.
9. Move, rotate, or scale the object as desired, and Krita will
automatically create key frames for you.
lOMoARcPSD|439 767 71

10. Use the timeline to adjust the timing of your animation. You can
drag the keyframes to change their position in time.
11 Select all frames in the timeline docker by dragging-selecting them.

12. Use the play button in the timeline panel to preview your animation

13. Once you're satisfied with your animation, you can export it as a
GIF or video file by going to File > Render Animation.
lOMoARcPSD|439 767 71

Result:
Thus, the expected design using a simple 3D animation with key frames
kinematics in krita was created successfully.
lOMoARcPSD|439 767 71

Ex. No 6 WORKING WITH E-LEARNING AUTHORING TOOL


EDAPP TO
Date: DEMONSTRATE SCREEN RECORDING AND FURTHER
EDITING FOR E-LEARNING CONTENT

Aim:
To demonstrate screen recording and further editing for e-learning
content using EdApp.

Procedure:
1. Go to the browser and paste the link https://www.edapp.com/
2. Click on the get started for free as shown below

3. Enter the required details and create a free account in the platform as
shown in the image.
lOMoARcPSD|439 767 71

4. Give sample company details as your own as shown in the image

5. Click on the get started button.

6. Click on the Create course with blank as shown in the image.


lOMoARcPSD|439 767 71

7. Click on the plus icon on the left navigation bar

8. In the right of the navigation you can add the audio or any other media
files and then you can edit it as per your needs as shown.
lOMoARcPSD|439 767 71

RESULT
Thus, we executed screen recording and we also know how to edit
E-learning content in the EdApp platform.

You might also like