0% found this document useful (0 votes)
37 views27 pages

VI - CSE - CCS352-MMA - Lab Manual

The document is a lab manual for the Multimedia and Animation course at Grace College of Engineering, detailing experiments in image, audio, and video editing using tools like GIMP, Audacity, and OpenShot. It includes step-by-step instructions for creating logos, banners, and editing audio and video content, as well as guidance on web/mobile authoring tools for designing responsive web pages. Each experiment concludes with a result statement confirming the successful completion of the tasks.

Uploaded by

jerry
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
37 views27 pages

VI - CSE - CCS352-MMA - Lab Manual

The document is a lab manual for the Multimedia and Animation course at Grace College of Engineering, detailing experiments in image, audio, and video editing using tools like GIMP, Audacity, and OpenShot. It includes step-by-step instructions for creating logos, banners, and editing audio and video content, as well as guidance on web/mobile authoring tools for designing responsive web pages. Each experiment concludes with a result statement confirming the successful completion of the tasks.

Uploaded by

jerry
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 27

4931_Grace College of Engineering,Thoothukudi

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

BE- Computer Science and Engineering

Anna University Regulation: 2021

CCS352 - Multimedia and Animation

III Year/VI Semester

LAB MANUAL

Prepared By,

Mrs. K.M.ANNAMMAL, AP/CSE

CCS352_MMA
4931_Grace College of Engineering,Thoothukudi

LAB MANUAL

Experiment 1
Working with Image Editing tools:
Install tools like GIMP/ Inkscape / Krita / Pencil and perform editing
operations:
★ Use different selection and transform tools to modify or improve
an image
★ Create logos and banners for the home pages of websites.

Creating a Logo:
● Open GIMP: Launch the GIMP software on your computer.
● Create a new canvas: Go to "File" in the menu bar and select "New."
Set the dimensions for your logo canvas by entering the desired width
and height. Choose the resolution and click "OK" to create a new
canvas.
● Design your logo:
1. Text: Select the "Text Tool" from the Toolbox on the left side.
Click on the canvas and type in your logo text. You can choose
the font, size, color, and other formatting options from the text
tool options at the bottom of the Toolbox.
2. Shapes: Use the "Shape Tool" to create shapes like circles,
rectangles, or custom shapes for your logo. Select the desired
shape from the Toolbox, click and drag on the canvas to draw
the shape, and adjust its properties from the tool options.
3. Drawing: You can use various drawing tools, such as the
"Paintbrush Tool," "Pencil Tool," or "Eraser Tool," to create
freehand or pixel-based elements for your logo. Experiment
with different brushes, colors, and sizes to achieve the desired
effect.
4. Layers: Utilize layers to separate and organize different
elements of your logo. Each element, such as text or shapes,
can be placed on separate layers. To create a new layer, click

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

the "New Layer" button at the bottom of the Layers dialogue


(Windows → Dockable Dialogs → Layers).
● Fine-tune your logo:
1. Alignment and spacing: Use the alignment tools (found in the
Toolbox) to align and distribute elements evenly. You can also
adjust the spacing between letters or shapes by selecting them
and using the "Move Tool" to move them closer or further apart.
2. Effects and filters: GIMP offers a wide range of effects and
filters to enhance your logo. You can access these options
through the "Filters" menu. Experiment with effects like blurs,
shadows, gradients, or angles to give your logo a unique look.
● Save your logo:
1. Save your work in GIMP's native format to preserve the layers
and editing capabilities. Go to "File" and select "Save" or "Save
As." Choose a location and provide a name for your file. Click
"Save."
2. Export your logo in a suitable file format (e.g., PNG, JPEG) for
use in different applications. Go to "File" and select "Export As."
Choose the desired file format, provide a name, and click
"Export."
Creating a Banner:
● Open GIMP: Launch the GIMP software on your computer.
● Create a new canvas: Go to "File" in the menu bar and select "New."
Set the dimensions for your banner canvas by entering the desired
width and height. Choose the resolution and click "OK" to create a
new canvas.
● Design your banner:
1. Background: Use the "Bucket Fill Tool" or the "Gradient Tool" to
fill the canvas with a suitable background color or gradient.
Select the tool from the Toolbox, choose the color or gradient
from the tool options, and click on the canvas to apply.
2. Text: Add text to your banner using the "Text Tool." Click on the
canvas, type in your desired text, and adjust the font, size,
color, and other formatting options from the text tool options.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

