EMERGENCY SIREN DETECTING EAR PODS

A PROJECT REPORT
Submitted by

SHARMILA A (111523102193)
SONA N (111523102201)
SWETHA J (111523102208)

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

Semester III
22GE311 Product Development Lab - 3

R.M.D ENGINEERING COLLEGE

(An Autonomous Institution)

OCTOBER 2024
 R. M. D. ENGINEERING COLLEGE
(An Autonomous Institution)
R.S.M. NAGAR, KAVARAIPETTAI - 601 206.
GUMMIDIPOONDI TALUK, THIRUVALLUR DIST.

Certified that this is a bonafide record work done by SHARMILA A, SONA N, SWETHA J with

Roll / Register Number 111523102193,111523102201 and 111523102208 of III semester

CSE department during the academic year 2024- 2025 (Odd semester)

Subject Code: 22GE311

Subject Name: Product Development Lab - 3

Faculty in charge Head of the Department

Submitted for Practical Examination held on ............................

Examiner
 TABLE OF CONTENTS
S.NO CONTENTS PAGE NO
1 Abstract 1
2 Introduction 2
3 Objectives 3
3.1. Functionalities
4 Scope 4
5 Program Environment 5
6 UML Diagrams 8
6.1. Activity Diagram
7 Features 10

8 System Testing and Implementation

8.1. Testing Objectives
8.2. System Testing
8.3. System Implementation
9 Coding
10 Screenshots
11 Conclusion
12 Future Scope
13 References
1. ABSTRACT

When we drive with our earphones (which is against the rules and some
places illegal, it still continues) one will not be able to hear the siren of
ambulance which will be a disaster The foremost priority is about the
emergency siren of the ambulance. When one is driving with the
earphones on, the background gets cancelled out thanks to the
background cancellation facility. Due to this they will not be able to
hear the siren and make the way to the ambulance thus putting the life
of the injured inside the ambulance at stake. A life should not the price
for someone’s carelessness. Thus, in some of the places it is illegal to
drive with the earphones and it is not advised to wear the earphones
while driving. But this is violated in most of the places. By incorporating
a sound detecting sensors in the earphones for detecting the sound of
the siren will alert the driver. Thus they will make the way to the
ambulance and thus saving a struggling life by taking them to the
health care on time.
 2. INTRODUCTION

Wearing earphones while driving is not advised and in some place they
are illegal too. But most of us are not aware or still go against the rules.
Engaging in phone calls or listening to loud music through ear pods can
distract you from focusing on the road. This distraction could lead to
delayed reaction times or missed traffic signals or worse by not listening
to the siren of the ambulance and making way for them, increasing the
risk of accidents. Thus, enhanced sound detecting of the siren of the
ambulance becomes a necessity.

The foremost priority is about the emergency siren of the ambulance. When
one is driving with the earphones on, the background gets cancelled out
thanks to the background cancellation facility. Due to this they will not be
able to hear the siren and make the way to the ambulance thus putting the life
of the injured inside the ambulance at stake. A life should not the price for
someone’s carelessness. Thus, in some of the places it is illegal to drive with
the earphones and it is not advised to wear the earphones while driving. But
this is violated in most of the places. By incorporating a sound detecting
sensors in the earphones for detecting the sound of the siren will alert the
driver. Thus, they will make the way to the ambulance and thus saving a
struggling life by taking them to the health care on time.
 3. OBJECTIVES OF THE PROJECT
his project can significantly enhance safety and awareness in various
environments, benefiting both individuals and the community as a whole.

3.1. Functionalities provided by fake news detection system are as follows:

1) Siren Detection:
The sound sensor can detect specific frequencies associated with ambulance sirens,
differentiating them from other sounds.

2) Enhanced safety:
Reducing distractions allows individuals to focus on the road and their surroundings,
promoting safer behavior when an ambulance is nearby.

3) Improved Emergency Response:

Clearer audio cues can help ensure that vehicles yield the right of way more effectively, allowing
ambulances to reach their destinations faster.

4) Customizable Settings:
Users can customize the distance or duration for which music is paused, allowing for a
tailored experience based on personal preferences or local traffic patterns.

5) Promoting Responsible Driving:

By actively encouraging drivers to be more aware of their surroundings, the project fosters a
culture of responsible driving and attentiveness.
 4. SCOPE OF THE PROJECT

