Cloud Computing ASHUU
Cloud Computing ASHUU
MICRO-PROJECT REPORT
COURSE CODE:-22624
PREPARED BY:-
Seal of Institute
ACKNOWLEDGEMENT
We wish to express our profound gratitude to our guide Prof.T.A.GAVHAL who guided us
endlessly in framing and completion of Micro-Project. He / She guided us on all the main
points in that Micro-Project. We are indebted to his / her constant encouragement,
cooperation and help. It was his / her enthusiastic support that helped us in overcoming of
various obstacles in the Micro-Project. We are also thankful to our Principal, HOD, Faculty
Members and classmates for extending their support and motivation in the completion of
this Micro-Project.
The Object detectionmicro-project addresses several key course outcomes, providing a well-
rounde educational experience. Firstly, it enhances programming proficiency by requiring
participants write, debug, and optimize code in relevant languages such as Python oJavaScript.
Through development of the stopwatch, learners gain a solid understanding of timmanagement
and retime functionalities, applying asynchronous programming techniques and event handlin.
project also emphasizes user interface design, encouraging the creation of intuitive and user-
friendly interfaces that meet accessibility standards. Furthermore, participants practice
development by implementing and refining features like start, stop, reset, and lap functions,
which reinforces their logical reasoning and problem-solving skills. The project incorporates
elements of the software development lifecycle, from initial planning to final deployment,
allowing students to experience project management firsthand. Additionally, they engage in
testing and debugging, enhancing their ability to ensure software quality and reliability., the
Object detectionmicro-project equips participants with essential skills and knogpreparing for
future challenges in software development and enhancing their portfolios with a practical
application
2.0 Proposed Methodology :-
The proposed methodology for developing the Object detection micro-project involves a
structured approach to ensure effective implementation and learning outcomes. Firsthe
project begins thorough planning, where the objectives and key features, such as start, stop,
reand lap functionalities, are clearly defined. Next, participants conduct research on existing
Object
detectionapplications to gather ideas for user interface design and functionality. establishing a
framework, the development environment is set up, selecting an appropriate programming
language and necessary libraries or frameworks. The actual implementation involves coding
functionalities, ensuring accurate timing and responsive user interactions, while also focusing
creating a clean and intuitive user interface. Rigorous testing follows, encompassing unit tests
individual functions and integration tests to ensure all components work seamlessly together.
Feedback is collected from potential users to refine the application further. Documentation is
created throughout the process, including user manuals and technical guides to assist future
maintenance and understanding. Finally, the project concludes with deployment, where the
detectionapplication is packaged for distribution, allowing users to install and utilize it easily.
This methodology not only reinforces technical skills but also emphasizes project management
and collaboration.
4.0 Action Plan :-
Name of
Sr. Planned Planned
Details of activity Responsible
No. Week Start date Finish
Team
date
Members
1 1 &2 Discussion & Finalization of ALL
Topic
2 3 Preparation of the Abstract ALL
3 4 Literature Review ALL
4 5 Submission of Microproject ALL
Proposal ( Annexure-I)
5 6 Collection of information ALL
about Topic
6 7 Collection of relevant ALL
content / materials for the
execution of Microproject.
7 8 Discussion and submission ALL
of outline of the
Microproject.
8 9 Analysis / execution of ALL
Collected data /
information and preparation
of Prototypes / drawings /
photos / charts / graphs /
tables / circuits / Models /
programs etc.
9 10 Completion of Contents of ALL
Project Report
10 11 Completion of Weekly ALL
progress Report
11 12 Completion of Project ALL
Report ( Annexure-II)
12 13 Viva voce / Delivery of ALL
Presentation
4.0 Resources Required :-
Micro-Project Report
1.0 Rational:-
The rationale for developing a Object detectionas a micro-project stems from its abilityprovide
practical experience in software development while enhancing essential programming skills.
Object detectionapplication serves as an ideal introductory project, allowing participants grasp
fundamental concepts such as time management, user interface design, and event handling.
engaging with real-time functionalities, learners can apply theoretical knowledge in a tangible
way, reinforcing their understanding of asynchronous programming and logic. Furthermore,
project fosters critical thinking as participants design algorithms for various functions, such as
starting, stopping, resetting, and recording laps. The simplicity yet practicality of a Object
detectionencourages creativity in design and functionality, making it an excellent platform
for experimentation. Additionally, the project aligns with real-world applications,
demonstrating software can meet everyday needs. Overall, the Object detectionmicro-project
not only serves valuable educational tool but also prepares participants for more complex
programming
challenges in the future.
2.0 Aims/Benefits of the Micro-Project:-
The Object detectionmicro-project aims to provide participants with a hands-on learning
experience
that enhances both technical and practical skills in software development. By building a
functional Object detectionapplication, learners deepen their understanding of time management
concepts and real-time functionalities, which reinforces their knowledge of asynchronous
programming and event handling. The project encourages the improvement of programming
skills in languages like Python or JavaScript, while also emphasizing user interface design to
create an intuitive and accessible user experience. Participants engage in algorithm
development, optimizing features such as start, stop, reset, and lap functions, which fosters
critical thinking and problem-solving abilities. Moreover, the project offers insights into the
software development lifecycle, from planning to deployment, while honing testing and
debugging skills through practical application. Completing this project results in a tangible
addition to participants' portfolios, showcasing their capabilities to potential employers.
Additionally, if done collaboratively, the project enhances teamwork and communication
skills, making it a comprehensive learning opportunity that lays the groundwork for
more advanced projects in the future.
Code
Index file
<!DOCTYPE html>
<html lang="en">
<head manifest="manifest.json">
<title>Websight</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link rel="canonical" href="https://websight.danruta.co.uk">
<meta name="keywords" content="WebSight, sobel, frei-chen, edge, detection, visually,
impaired, accessibility, VR, virtual, reality, AR, augmented, reality, WebGL, shaders,
WebVR">
<meta name="description" content="WebSight - Browser based real time VR video pass-
through augmenting via WebGL shaders such as edge detection, to aid the visually
impaired.">
<meta name="theme-color" content="#000000">
<link rel="manifest" href="./manifest.json">
<meta http-equiv="MSThemeCompatible">
<script src="dist/dependencies.min.js"></script>
<script id="vertexShaderSource" type="vertex">
varying vec2 vUv;
void main() {
vUv = uv;
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
}
</script>
<script src="dist/websight.min.js"></script>
<style>
body {
margin: 0;
overflow: hidden;
background-color: black;
color: #fff;
font-family: Arial, Helvetica, sans-serif;
}
.ui-container {
width: 100%;
position: fixed;
}
#controls {
max-width: 790px;
height: auto;
margin: 0 auto;
padding: 10px;
overflow-y: scroll;
max-height: 80vh;
background: rgba(255,255,255, 0.9);
border-radius: 3px;
font-size: 120%;
transform: translateY(-100%);
transition: transform 500ms ease;
}
#controls.open { transform: translateY(0); }
#controls .filters {
display: flex;
justify-content: center;
flex-flow: row nowrap;
}
#controls .filters > * {
margin: 5px;
}
#controls .sliders {
width: 100%;
display: flex;
flex-flow: row nowrap;
justify-content: space-around;
margin: 8px 0;
}
#controls input,
#controls button {
cursor: pointer;
text-align: center;
}
.toggle {
background-color: transparent;
width: 50px;
height: 50px;
padding: 5px;
border: 0;
outline: 0;
display: block;
position: absolute;
bottom: -50px;
left:50%;
top: 0;
margin-left:-25px;
transform: rotateX(0);
transition: transform 500ms ease;
}
#controls.open ~ .toggle {
top: auto;
transform: rotateX(180deg);
}
#enterVRButton {
position: absolute;
height: 60px;
width: 100px;
cursor: pointer;
background-image: url(./images/cardboard64.png);
background-size: cover;
background-repeat: no-repeat;
transition: transform 300ms ease;
}
#controls, button {
color: black;
font-weight: bold;
}
select {
font-weight: bold;
}
#enterVRButton, svg {
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 1));
}
label[for="radius-slider"] {
display: flex;
align-items: center;
}
#enterVRButton.small {
transform: scale(0.7);
}
.filter-button {
min-width: 120px;
min-height: 50px;
font-size: 1.3em;
border: 0;
background: #bbb;
border-radius: 3px;
}
.filter-button:disabled {
background: none;
}
#controls .colours input {
height: 30px;
max-width: 90px;
margin: 0 10px;
font-size: 1.3em;
}
#controls .colours {
display: flex;
flex-flow: row nowrap;
justify-content: center;
}
#controls .colours > div {
flex-grow: 1;
width: 50%;
display: flex;
flex-flow: column nowrap;
justify-content: space-around;
margin: 0 10px;
}
#controls .colours .colour-checkboxes {
text-align: right;
}
#controls .colours label {
line-height: 20px;
}
#controls .colours input,
#controls .colours span {
vertical-align: middle;
}
#controls .colours span, input {
font-size: 110%;
}
#colourBlindness {
font-size: 1em;
margin: 10px;
}
img, audio {
display: none;
}
input[type="checkbox"] {
height: 20px;
width: 20px;
}
#aiSection {
display: none;
}
#aiSection > div {
display: flex;
justify-content: space-around;
}
#aiSection > div > div:first-child {
width: 20%;
}
#aiSection > div > label {
width: 20%;
display: flex;
align-items: center;
justify-content: space-around;
}
#aiSection > div > label > span {
width: 100%;
text-align: center;
}
#yoloSpinner {
width: 100%;
display: flex;
justify-content: center;
}
.spinner {
height: 25px;
width: 25px !important;
border: 5px solid rgba(0,0,0,0);
border-bottom: 5px solid black;
border-radius: 50%;
animation-name: spinner;
animation-duration: 1s;
animation-iteration-count: infinite;
animation-timing-function: linear;
}
@keyframes spinner{
from {transform: rotateZ(0deg)}
to {transform: rotateZ(360deg)}
}
input[type=checkbox] {
width: 25px !important;
height: 25px !important;
margin: 5px !important;
margin-left: 10px !important;
margin-right: 10px !important;
}
</style>
</head>
<body>
<img id="fire" src="images/fire_b.png">
<img id="noise" src="images/fire_e.png">
<audio id="audioElem" controls></audio>
<div class="ui-container">
<div id="enterVRButton"></div>
<div id="controls">
<div class="filters"></div>
<div class="sliders">
<label for="radius-slider">Radius: <input type="range" id="radius-slider"
min="0" max="100" step="1"> <span id="radius-value"></span></label>
<label for="intensity-slider">Intensity: <input type="range" id="intensity-
slider" min="0" max="100" step="1"> <span id="intensity-value"></span></label>
</div>
<div class="colours">
<div class="colour-checkboxes">
<label for="invertedCheckbox"><span>Inverted</span><input
id="invertedCheckbox" type="checkbox"></label>
<label for="reducedColoursCheckbox"><span>Reduced Colours</span><input
id="reducedColoursCheckbox" type="checkbox"></label>
<label for="surfaceCheckbox"><span>Surface Colours</span><input
id="surfaceCheckbox" type="checkbox" checked></label>
<label for="colourBlindness">
<select id="colourBlindness">
<option value="none">No colour blindness</option>
<option value="protanopia">Protanopia</option>
<option value="protanomaly">Protanomaly</option>
<option value="deuteranopia">Deuteranopia</option>
<option value="deuteranomaly">Deuteranomaly</option>
<option value="tritanopia">Tritanopia</option>
<option value="tritanomaly">Tritanomaly</option>
<option value="achromatopsia">Achromatopsia</option>
<option value="achromatomaly">Achromatomaly</option>
</select>
</label>
</div>
<div class="colour-pickers">
<label for="edge-picker"><input id="edge-picker" class="jscolor {onFineChange:
'updateColour(\'edge\', this)', valueElement: 'edge-picker'}" value="FFFFFF"
readonly><span>Edge Colour</span></label>
<label for="surface=picker"><input id="surface-picker" class="jscolor
{onFineChange: 'updateColour(\'surface\', this)', valueElement: 'surface-picker'}" value="000000"
readonly><span>Background Colour</span></label>
<label for="surface=picker"><input id="ai-detection-checkbox"
type="checkbox"><span>AI detection (experimental)</span></label>
</div>
</div>
<span id="aiSection">
<hr/>
<div>
<div>Interval (ms)</div>
<input id="inferenceIntervalInput" type="number" value="500">
</div>
<div id="yoloSpinner">
<div class="spinner"></div>
</div>
</span>
</div>
<button class="toggle">
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 129
129">
<g>
<path d="m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-
1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-
5.8z" fill="#FFFFFF"/>
</g>
</svg>
</button>
</div>
</body>
<link rel="icon" href="./images/favicon.ico" type="image/x-icon">
<script>
if ("serviceWorker" in navigator) {
navigator.serviceWorker.register("/sw.js")
.then(function(reg){reg.active&&console.log("SW active")})
.catch(function(e){console.log("SW Error:",e)})
}
</script>
</html>
BLOCK DIAGRAM
4.0 Actual Methodology Followed:-
1. Project Planning :
- Defined project objectives and key features, including functionalities such as start,
stop, times. Created a timeline with milestones for project completion.
4. Implementation :
- Core Functionality : Coded the Object detectionfunctionalities, including timers and
controls, stop, reset, and lap. Ensured accurate time tracking and responsiveness to user
inputs.
- User Interface : Built the graphical user interface based on the designs, incorporating
and displays for time and laps.
5. Testing :
- Conducted unit testing for individual functions to verify accuracy and
reliability.integration testing to ensure all components worked together seamlessly.
- Engaged in user testing to gather feedback on usability and functionality,making
adjust based on user input.
6. Documentation :
- Created comprehensive documentation, including a user manual detailing how to install
the stopwatch, as well as technical documentation describing the code structure and design
7. Deployment :
- Packaged the application for distribution, creating an installer or a standalone
executable users to easily install and run the stopwatch.
1. Data Integrity :
- Ensures that the time records and user data transmitted between the application and
any server or database remain unchanged and uncorrupted during transfer.
2. Confidentiality :
- Protects sensitive information, such as user settings or usage statistics, from unauthorized
access by encrypting data during transmission, ensuring that only intended recipients can
read it.
3. Authentication :
- Verifies the identity of users or devices involved in the transfer process, preventing
unauthorized users from sending or receiving data, thereby enhancing the
application's security.
5. User Trust :
- By implementing secure text transfer, users are more likely to trust the application
with their data, leading to increased user engagement and satisfaction.
1. Complexity :
- Implementation of secure protocols can be technically challenging and
require expertise.
2. Performance Overhead :
- Encryption and decryption processes can introduce latency and affect
system performance.
3. User Experience :
- Additional steps for authentication or key management may frustrate users.
4. Key Management Issues :
- Securely generating, storing, and sharing encryption keys can be difficult.
6.0 Actual Resources Used:-
References:-
www.google.com
www.shiksha.com
www.studocu.com
MICRO-PROJECT EVOLUTION SHEET
7 Presentation
8 Viva
(A) (B)
Total Marks
Process and Product Individual Presentation/
10
Assessment (6 Viva (4 marks)
marks)
Comments/Suggestions about team work/leadership/inter-personal communication (if any)
Dated Signature:-