3. Images and graphics: Import images or graphics to include in


your banner. Go to "File" and select "Open." Locate the image
file on your computer and click "Open." Use the "Move Tool" to
position the image on the canvas.

Output:

Result:
Thus the banner and logo has been created successfully using GIMP.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 2
Working with Audio Editing tools:
★ Install tools like, Audacity / Ardour for audio editing, and sound
mixing, and add special effects like fade-in or fade-out, etc.,
★ Perform audio compression by choosing a proper codec.

Installation:
● Visit the Audacity website: Go to the Audacity website at
https://www.audacityteam.org/.
● Download the installer: On the Audacity website, click on the
"Download" button to access the downloads page. Choose the
appropriate installer for your operating system (Windows, macOS, or
Linux).
● Run the installer: Once the installer file is downloaded, run it by
double-clicking on the file.
● Accept the terms and conditions: Read and accept the terms and
conditions of the software.
● Choose installation options: During the installation process, you may
be prompted to choose additional components to install. Select the
options you desire, such as optional plug-ins or language packs.
● Complete the installation: Follow the on-screen instructions to
complete the installation process. The installer will create shortcuts or
icons as necessary.
● Launch Audacity: After installation, launch Audacity by locating its
shortcut or searching for it in the Start menu (Windows) or
Applications folder (macOS).

Audio Editing and Applying Special Effects Fade In/Fade Out:


● Import audio: Open Audacity and import the audio file you want to
edit by going to File > Import > Audio.
● Select the portion to fade: Use the selection tool (I-beam icon) to
highlight the section of the audio where you want to apply the fade-in
or fade-out effect.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

● Apply fade-in effect: To apply a fade-in effect, go to Effect > Fade In.
Audacity will gradually increase the volume from silence to the
desired level.

● Apply fade-out effect: To apply a fade-out effect, go to Effect > Fade


Out. Audacity will gradually decrease the volume from the desired
level to silence.
● Adjust fade duration: By default, the fade duration is relatively short,
but you can adjust it by selecting the fade-in or fade-out portion of the
audio and dragging its edges to lengthen or shorten it.
● Preview and save: To preview the audio with the fade effects, click
the Play button. If you're satisfied with the result, save the edited
audio by going to File > Export > Export Audio.

Perform Sound Mixing:


● Import audio tracks: Open Audacity and import the audio tracks you
want to mix by going to File > Import > Audio. Select the files you
want to include in the mix and click "Open.”
● Arrange tracks: By default, the imported tracks will appear as
separate tracks stacked vertically. Drag and drop the tracks to
arrange them in the desired order for mixing. You can also use the
Time Shift Tool (double-headed arrow) to adjust the timing of
individual tracks.
● Adjust volume levels: To adjust the volume levels of individual tracks,
use the Envelope Tool (the icon that looks like a line with small dots).
Click and drag the dots to create volume envelopes for each track.
For example, you can create a gradual increase or decrease in
volume over time.
● Apply effects: If you want to apply effects to individual tracks or the
entire mix, select the portion of the audio you want to affect and go to
Effect > Apply. Choose the desired effect from the list, such as EQ,
reverb, or compression.
● Mix and balance tracks: To balance the overall sound of the mix,
adjust the volume levels of each track relative to one another. Use the
slider controls on each track to increase or decrease the volume.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

● Preview the mix: To preview the mix, click the Play button in
Audacity's transport toolbar. Listen carefully to the levels and adjust
as needed to achieve the desired balance and sound.
● Export the mix: Once you're satisfied with the sound mix, go to File >
Export > Export Audio. Choose the desired file format, name the file,
and select the location where you want to save it. Click "Save" to
export the mixed audio.

Perform Audio Compression by choosing a proper codec:


● Understand audio codecs: An audio codec is a technology that
compresses and decompresses audio data. Different codecs have
varying compression algorithms and settings, which affect the quality
and file size of the compressed audio. It's important to consider your
requirements, such as desired audio quality and file size, when
selecting a codec.
● Identify available codecs: Audacity supports a variety of audio
codecs. Some popular options include MP3, AAC, Ogg Vorbis, and
FLAC. Research and understand the features, compression ratios,
and compatibility of different codecs to determine the one that best
suits your needs.
● Choose the codec: Once you have a clear understanding of the
available codecs, select the one that aligns with your requirements.
Consider factors such as the intended use of the compressed audio,
target playback devices, and desired balance between audio quality
and file size.
● Configure codec settings (if applicable): Some codecs offer
configurable settings that allow you to fine-tune the compression
process. For example, you may be able to adjust bit rate, sample
rate, channel settings, and other parameters. Consult the
documentation or specifications of the chosen codec to understand
its available settings and adjust them as desired.
● Export audio with the selected codec: In Audacity, go to File > Export
> Export Audio. Choose the desired file format associated with the
selected codec (e.g., MP3, AAC, Ogg, FLAC) from the "Save as type"
or "Format" dropdown menu. Configure any additional settings

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

specific to the chosen codec if available. Provide a name and location


for the exported audio file, and click "Save" or "Export" to initiate the
compression process.
● Monitor the compression progress: Depending on the size of the
audio file and the codec's compression algorithm, the compression
process may take some time. Audacity will display a progress bar
indicating the status of the compression. Wait for the process to
complete.
● Review and verify the compressed audio: Once the compression
process is finished, verify the compressed audio file to ensure it
meets your requirements. Play the file in a compatible audio player or
import it back into Audacity for further analysis if needed.

Output:

Result:
Thus the audio editing, sound mixing and compression has been done
successfully using Audacity.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 3
Working with Video Editing and conversion tools:
★ Install tools like OpenShot / Cinelerra / HandBrake for editing video
content.
★ Edit and mix video content, remove noise, create special effects, and
add captions.

Installation:
● Visit the OpenShot website: Go to the OpenShot website at
https://www.openshot.org/.
● Download the installer: On the OpenShot website, click on the
"Download" button to access the downloads page. Choose the
appropriate installer for your operating system (Windows, macOS, or
Linux).
● Run the installer: Once the installer file is downloaded, run it by
double-clicking on the file.
● Accept the terms and conditions: Read and accept the terms and
conditions of the software.
● Choose installation options: During the installation process, you may
be prompted to choose additional components or features to install.
Select the options you desire, such as additional effects or language
packs.
● Complete the installation: Follow the on-screen instructions to
complete the installation process. The installer will create shortcuts or
icons as necessary.
● Launch OpenShot: After installation, launch OpenShot by locating its
shortcut or searching for it in the Start menu (Windows) or
Applications folder (macOS).
Edit and mix video content, remove noise, create special effects, and
add captions:
● Import video files: Open OpenShot and import the video files you
want to edit by going to File > Import Files. Select the videos you
want to include in your project and click "Open."

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

● Arrange video clips: Drag and drop the imported video clips into the
timeline at the bottom of the OpenShot interface to arrange them in
the desired order for editing.
● Edit and trim clips: To remove unwanted parts of a video clip, click on
it in the timeline, then use the trim handles at the beginning and end
of the clip to adjust its duration.
● Remove noise: OpenShot doesn't have a built-in noise removal tool,
but you can use third-party audio editing software like Audacity
(mentioned earlier) to remove noise from the audio tracks of your
videos. Export the audio tracks, edit them in Audacity to remove
noise, and import them back into OpenShot.
● Add special effects: OpenShot provides various special effects that
you can apply to your video clips. Select a video clip in the timeline,
go to the Effects tab in the top-left corner, choose an effect category,
and drag and drop the effect onto the clip.
● Add captions: To add captions or subtitles to your video, go to the
Title tab in the top-left corner, choose a title style, and drag and drop
it onto the timeline above the desired video clip. Double-click on the
title clip to edit the text and customize its appearance.
● Preview and export: To preview your edited video, click the Play
button in the preview window. Once you're satisfied with the result, go
to File > Export Video. Choose the desired video format, resolution,
and other export settings. Provide a name and location for the
exported video file, and click "Save" or "Export" to initiate the
rendering process.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Output:

Result:
Thus the editing and mixing video content has been done successfully
using Openshot.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 4
Working with web/mobile authoring tools:
★ Install tools like Adapt / KompoZer/ BlueGriffon / BlueFish /
Aptana Studio/ NetBeans / WordPress /Expression Web:
★ Design a simple Home page with banners, logos, tables quick
links, etc
★ Provide a search interface and simple navigation from the home
page to the inside pages of the website.
★ Design Responsive web pages for use on both web and mobile
interfaces.