This project not only aims to enhance user safety by providing an audio-aware
experience but also promotes awareness of surrounding environments, particularly in
busy urban settings. It combines technology with social responsibility, potentially
making a significant impact in urban mobility and public safety.

Enhanced Safety for Pedestrians and Cyclists

 Automatically pauses music to alert users to approaching emergency vehicles,
reducing the risk of accidents.

Awareness in Urban Environments

 Helps users stay aware of their surroundings, particularly in busy city settings
where emergency vehicles frequently operate.

Support for Commuters

 Assists individuals commuting in various ways (walking, cycling, or running) by
allowing them to maintain focus on the road without compromising awareness of
emergency situations.

Noise-Cancellation Adaptation
 Works in conjunction with noise-canceling features, adjusting audio playback to
ensure important sounds are not missed while still providing a high-quality
listening experience.
 .

5.PROGRAM ENVIRONMENT

5.1 Hardware:
Microphone:
High-sensitivity miniature microphones (MEMS or ECM) to capture sound from the
surroundings.

Digital Signal Processor (DSP):

A DSP or microcontroller to process the audio signal, allowing for real-time sound
analysis and filtering.

Wireless Connectivity:
Bluetooth Low Energy (BLE) or Wi-Fi module for wireless earbuds to connect with a
smartphone or other devices.

Earbud Components:
Speaker drivers (for audio output).
Battery and charging circuit (small form-factor for wearable devices).

Power Management Unit (PMU):

Efficient power management system to handle energy consumption of microphones,
signal processing, and wireless communication.

Noise Isolation/ANC (optional):

Active Noise Cancellation (ANC) circuit to filter out background noise while focusing
on detecting sirens.
Sensors (optional):

Gyroscope and accelerometer for detecting user’s movements or directionality of sound.

5.2 Software:
Audio Processing Software:
Software capable of analyzing and filtering frequencies specific to sirens (e.g., using Fast
Fourier Transform - FFT for frequency domain analysis).

Machine Learning/AI Algorithms:

Pre-trained models for detecting and classifying siren sounds (e.g., Convolutional Neural
Networks - CNNs or Recurrent Neural Networks - RNNs) integrated on the DSP.

Embedded Operating System:

A lightweight real-time OS like FreeRTOS or Zephyr for managing real-time processing
on the microcontroller or DSP.
Signal Processing Libraries:
Libraries such as DSPLib, ARM CMSIS-DSP, or custom libraries for audio signal
processing to handle filtering, FFT, and feature extraction.

Mobile Application (optional):

A companion app (Android/iOS) to notify users or adjust settings remotely, including
volume control or sensitivity to sirens.

Data Logging and Analytics (optional):

Software to log detected siren data for user feedback or refinement of the detection
algorithm.

Development Tools:
IDE for Embedded Development:
IDEs like IAR Embedded Workbench, Keil uVision, or STM32CubeIDE for developing
firmware.
Simulation/Modeling Tools:

MATLAB or Python (SciPy, NumPy) for signal processing simulation and developing
detection algorithms.
5.8 Tools:

TensorFlow, Keras, or PyTorch for training and testing machine learning models specific
to siren sound detection.

Version Control:
Git for source code management and collaboration.
Debugging Tools:
Logic analyzers, oscilloscopes, or In-circuit emulators (ICE) for debugging the
DSP/microcontroller.

3D Modeling and Prototyping:

CAD software (e.g., Autodesk Fusion 360) for designing the earbuds' housing.
3D printers for rapid prototyping the casing of the earbuds.

Tools for Testing:

Audio Test Equipment:
Signal generators and acoustic chambers for testing the sensitivity and accuracy of the
microphones in detecting sirens.

Field Testing Tools:

Field recorders and acoustic environment simulators to test the earbuds in various
environments with actual siren sounds.

6.UML DIAGRAMS

The Unified Modeling Language (UML) was created to forge a common,

semantically and syntactically rich visual modeling language for the architecture,
design, and implementation of complex software systems both structurally and
behaviorally.

UML has applications beyond software development, such as process flow in

manufacturing. It is analogous to the blueprints used in other fields, and consists of
different types of diagrams. In the aggregate, UML diagrams describe the boundary,
structure, and the behavior of the system and the objects within it.

UML is not a programming language but there are tools that can be used to
generate code in various languages using UML diagrams. UML has a direct relation
with object-oriented analysis and design.

6.1 Activity diagrams

Activity diagrams show the procedural flow of control between class

