KEMBAR78
Product Development Lab Sample Report | PDF | Software Testing | Use Case
0% found this document useful (0 votes)
60 views51 pages

Product Development Lab Sample Report

Uploaded by

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

Product Development Lab Sample Report

Uploaded by

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

EVENT MANAGEMENT SYSTEM

A PROJECT REPORT
Submitted by

LASYA PRIYA A (111521203031)


MANVITHA R (111521203040)
SEEMA SD (111521203051)

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 LASYA PRIYA A, MANVITHA R and

SEEMA SD with Roll / Register Number 111521203031,111521203040, and 111521203051

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 4
2 Introduction 5
3 Objectives 6
3.1. Functionalities
4 Scope 7
5 Program Environment 8
5.1. Hardware Requirements
5.2. Software Requirements
5.3. Tools Required
5.4. Frontend and Backend
6 UML Diagrams 10
6.1. Use Case Diagram
6.2. Activity Diagram
7 Features 15
7.1. Post and manage event
7.2. Register for an event
7.3. Invite family/friends to the event
7.4. Sell tickets for your event
7.5. Conduct virtual events
8 System Testing and Implementation 17
8.1. Testing Objectives
8.2. System Testing
8.3. System Implementation
9 Coding 27
10 Screenshots 46
11 Conclusion 48
12 Future Scope 49
13 References 50
1. ABSTRACT

Event management system is used to manage all the activities like marketing
and selling tickets to the audience. In any event many event organizers find it hard
to manage the events single handedly. It is also important for event organizers that
he has reached his audience about the event. To manage all these activities related
to event management we have built this website. Our website allows anyone to
create, share, find and attend events that fuel their passions and enrich their lives.
From music festivals, conferences, community rallies, and fundraisers, to gaming
competitions and air guitar contests. The users can easily post and manage your
online or in-person events on a trusted platform and build a seamless attendee
experience that elevates your brand. They can also increase the discovery of your
events by curating a group of your events onto a single page.
2. INTRODUCTION

An event can be a public assembly or a social gathering. The event’s


purpose can be for celebration, education, marketing or reunions. Event
management is a process of planning and organizing various events such as
(ceremony, birthdays, weddings, charitable events, concerts, parties). Event
management means doing various tasks at a time and making sure that each and
everything is in place. It’s not rocket science to make an event successful. It is the
coordination, running and handling of all the people around. All events start with
an idea. The idea describes the event in its simplest forms. Concepts are clear
statements that give meaning and parameters to an event idea. Defining an event
concept is a creative process. The 5 W’s: WHO, WHAT, WHY, WHEN and
WHERE, are tools used for transforming an idea into a concept. The W’s helps to
know if an event idea is feasible, viable and sustainable. It is also important for
event organizers that he has reached his audience about the event. To manage all
these activities related to event management we have built this website. Our
website allows anyone to create, share, find and attend events that fuel their
passions and enrich their lives. From music festivals, conferences, community
rallies, and fundraisers, to gaming competitions and air guitar contests. The users
can easily post and manage your online or in-person events on a trusted platform
and build a seamless attendee experience that elevates your brand. They can also
increase the discovery of your events by curating a group of your events onto a
single page.
3. OBJECTIVES OF THE PROJECT

The main objective of the Project on Event Management System is to manage the
details of Event, Activity, Organizers, Attendees, Conductors. It manages all the
information about Event, Payment, Conductors, Event. The project is totally built
at administrative end and thus only the administrator is guaranteed the access. The
purpose of the project is to build an application program to reduce the manual
work for managing the Event, Activity, Payment, Organizers. It tracks all the
details about the Organizers, Attendees, Conductors.

3.1. Functionalities provided by Event Management System are as follows:

 Provides the searching facilities based on various factors. Such as


Event, Organizers, Attendees, Conductors

 Event Management System also manage the Payment details online


for Attendees details, Conductors details, Event.

 It tracks all the information of Activity, Payment, Attendees ect

 Manage the information of Activity

 Shows the information and description of the Event, Organizers

 To increase efficiency of managing the Event, Activity

 It deals with monitoring the information and transactions of Attendees.

 Manage the information of Event

 Editing, adding and updating of Records is improved which results in


proper resource management of Event data.

 Manage the information of Attendees


4. SCOPE OF THE PROJECT
It may help collecting perfect management in details. In a very short time,
the collection will be obvious, simple and sensible. It will help a person to know
the management of passed year perfectly and vividly. It also helps in current all
works relative to Event Management System. It will be also reduced the cost of
collecting the management & collection procedure will go on smoothly.

Our project aims at Business process automation, i.e. we have tried to computerize
various processes of Event Management System.

 In computer system the person has to fill the various forms & number
of copies of the forms can be easily generated at a time.

 In computer system, it is not necessary to create the manifest but we