● Set up the project: Launch NetBeans and create a new web project
by going to File > New Project. Choose the appropriate web project
template based on your preferred programming language (Java, PHP,
etc.) and click "Next". Provide a project name, location, and other
details as required, then click "Finish" to create the project.
● Design the homepage: In the NetBeans IDE, locate the "Web Pages"
folder in your project. Right-click on it, go to New > HTML File. Name
the file "index.html" (or any other desired name) and click "Finish" to
create the homepage file.
● Add content: Open the newly created "index.html" file in the
NetBeans editor. Design the homepage by adding HTML code for
banners, logos, tables, quick links, and any other desired elements.
Use HTML tags, CSS, and images as needed to achieve the desired
design. For example:
<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
<!-- Add CSS styles here -->
</head>
<body>
<header>
<h1>Welcome to My Website</h1>
<!-- Add banners, logos, etc. here -->

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

</header>
<nav>
<!-- Add navigation links here -->
</nav>
<main>
<h2>Homepage Content</h2>
<!-- Add content, tables, etc. here -->
</main>
<footer>
<!-- Add footer content here -->
</footer>
</body>
</html>

● Add a search interface: To provide a search interface, you can add an


HTML form element with an input field and a submit button.
Customize the form action and method attributes based on your
desired search functionality.
● Implement simple navigation: To enable simple navigation from the
homepage to inside pages, use HTML anchor tags (<a>) with
appropriate href attributes. Link the anchor tags to the URLs of the
inside pages you want to navigate to.
● Design responsive web pages: To create responsive web pages that
adapt to both web and mobile interfaces, utilize CSS media queries.
Define different styles and layouts for different screen sizes. You can
use CSS frameworks like Bootstrap or write custom CSS to achieve
responsive design.
● Test and preview: Save the changes made to the homepage file and
run the project in NetBeans to see a preview of the homepage in a
web browser. Resize the browser window to test the responsiveness
of the page and ensure that the design and functionality are working
as expected.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Design Responsive web pages for use on both web and mobile
interfaces.
● Create a new HTML file: Right-click on the "Web Pages" folder in
your NetBeans project and select New > HTML File. Name the file
"index.html" (or any other desired name) and click "Finish" to create
the file.
● Add HTML structure: Open the "index.html" file in the NetBeans
editor and add the basic HTML structure:
<!DOCTYPE html>
<html>
<head>
<title>Responsive Web Design Example</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>Responsive Web Design Example</h1>
</header>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
<main>
<section>
<h2>Welcome to Our Website!</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing</p>
</section>
</main>
<footer>
<p>&copy; 2023 My Website. All rights reserved.</p>
</footer>

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

</body>
</html>
● Create a CSS file: Right-click on the "Web Pages" folder, select New
> CSS File, and name it "styles.css". This file will contain the CSS
styles for the responsive design.
● Define responsive CSS styles: Open the "styles.css" file and add the
following CSS code:
/* Mobile-first responsive design */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}

header, nav, main, footer {


padding: 20px;
}

header {
background-color: #333;
color: #fff;
}

nav ul {
list-style: none;
margin: 0;
padding: 0;
}

nav li {
display: inline;
margin-right: 10px;
}

nav a {

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

color: #fff;
text-decoration: none;
}
section {
margin-bottom: 20px;
}
/* Media query for tablets and larger screens */
@media (min-width: 768px) {
nav li {
display: block;
margin-bottom: 10px;
}
main {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}
}
/* Media query for larger screens */
@media (min-width: 1200px) {
main {
grid-template-columns: 1fr 1fr 1fr;
}
}
● In this example, the CSS styles define a mobile-first approach where
the layout adapts for larger screens using media queries. The
@media rules target specific screen widths to apply different styles.
● Save and preview: Save both the HTML and CSS files. Run the
project in NetBeans to see a preview of the responsive web design.
Resize the browser window to see how the layout and styles adapt
based on the screen size.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Output:

Result:
Thus the responsive simple web page has been created successfully using
Netbeans.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 5
Working with Animation tools:
Install tools like Krita, Wick Editor, and Blender:
★ Perform a simple 2D animation with sprites
★ Perform simple 3D animation with keyframes, kinematics