objects, along with organizational processes like business workflows. These
diagrams are made of specialized shapes, then connected with arrows. The
notation set for activity diagrams is similar to those for state diagrams.
● Begin your activity diagram with a solid circle.
● Connect the circle to the first activity, which is modeled with a
rectangle.
● Now, connect each activity to other activities with lines
that demonstrate the stepwise flow of the entire process.
ACTIVITY DIAGRAM FOR SOUND DETECTING EARBUDS
 7.FEATURES

1. Advanced Noise Recognition

 Sound Classification Algorithms: These earbuds would include machine learning algorithms that can
classify and recognize specific sound patterns, such as ambulance sirens, based on their distinct audio
signature.
 Pre-trained Models for Emergency Sounds: The earbuds would come with pre-trained AI models
capable of identifying emergency vehicle sirens (ambulance, police, fire trucks) in various environments.

2. Directional Sound Detection

 Microphone Array: Multiple microphones in the earbuds could provide spatial awareness, detecting the
direction of incoming emergency sounds.
 Beamforming Technology: This technology focuses on specific sounds coming from a certain direction
(like an approaching ambulance), even in noisy environments.

3. Real-Time Alerts
 Instant Notifications: Upon detecting an ambulance sound, the earbuds would immediately lower the
music volume or notify the user via vibration or voice prompt.
 Seamless Audio Dimming: Music or other audio playing in the earbuds would be automatically reduced
in volume, allowing the user to hear the approaching siren clearly.

4. Ambient Sound Awareness Mode

 Transparency Mode: These earbuds would have a transparency mode that allows external sounds (like
ambulance sirens) to be heard more clearly without needing to remove the earbuds.
 Adaptive Filtering: The transparency mode could automatically adjust the level of environmental noise
based on the detected sound (e.g., amplifying sirens).

5. Customization and Learning

 Custom Sound Profiles: Users could set custom sound detection profiles, allowing the earbuds to focus
on specific types of emergency sounds relevant to them.
 Continuous Learning: The system would improve over time by learning the user’s environment and
becoming more accurate at detecting ambulance sirens in different contexts.

6. Battery Efficiency
 Low Power Consumption for Detection: Sound-detection features would be designed to work
efficiently without draining the battery quickly, ensuring that the earbuds remain functional for long
periods while being alert for emergency sounds.
7. Integration with Smart Devices
 GPS & Map Integration: These earbuds could be integrated with GPS and map services to notify users
when they are in the vicinity of an emergency, such as when an ambulance is nearby.

8. Noise Cancellation & Prioritization

 Active Noise Cancellation (ANC) with Siren Detection: The earbuds would combine noise
cancellation with siren detection, so general background noise is canceled, but ambulance sirens are still
detected and prioritized.
 Prioritized Environmental Sounds: Other environmental sounds (e.g., honking) would also be
configurable for detection, ensuring maximum safety awareness.
5. SYSTEM TESTING AND IMPLEMENTATION

8.1 Testing Objectives

Software testing is an important element of Software Quality Assurance and

represents the ultimate review of specification, design and coding. The increasing
visibility of software as a system element and the costs associated with a software
failure are motivating forces for well planned, through testing. There are several
rules that can serve as testing objectives:

● Testing is a process of executing a program with the intent of

finding errors.
● A good test case is the one that has a high probability of finding
an undiscovered error.
● A successful test is one that uncovers an undiscovered error.

8.2 System Testing

System testing is actually a series of different tests whose primary purpose is

to fully exercise the computer-based system. Although each test has a different
purpose, all work to verify that all system elements have been properly integrated
and perform allocated functions.

During testing we tried to make sure that the product does exactly what it is
supposed to do. Testing is the final verification and validation activity within the
organization itself. In the testing stage, I try to achieve the following goals; to
affirm the quality of the product, to find and eliminate any residual errors from
previous stages, to validate the software as a solution to the original problem, to
demonstrate the presence of all specified functionality in the product, to estimate
the operational reliability of the system. During testing the major activities are
concentrated on the examination and modification of the source code.

Testing Methodologies

The following are the Testing Methodologies:

1. Unit Testing.
2. Integration Testing.
3. Usability Testing.
4. Output Testing.
5. Validation Testing.

Unit Testing

Unit testing focuses verification effort on the smallest unit of Software