can directly print it, which saves our time.

 To assist the staff in capturing the effort spent on their respective


working areas.

 To utilize resources in an efficient manner by increasing their


productivity through automation.

 The system generates types of information that can be used for


various purposes.
 It satisfy the user requirement
 Be easy to understand by the user and operator
 Be easy to operate
 Have a good user interface
 Be expandable
 Delivered on schedule within the budget.
.

5. PROGRAM ENVIRONMENT

5.1 Hardware Requirements

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

5.2 Software Requirements

● Operating System : Windows/Linux/Macos


Browser : Chrome/Brave/Edge/Safari

5.3 Tools Required

● Tool : Visual Studio


● Icons : Feathericons

5.4 Front-End and Back-End

● Frontend : HTML/CSS/JS
● Backend : Django(Python)
HTML

HTML, stands for HyperText Markup Language, is not a programming language,


but it is used to build-up the body of the websites. It can be seen as the bond of
webpages. The website which only contains HTML will look boring, but all the
first generation of web pages looked like that.

CSS

CSS, stands for Cascading Style Sheets, is used to describe how a website should
look like. In other words, CSS allows us to design our web pages. If HTML is
bone, then CSS would be the clothes and skin of webpages. A website with only
HTML and CSS can be awesome and fascinating, but the only problem is that all
the buttons are not functioning or a better way to descript is only HTML built-in
function while the buttons you added on will not function at all even though they
are clickable.

Javascript

JavaScript is a programming language and it is used to connect all parts of the


website together and assign works for all elements. Thus, front-end developers are
usually called JavaScript developers too. Of course, JavaScript is harder to learn
compared to the above two types of codes, but it is the one to make your dream
website alive. HTML is bone, CSS is skin, and JavaScript is muscle. A piece of
extra information is that JavaScript has been installed in every browser, so it is not
necessary to install one on your PC, but it is not able to execute codes outside the
browsers.

Django

Django is a high-level Python web framework that encourages rapid development


and clean, pragmatic design. Built by experienced developers, it takes care of
much of the hassle of web development, so you can focus on writing your app
without needing to reinvent the wheel. It’s free and open source.
● Django was designed to help developers take applications from concept
to completion as quickly as possible.
● Django takes security seriously and helps developers avoid many
common security mistakes.
● Some of the busiest sites on the web leverage Django’s ability to
quickly and
flexibly scale.

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 Use case diagrams

● A use case is a list of steps that define interaction between an actor (a


human who interacts with the system or an external system) and the system
itself.
● Use case diagrams depict the specifications of a use case and model
the functional units of a system.
● These diagrams help development teams understand the requirements
of their system, including the role of human interaction therein and the
differences between various use cases.
● A use case diagram might display all use cases of the system, or just one

group of use cases with similar functionality.


➔ To begin a use case diagram, add an oval shape to the center of
the drawing.
➔ Type the name of the use case inside the oval.
➔ Represent actors with a stick figure near the diagram, then use lines
to model relationships between actors and use cases.
6.2 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 round-
edged rectangle.
● Now, connect each activity to other activities with lines
that demonstrate the stepwise flow of the entire process.
● You can also try using swimlanes to represent the objects that
perform each activity.
Activity diagram for event management system
7. FEATURES

7.1 Post and manage event

The users can easily post and manage their online or in-person events on the
platform and build a seamless attendee experience that elevates your brand.

7.2 Register for an event

The users can register for the event that they find interesting and matches
their goals. The event may be a virtual event or in-person event and the event
organizers might ask the attendees to pay for the event and buy the tickets.

7.3 Invite family/friends to the event

The users can also invite their family and friends to the event that they
would like to attend by sharing the event page to them through social media
platforms.

7.4 Sell tickets for your event

The event organizers can mention the price of the tickets while posting the
event to the audience on the platform. The tickets can be free of cost too.
7.5 Conduct virtual events

The event organizers can also conduct virtual events for the
audience. When the audience registers for the event, the audience would get the
virtual meet link that directs them to the event on the day of the event.
8. 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.

9. 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/bootstrap@4.6.1/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/jquery@3.5.1/dist/jquery.slim.min.js"></
script
>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/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/bootstrap@5.1.3/dist/css/bootstrap.min.c
ss" rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/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/core@2.10.2/dist/umd/popper.min
.js">
</script>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/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/bootstrap@5.1.3/dist/css/bootstrap.min.css
" rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/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/core@2.10.2/dist/umd/popper.min.j
s">
</script>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/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/bootstrap@5.1.3/dist/css/bootstrap.min.c
ss" rel="stylesheet">
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/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/core@2.10.2/dist/umd/popper.min.j
s">
</script>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js"
></sc ript>

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

</body>

</html>

10. SCREENSHOTS

Landing Page
Events Page

Particular Event Page


11. 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.
12. 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/

You might also like