Installation:
● Visit the Blender website: Go to the Blender website at
https://www.blender.org/.
● Download the Blender installer: On the Blender website, click on the
"Download" button to access the downloads page. Choose the
appropriate installer for your operating system (Windows, macOS, or
Linux).
● Run the installer: Once the installer file is downloaded, run it by
double-clicking on the file.
● Accept the terms and conditions: Read and accept the terms and
conditions of the software.
● Choose installation options: During the installation process, you may
be prompted to choose additional components or features to install.
Select the options you desire, such as additional plugins or language
packs.
● Complete the installation: Follow the on-screen instructions to
complete the installation process. The installer will create shortcuts or
icons as necessary.
● Launch Blender: After installation, launch Blender by locating its
shortcut or searching for it in the Start menu (Windows) or
Applications folder (macOS).
● Now that Blender is installed on your computer, you can use it to
perform both 2D and 3D animations.

Performing a simple 2D animation with sprites:

● Create or import sprites: In Blender's 2D Animation workspace, you


can either create your own sprites using the built-in drawing tools or
import pre-existing sprites.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

● Set up the animation: Use the Timeline or Dope Sheet editor to set up
the keyframes for the animation. Keyframes define the position,
scale, rotation, and other properties of the sprites over time.
● Animate the sprites: Manipulate the sprites in each frame to create
the desired motion. You can move, rotate, scale, and deform the
sprites to create animations.
● Preview and render the animation: Use the Animation Playback
controls to preview the animation in real time. Adjust the timing and
properties of the keyframes as needed. Once you're satisfied, you
can render the animation into a video file or image sequence.

Performing a simple 3D animation with keyframes and kinematics:

● Create 3D objects: Use Blender's modeling tools to create or import


3D objects that will be part of the animation.
● Set up the animation: Use the Timeline or Dope Sheet editor to set up
the keyframes for the animation. Keyframes define the position,
rotation, scale, and other properties of the objects over time.
● Animate the objects: Manipulate the objects in each frame to create
the desired motion. You can move, rotate, scale, and deform the
objects to create animations. You can also use kinematics and
constraints to create more complex interactions between objects.
● Preview and render the animation: Use the Animation Playback
controls to preview the animation in real time. Adjust the timing and
properties of the keyframes and kinematics as needed. Once you're
satisfied, you can render the animation into a video file or image
sequence.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Output:

Result:
Thus the 2D and 3D animation has been performed successfully using
Blender.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 6
★ Working with Mobile UI animation tools: Origami studio / Lottie /
Framer etc.,

● Download and install Origami Studio: Visit the Origami Studio website
at https://origami.design/ and download the installer for your
operating system (macOS only). Run the installer and follow the
on-screen instructions to complete the installation.
● Launch Origami Studio: Once installed, open Origami Studio from
your applications folder.
● Create a new project: In the Origami Studio interface, click on "New
Project" or go to File > New to create a new project. Give your project
a name and choose the desired screen size for the mobile device
you're designing for (e.g., iPhone X).
● Design your mobile UI: In the canvas area of Origami Studio, you can
design your mobile user interface by dragging and dropping UI
components from the Library panel on the left side. You can also
import design assets from other tools like Sketch or Figma.
● Add animations: Origami Studio provides a powerful animation
system that allows you to create interactive and animated UIs. You
can add animations to UI elements by connecting patches in the
Patch Editor. The Patch Editor is a visual programming interface
where you can create animations and interactions using different
patches (nodes) and wires to connect them.
● Preview and test: Use the Origami Live app (available on iOS) to
preview and test your mobile UI animations on a real device. Install
the Origami Live app on your device, and then click on the "Preview"
button in Origami Studio. Connect your device to your computer, and
you'll be able to interact with your UI prototype directly on your
device.
● Refine and iterate: Iterate your design and animation by making
changes in Origami Studio and previewing them in real time using
Origami Live. You can adjust animations, timings, and interactions to
achieve the desired user experience.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

● Export and share: Once you're satisfied with your mobile UI


animations, you can export your prototype as a video, animated GIF,
or interactive file to share with stakeholders or developers. Origami
Studio provides export options to generate these files.

Output:

Result:
Thus the animation in mobile has been done successfully using Origami
Studio.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 7
Working with E-Learning authoring tools:
Install tools like EdApp / Moovly / CourseLab/ IsEazy and
CamStudio/Ampache, VideoLAN:
★ Demonstrate screen recording and further editing for e-learning
content.
★ Create a simple E-Learning module for a topic of your choice.