design that is the module. Unit testing exercises specific paths in a module’s
control structure to ensure complete coverage and maximum error detection. This
test focuses on each module individually, ensuring that it functions properly as a
unit. Hence, the naming is Unit Testing.

Integration Testing

Integration testing addresses the issues associated with the dual problems
of verification and program construction. After the software has been integrated a
set
of high order tests are conducted. The main objective in this testing process is to
take unit tested modules and build a program structure that has been dictated by
design.

Types of Integration Testing:

1. Top Down Integration

This method is an incremental approach to the construction of

program structure. Modules are integrated by moving downward through
the control hierarchy, beginning with the main program module. The
module subordinates to the main program module are incorporated into the
structure in either a depth first or breadth first manner.

2. Bottom-up Integration

This method begins the construction and testing with the modules at
the lowest level in the program structure. Since the modules are integrated
from the bottom up, processing required for modules subordinate to a given
level is always available and the need for stubs is eliminated. The bottom up
integration strategy may be implemented with the following steps:
● The low-level modules are combined into clusters into clusters
that perform a specific Software sub-function.
● A driver (i.e.) the control program for testing is written
to coordinate test case input and output.
● The cluster is tested.
 ● Drivers are removed and clusters are combined moving
upward in the program structure.
Usability Testing

Usability Testing, also known as User Experience(UX) Testing, is a testing

method for measuring how easy and user-friendly a software application is. A
small set of target end-users, use software applications to expose usability defects.
Usability testing mainly focuses on the user's ease of using application, flexibility
of application to handle controls and ability of application to meet its objectives.

The goal of this testing is to satisfy users and it mainly concentrates on the
following parameters of a system:
● The effectiveness of the system
● Efficiency
● Accuracy
● User Friendliness

Output Testing

After performing the validation testing, the next step is output testing of the
proposed system, since no system could be useful if it does not produce the
required output in the specified format. The outputs generated or displayed by the
system under consideration are tested by asking the users about the format required
by them. Hence the output format is considered in two ways – one is on screen and
another in printed format.
Validation Checking

Validation checks are performed on the following fields.

● Text Field
The text field can contain only the number of characters lesser than or
equal to its size. The text fields are alphanumeric in some tables and
alphabetic in other tables. Incorrect entries always flash the error message.

● Numeric Field

The numeric field can contain only numbers from 0 to 9. An entry of

any character flashes an error message. The individual modules are checked
for accuracy and what it has to perform. Each module is subjected to a test
run along with sample data. The individually tested modules are integrated
into a single system. Testing involves executing the real data information
used in the program; the existence of any program defect is inferred from
the output. The testing should be planned so that all the requirements are
individually tested.

A successful test is one that gives out the defects for the inappropriate data
and produces an output revealing the errors in the system.

Preparation of Test Data

The above testing is done by taking various kinds of test data. Preparation of
test data plays a vital role in the system testing. After preparing the test data the
system under study is tested using that test data. While testing the system by using
test data errors are again uncovered and corrected by using above testing steps and
corrections are also noted for future use.

Using Live Test Data

Live test data are those that are actually extracted from organization files.
After a system is partially constructed, programmers or analysts often ask users to
key in a set of data from their normal activities. Then, the systems person uses this
data as a way to partially test the system. In other instances, programmers or
analysts extract a set of live data from the files and have them entered themselves.

It is difficult to obtain live data in sufficient amounts to conduct extensive

testing. And, although it is realistic data that will show how the system will
perform for the typical processing requirement, assuming that the live data entered
are in fact typical, such data generally will not test all combinations of formats that
can enter the system. This bias toward typical values then does not provide a true
systems test and in fact ignores the cases most likely to cause system failure.

Using Artificial Test Data

Artificial test data are created solely for test purposes, since they can be
generated to test all combinations of formats and values. In other words, the
artificial data, which can quickly be prepared by a data generating utility program
in the information systems department, make possible the testing of all login and
control paths through the program.
 The most effective test programs use artificial test data generated by persons
other than those who wrote the programs. Often, an independent team of testers
formulates a testing plan, using the system's specifications.

8.3 System Implementation

Implementation is the stage of the project where the theoretical design is

turned into a working system. At this stage the main work load, the greatest
upheaval and the major impact on the existing system shifts to the user
department. If the implementation is not carefully planned and controlled it can
cause chaos and confusion.

Implementation includes all those activities that take place to convert from
the old system to the new one. The new system may be totally new, replacing an
existing manual or automated system or it may be a major modification to an
existing system. Proper implementation is essential to provide a reliable system to
meet the organization requirements. Successful implementation may not guarantee
improvement in the organization using the new system, but improper installation
will prevent it.

The process of putting the developed system in actual use is called system
implementation. This includes all those activities that take place to convert from
the old system to the new system. The system can be implemented only after
thorough testing is done and if it is found to be working according to the
specifications. The system personnel checks the feasibility of the system.
 The most crucial stage is achieving a new successful system and giving
confidence to the new system for the user that it will work efficiently and
effectively. It involves careful planning, investigation of the current system and its
constraints on implementation, design of methods to achieve the changeover. The
more complex the system being implemented, the more involved will be the
system analysis and the design effort required just for implementation. The system
implementation has three main aspects. They are education and training, system
testing and changeover.

The implementation stage involves following tasks:

● Careful planning.
● Investigation of system and constraints.
● Design of methods to achieve the changeover.
● Training of the staff in the changeover phase.
● Evaluation of the changeover method.

The method of implementation and the time scale to be adopted are found
out initially. Next the system is tested properly and at the same time users are
trained in the new procedures.

Implementation Procedures

Implementation of software refers to the final installation of the package in

its real environment, to the satisfaction of the intended users and the operation of
the system. In many organizations some one who will not be operating it, will
commission the software development project. The people who are not sure that
the software is meant to make their job easier. In the initial stage, they doubt
about the software but we have to ensure that the resistance does not build up as
one has to make sure that

● The active user must be aware of the benefits of using the

system
● Their confidence in the software is built up
● Proper guidance be imparted to the user so that he is
comfortable in using the application.

Before going ahead and viewing the system, the user must know that for
viewing the result, the server program should be running on the server. If the
server object is not up running on the server, the actual processes won't take place.

User Training

To achieve the objectives and benefits expected from a computer based

system, it is essential for the people who will be involved to be confident of their
role in the new system. As systems become more complex, the need for education
and training is more and more important.

Education is complementary to training. It brings life to formal training by

explaining the background to the resources for them. Education involves
creating the right atmosphere and motivating user staff. Education sections
should encourage participation from all staff with protection for individuals for
group criticism. Education should start before any development work to enable
users to maintain or to regain the ability to participate in the development of
their system.
 Education information can make training more interesting and more
understandable. The aim should always be to make individuals feel that they can
still make all important contributions, to explain how they participate in making
system changes, and to show that the computer and computer staff do not operate
in isolation, but are of the same organization.

Training on the Application Software

After providing the necessary basic training on computer awareness the

users will have to be trained on the new application software. This will give the
underlying philosophy of the use of the new system such as the screen flow,
screen design, type of help on the screen, type of errors while entering the data, the
corresponding validation check at each entry and the ways to correct the data
entered. It should then cover information needed by the specific user/groups to use
the system or part of the system while imparting the training of the program on the
application. This training may be different across different user groups and across
different levels of hierarchy.

Operational Documentation

Once the implementation plan is decided, it is essential that the user of the
system is made familiar and comfortable with the environment. Education
involves the right atmosphere & motivating the user. A documentation providing
the whole operations of the system is being developed. The system is developed in
such a way that the user can work with it in a well consistent way. The system is
developed user friendly so that the user can work the system from the tips given in
the application itself. Useful tips and guidance is given inside the application itself
to help the user. Users have to be made aware of what can be achieved with the
new system and how it increases the performance of the system. The user of the
system should be given a general idea of the system before he uses the system.

6. CODING
Index.html
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ticko</title>

<!--links-->
<link rel="stylesheet" href="style.css">

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Space+Grotesk:wght@300;400;500;60 0;700&display=swap"
rel="stylesheet">

<!--Bootstrap-->
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.c
ss">

</head>
<body>

<!--Navbar-->

<nav class="navbar navbar-expand-lg bg">

<div class="container">

<a class="navbar-brand" href="#">Ticko</a>

<button class="navbar-toggler" type="button" data-
toggle="collapse" data-target="#navbarSupportedContent"
 aria-controls="navbarSupportedContent" aria-
expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>

<div class="collapse navbar-collapse"

id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#"></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"></a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
event</ <a class="nav-link"
a> href="./createvent.html">Create