● Download CamStudio: Go to the official Cam Studio website


(http://camstudio.org/) or any trusted software download platform.
Locate the download link for Cam Studio and click on it to initiate the
download.
● Run the installer: Once the Cam Studio installer is downloaded,
locate the file and run it. Follow the on-screen instructions to install
CamStudio on your computer. Ensure that you carefully read each
step and select the appropriate options during the installation
process.
● Launch Cam Studio: After the installation is complete, launch
CamStudio by locating its shortcut on your desktop or in the Start
menu.
Demonstrate screen recording and further editing for e-learning
content.

● Set up CamStudio: Launch CamStudio and configure the settings


according to your preferences. For screen recording, select the
desired region of your screen that you want to capture.
● Configure audio settings: If you want to include audio narration or
background music in your e-learning module, configure the audio
settings in CamStudio. Go to Options > Audio Options and select the
appropriate audio source, such as a microphone or system audio.
● Start recording: Click on the red "Record" button in CamStudio to
start the screen recording. Perform the actions on your screen that
you want to capture for the e-learning module. You can pause or stop
the recording as needed.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

● Edit the recorded video: After the recording is complete, you can edit
the video using video editing software. If you don't have video editing
software, you can use free options like Windows Movie Maker (for
Windows) or iMovie (for macOS) to perform basic editing tasks like
trimming, adding text overlays, or adding transitions.

Create a simple E-Learning module for a topic of your choice.


● Enhance the e-learning module: Once you have edited the video, you
can enhance the e-learning module by adding additional elements
like text captions, callouts, annotations, or images to provide further
explanations or emphasize important points. You can use the same
video editing software or tools like PowerPoint to create these
additional elements.
● Export and save the e-learning module: After you have completed
editing and enhancing the e-learning module, export it as a video file.
Choose a suitable video format and quality settings based on your
requirements. Save the exported video file in a location of your
choice.
● Share and distribute the e-learning module: You can now share and
distribute the e-learning module with your intended audience. You can
upload it to a learning management system (LMS), share it via email
or cloud storage, or publish it on video hosting platforms like YouTube
or Vimeo.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Output:

Result:
Thus the simple e-learning content has been created successfully using
CamStudio.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Experiment 8

Creating VR and AR applications:


★ Any affordable VR viewer like Google Cardboard and any
development platform like Openspace 3D / ARCore etc.

Creating VR/AR applications using Google Cardboard involves a series of


steps. Google Cardboard is a simple and cost-effective way to experience
virtual reality on your smartphone. Below is a basic outline of the procedure
to create a VR/AR application using Google Cardboard:

Understand the Basics:


Familiarize yourself with virtual reality and augmented reality concepts, as
well as the specific capabilities and limitations of Google Cardboard.

Choose Development Platform:


Decide on the development platform you want to use. You can opt for game
engines like Unity or Unreal Engine, or web-based frameworks like
A-Frame or Three.js.

Set Up Development Environment:


Install the necessary software and tools for your chosen development
platform. For example, if you're using Unity, download the Unity software
and Android SDK.

Obtain Google Cardboard SDK:


Download the Google Cardboard SDK for your development platform. The
SDK provides necessary libraries and APIs to integrate VR functionalities.

Design the User Interface (UI):


Plan and design the user interface for your VR/AR application. This
includes designing the 3D environment, user interactions, and menus.

CCS352_MMA LAB MANUAL


4931_Grace College of Engineering,Thoothukudi

Implement VR/AR Features:


Use the Google Cardboard SDK to implement VR/AR features into your
application. This may include features like head tracking, gaze-based
interactions, and stereoscopic rendering.

Test the Application:


Regularly test your application on a compatible smartphone with a Google
Cardboard headset. Ensure that the VR/AR experience is smooth and
without any major issues.

Optimize Performance:
VR/AR applications require high performance to ensure a smooth
experience. Optimize your application's performance by reducing
unnecessary graphical complexity and using efficient coding practices.

Add AR Features (Optional):


If you want to include augmented reality features, consider using AR
frameworks like ARCore (for Android) or ARKit (for iOS).

Publish the Application:


Once your application is fully developed and tested, you can publish it to
the respective app stores (Google Play Store for Android or Apple App
Store for iOS) or make it available for download on your website.

CCS352_MMA LAB MANUAL

You might also like