</li>
<li class="nav-item">
<a class="nav-link"
href="./loginpage.html">Login</a>
</li>
<li class="nav-item">
<a class="nav-link"
href="./signupPage.html">Signup</a>
</li>
</ul>
</form>
</div>
</div>
</nav>

<div class="container">
<div class="land">
<div class="cta">
<p class="title-1">Discover and organize events</p>
<p class="slog">Reach your audience and sell tickets for your
event</
p> <a href="./createvent.html">Organize an event</a>
<a href="./events.html" class="ghost-btn">Find an event</a>
</div>
<img src="./landing-pic2.png" alt="illustration">

</div>
</div>
 <!--Bp Scripts-->
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js"></
script
>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.
min.j s"></script>
<script></script>

</body>

Style.css
body{
font-family: 'Space Grotesk', sans-serif !
important; background-color: rgb(255, 255, 255)
!important;
}

nav.bg{
background-color: rgb(242, 255, 245);
}

a.navbar-brand{
font-weight: 700;
color: rgb(2, 182, 47) !important;
}

.nav-item .nav-link{
color: black !important;
transition: all .2s ease-
in;
}

.navbar-nav .nav-item.active{
color: rgb(2, 182, 47) !important;

.nav-item .nav-link:hover{
color: rgb(2, 182, 47) !important;
}
 display: flex;
}

.land .title-1{
margin-top:
50px;
}

.land .slog{
color: grey;
margin-bottom: 70px;
}

.land a{
background-color: rgb(2, 182, 47);
color: #fff;
padding: 12px 24px;
border-radius:
40px; text-
decoration: none;
transition: all .2s ease-in;
}

.land a.ghost-btn{
background-color:
#fff;
border: 1px solid rgb(2, 150, 39);
color: rgb(2, 150,
39); text-
decoration: none;
transition: all .2s ease-
in; margin-left: 10px;
}

.land a:hover{
text-decoration:
none; color: #fff;
background-color: rgb(2, 150, 39);
}

.land img{
width: 500px;
margin-left: 30px;
align-items:
center;
}
/*TEXTS*/

.title-1{
font-size: 80px;
font-weight:
600; line-
height: 80px;

divi.css
.land {
display: flex;
}

.land .title-1 {
margin-top:
50px;
margin-bottom: 30px;
}

.land a {
background-color: rgb(0, 161, 201);
color: #fff;
padding: 12px 24px;
border-radius:
40px; text-
decoration: none;
transition: all .2s ease-in;
}

.land a.ghost-btn {
background-color:
#fff;
border: 1px solid rgb(0, 161, 201);
color: rgb(0, 161, 201);
text-decoration: none;
transition: all .2s ease-
in; margin-left: 10px;
}

.land a:hover {
text-decoration:
none; color: #fff;
background-color: rgb(2, 139, 173);
}

.land img {
width: 500px;
}

/*TEXTS*/

.title-1 {
font-size: 80px;
font-weight:
600; line-
height: 80px;

Createevent.html
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Create event</title>

<!--links-->
<link rel="stylesheet" href="events.css">

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Space+Grotesk:wght@300;400;500;60 0;700&display=swap"
rel="stylesheet">

<!--Bootstrap-->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.c
ss" rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.
min.j s"></script>

</head>

<body>
<div class="container">
<div class="steps">
<div class="step">
<div class="num">
<p class="step-num">1</p>
</div>
<a href="">Basic info</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">2</p>
</div>
<a href="">Schedule</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">3</p>
</div>
<a href="">Details</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">4</p>
</div>
<a href="">Tickets</a>
</div>
</div>

</div>

<div class="container">
<div class="form">
<div class="basic">

<p class="title2">Basic info</p>

<div class="mb-3">
<label class="form-label">Event Title</label>
<input type="email" class="form-control" placeholder="">
</div>
<div class="mb-3">
<label class="form-label">Organizers</label>
<input type="email" class="form-control" placeholder="">
</div>

<div class="mb-3">
<div class="selection">
 <div class="type">
<label class="form-label">Type</label>
<select class="form-select">
<option selected>Select event type</option>
<option value="1">Seminar</option>
<option value="2">Conference</option>
<option value="3">Other</option>
</select>
</div>
<div class="Category">
<label class="form-label">Category</label>
<select class="form-select">
<option selected>Select event category</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</div>
</div>
</div>
</div>

<hr>

<div class="location">
<p class="title2">Location</p>

<div class="mb-3">
<input type="radio" class="btn-check" name="options"
id="option1" autocomplete="off" checked>
<label class="btn btn-success" for="option1">Venue</label>

<input type="radio" class="btn-check" name="options"

id="option2" autocomplete="off">
<label class="btn btn-success" for="option2">Online
event</label>

</div>

</div>

<hr>

<div class="datentime">
<p class="title2">Date and Time</p>
 <div class="mb-3">
<div class="selection">
<div class="start-date">
<label class="form-label">Event starts</label>
<input type="date" class="form-control"
placeholder="
"> </div>
<div class="Category">
<label class="form-label">Start time</label>
<select class="form-select">
<option selected>Select time</option>
<option value="1">7:00AM</option>
<option value="2">7:30AM</option>
<option value="3">8:00AM</option>
<option value="3">8:30AM</option>
<option value="3">10.00AM</option>
</select>
</div>

</div>
</div>

<div class="mb-3">
<div class="selection">
<div class="start-date">
<label class="form-label">Event ends</label>
<input type="date" class="form-control"
placeholder="
"> </div>
<div class="Category">
<label class="form-label">End time</label>
<select class="form-select">
<option selected>Select time</option>
<option value="1">7:00PM</option>
<option value="2">7:30PM</option>
<option value="3">8:00PM</option>
</select>
</div>

</div>
</div>

</div>
 <hr>

<a href="./schedule.html">Save and Continue</a>

</div>
</div>

<!--Bp Scripts-->
<script
src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min
.js">
</script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
></sc ript>

</body>

</html>

details.html
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Create event</title>

<!--links-->
<link rel="stylesheet" href="events.css">

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Space+Grotesk:wght@300;400;500;60 0;700&display=swap"
rel="stylesheet">
 <!--Bootstrap-->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css
" rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.mi
n.j s"></script>

<script src="https://unpkg.com/feather-icons"></script>

</head>

<body>

<div class="container">
<div class="steps">
<div class="step">
<div class="num">
<p class="step-num"><i data-feather="check"></i></p>
</div>
<a href="">Basic info</a>
</div>
<div class="step">
<div class="num">
<p class="step-num"><i data-feather="check"></i></p>
</div>
<a href="">Schedule</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">3</p>
</div>
<a href="">Details</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">4</p>
</div>
<a href="">Tickets</a>
</div>
</div>

</div>

<div class="container">
 <div class="form">
<div class="basic">

<p class="title2">Event Description</p>

<p>Describe about your event</p>

<div class="datentime">

<div class="mb-3">
<textarea name="" id="" cols="55" rows="5"></textarea>
</div>

</div>

<hr>

<a href="./tickets.html">Save and Continue</a>

<a href="" class="back-btn">Back</a>

</div>
</div>

<!--Bp Scripts-->
<script
src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.j
s">
</script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"><
/sc ript>

<script>
 feather.replace()
</script>

</body>

</html>

signupPage.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="signupstyle.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Space+Grotesk:wght@300;400;500;60 0;700&display=swap"
rel="stylesheet">

</head>
<body>
<div class="brand">
<h1>Ticko</h1>
</div>
<div class="signup-form">
<form>
<h2>Sign Up</h2>
<p>Please fill in this form to create an account.</p>
<hr>
<br>
<label>Email</label><br><br>
<input type="text" placeholder="Enter Email" name="email"
required><br>
<label> Password</label><br><br>
<input type="password" placeholder="Enter Password" name="psw"
required><br>

<label>ReEnter Password</label><br><br>
<input type="password" placeholder="Repeat Password" name="psw-
repeat" required>
 <button type="submit"><a href="register.html">Sign Up</a></button>
</div>
</form>
</body>
</html>

signupstyle.css
body {
font-family: 'Space Grotesk', sans-serif !important;

.signup-form{
display:
flex;
flex-direction:
column; justify-
content: center;
align-items: center;
}

.brand{
text-align: center;
color: rgb(2, 182,
47);
}

h3 {
color: black;
}

input[type="text"], input[type="password"] {
width: 440px;
height: 40px;
padding-left:
18px; margin-
bottom: 20px;
}

label {
font-weight: bold;
}

button {
background-color:
#04AA6D; color: white;
padding: 14px
20px; margin: 8px
0; border: none;
cursor: pointer;
 width: 83%;
}

.psw {
text-align: center;
}

button a{
text-decoration:
none; color: #fff;
font-size: 16px;
}

loginPage.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="loginstyle.css">

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Space+Grotesk:wght@300;400;500;60 0;700&display=swap"
rel="stylesheet">

</head>
<body>
<div class="brand">
<h1>Ticko</h1>
<h3>Welcome Back!</h3><br>
</div>
<div class="login-form">
<form >
<label>Username</label>
<br><br>
<input type="text" placeholder="Enter Username / Email"
name="uname" required><br>
<label>Password</label>
<br>
<br>
 <input type="password" placeholder="Enter Password" name="psw"
required>
<br>
<button type="submit"><a
href="./events.html">Login</a></button><br>
<br>

<p class="psw">Forgot <a href="#">password?</a></p>

</div>
</form>
</body>
</html>

loginStyle.css
body {
font-family: 'Space Grotesk', sans-serif !important;

.login-form{
display:
flex;
flex-direction:
column; justify-
content: center;
align-items: center;
}

.brand{
text-align: center;
color: rgb(2, 182,
47);
}
h3 {
color: black;
}
input[type="text"],
input[type="password"]{ width: 400px;
height: 40px;
padding-left:
18px; margin-
bottom: 20px;

}
label {
font-weight: bold;
}
button {
 margin: 8px 0;
border: none;
cursor:
pointer;
width: 100%;
}

.psw {
text-align: center;
}

button a {
text-decoration:
none; color: #fff;
font-size: 16px;
}

Schedule.html
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Create event</title>

<!--links-->
<link rel="stylesheet" href="events.css">

<link rel="preconnect" href="https://fonts.googleapis.com">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Space+Grotesk:wght@300;400;500;60 0;700&display=swap"
rel="stylesheet">

<!--Bootstrap-->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.c
ss" rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.
min.j s"></script>

<script src="https://unpkg.com/feather-icons"></script>
</head>

<body>

<div class="container">
<div class="steps">
<div class="step">
<div class="num">
<p class="step-num"><i data-feather="check"></i></p>
</div>
<a href="">Basic info</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">2</p>
</div>
<a href="">Schedule</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">3</p>
</div>
<a href="">Details</a>
</div>
<div class="step">
<div class="num">
<p class="step-num">4</p>
</div>
<a href="">Tickets</a>
</div>
</div>

</div>

<div class="container">
<div class="form">
<div class="basic">

<p class="title2">Schedule</p>
<p>Choose the starting and ending date for the event need to
be active on the platform</p>

<div class="datentime">

<div class="mb-3">
 <div class="selection">
<div class="start-date">
<label class="form-label">Start Date</label>
<input type="date" class="form-control"
placeholder="
"> </div>
<div class="Category">
<label class="form-label">End Date</label>
<input type="date" class="form-control"

placeholder="
"> </div>

</div>
</div>

</div>

<hr>

<a href="./details.html">Save and Continue</a>

<a href="" class="back-btn">Back</a>

</div>
</div>

<!--Bp Scripts-->
<script
src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.j
s">
</script>
 <script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
></sc ript>

<script>
feather.replace()
</script>

</body>

</html>

7. SCREENSHOTS

Landing Page
 Events Page

Particular Event Page

8. CONCLUSION

The Event Management System can be further enhanced in the future by

adding more customer service for the audience participating in the events. The
application serves as a broker between the audience and the event organizers.
Online payment services will be the most added advantage for the customer to
make their payment through Credit Card/ Debit Card/ UPI.

It can also be enhanced by adding features that help the audience to invite
their colleagues and friends for the event. The application developed is designed in
such a way that any further enhancements can be done with ease. The system has
the capability for easy integration with other systems. The Event Management
System will be enhanced further with bulk mailing services to the customer so that
their favorite events can be notified.
9. FUTURE SCOPE

In a nutshell, it can be summarized that the future scope of the

project circles around maintaining information regarding:

 We can add printer in future.

 We can give more advance software for Event Management

System including more facilities

 We will host the platform on online servers to make it

accessible worldwide

 Integrate multiple load balancers to distribute the loads of the system

 Create the master and slave database structure to reduce the

overload of the database queries

 Implement the backup mechanism for taking backup of codebase

and database
12. REFERENCES

● https://developer.mozilla.org/en-US/docs/Web/JavaScript
● https://developer.mozilla.org/en-US/docs/Web/HTML
● https://developer.mozilla.org/en-US/docs/Web/CSS
● https://www.djangoproject.com/start/