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

Design Project

The document describes a project to develop a website for an online bookstore. It includes requirements like allowing users to browse, search for and purchase books online. It provides UML diagrams and snippets of code for the frontend of the website.

Uploaded by

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

Design Project

The document describes a project to develop a website for an online bookstore. It includes requirements like allowing users to browse, search for and purchase books online. It provides UML diagrams and snippets of code for the frontend of the website.

Uploaded by

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

SRI RAMAKRISHNA INSTITUE OF TECHNOLOGY

AN AUTONOMOUS INSTITUTION

COIMBATORE – 641010

DEPARTMENT OF INFORMATION TECHNOLOGY

PROJECT REPORT

20IT901

DESIGN PROJECT III YEAR

B.TECH IT

ACADAMIC YEAR : 2023-2024 SEMESTER:06


BONAFIDE CERTIFICATE

Certified Bonafide Record workdone by ROHINDH.S

Register No 71382106040 Of the class III-year Information


Technology during the academic year 2023-2024.

Submitted for the Practical Examination held on


at Sri Ramakrishna Institute of Technology,Coimbatore.

STAFF IN CHARGE

INTERNAL EXAMINER EXTERNAL EXAMINER


COURSE OBJECTIVE:
The will enable the students to apply the knowledge ad practical skills to solve real
life engineering problems.

COURSE CONTENT:

1. Create a website for Online Book Store


2. Design Mobile Application for Health Monitoring System
3. Develop a Business Portfolio Management System
4. Create a fore casting Software for scholarship Administration
5. Create a Platform by incorporation modules for E-learning

PLATFORMS:

• HTML,CSS
• Java Script
• Star UML

COURSE OUTCOME:
COI :Ability to describe the principles of product design and development In solving
engineering problems.

CO2:Ability to produce design specification through experimental works which


complies with the design project requirement.

CO3:Ability to analyze and demonstrate design specifications through experimental


works and communicate effectively with the community.

CO4:Ability to demonstrate the ability to collaborate among team members.

REFERENCES:
1. Gay, Greg et al. Web Accessibility for Developers, Ryerson University Pressbooks, 2019.

2. Holzschlag, Molly. Color for Websites, RotoVision, 2001.

3. Andrew, Rachel. The New CSS Layout , A Book Apart, 2017.


TABLE OF CONTENTS

S. DATE PROJECT TITLE MARKS SIGN


AWARDED
NO

01 16.2.24 ONLINE BOOK STORE

02 13.3.24 HEALTH MONITORING SYSTEM

03 27.3.24 BUSINESS PORTFOLIO

04 17.4.24 SCHOLARSHIP MANAGEMENT

05 10.5.24 E - LEARNING SYSTEM

MARK EVALUATION:

OBSERVATION(30) RECORD MODEL(15) TOTAL (60)

(15)
Ex.No.1
ONLINE BOOK STORE

AIM

To develop the website for online Bookstore.

I.PROBLEM STATEMENT

The online bookstore faces several challenges related to its operations, customer
experience, and competition. These challenges include: The online bookstore
needs to manage its inventory efficiently, keeping track of stock levels, product
availability, and order fulfilment. This can be challenging, especially during peak
seasons or when there are unexpected demand spikes. Customers expect a
seamless experience when browsing and purchasing books online. The online
bookstore needs to ensure that its website is easy to navigate, search, and filter
products. Additionally, it must offer various payment options, shipping methods,
and customer support channels.

II.SOFTWARE REQUIREMENT SPECIFICATION

1 Introduction

1.1 Purpose

The purpose of this Software Requirements specification (SRS) is to fully


document the specifications and requirements for the Online Bookstore. The
Online Bookstore is meant as a way for customers to browse books on the
website and buy them from home without the need to travel to a bookshop.

5
1.2 Product Scope

This project’s scope is to create and implement a website for the bookstore. This
system is designed to provide automation support for the process of placing books
for sale on the Internet and facilitating the actual sale.

1.3 Definitions, Acronyms, and Abbreviations

• ISBN: International Standard Book Number, a unique identifier assigned


to books by the publisher.
• CRM: Customer Relationship Management, the practice of managing
interactions and relationships with customers, typically through the use of
software tools.
• OBS – Online Book Store.
• User -Customer, Publisher, and Administrator.
• Customer- a person who is purchasing a book.
• Publisher-person who prepares and issues books, journals, or music for
sale.
• Administrator/Admin-User having all the privileges to operate.

2. Overall Description

2.1 Product Perspective

The online bookstore should be easy for customers to navigate and find the books
they are looking for. Customers should be able to easily search for books using
keywords, filters, and other criteria. Customers should be able to read reviews
and ratings of books to help them make informed purchasing decisions.

2.2 Product Functions

This software includes details of books such as:

6
2.2.1 Browse and search for books

Customers should be able to browse and search for books by title, author, genre,
and other criteria.

2.2.2 Add items to cart

Customers should be able to add items to their virtual shopping cart as they
shop on the website.

2.2.3 Checkout

Customers should be able to finalize their purchase by entering billing and


shipping information, selecting a payment method, and reviewing their order
before submitting it.

2.2.4 View order history

Customers should be able to view their past orders and track the status of
their current orders.

2.3 User Classes and Characteristics

• Casual shoppers: These users browse the online bookstore occasionally and
make small purchases. They may not have an account on the website and
may not be familiar with all of its features.
• Regular Customers: These users have an account on the website and make
regular purchases. They are familiar with the website's features and may
use the search and browsing capabilities frequently.
• Heavy Users: These users spend a lot of time on the website, regularly
purchase multiple items and may take advantage of the personalized
recommendations.
• Administrators: These users are responsible for managing the online
bookstore's inventory, processing orders, and providing customer service.

7
They have access to the back-end of the system and use it to perform tasks
such as updating prices and removing out-of-stock items.

2.4 General Constraints

The online bookstore may have to comply with certain laws and regulations
related to e-commerce, data privacy, and online transactions. It may have a
deadline for when it needs to launch or a specific release date to meet. It needs to
be able to handle a large number of customers and transactions.

3. External Interface Requirements

3.1 User Interfaces

• This software starts with a login form.


• There is many pop - up menus in the main form which are enabled only
after the proper login.
• Each pop - up menu contains sub menus which will enable easy interaction

3.2 Hardware Interfaces

Processor : Intel core i3

Process speed : 1.7 GHz

Memory : 4GB

Hard drive : 443

3.3 Software Interfaces

Operating system : Windows 7,8 or 10

Front End : PHP

Back End : MYSQL

8
4. System Features

This system contains 5 modules in it. They are given below:

1. Authentication

2. Stock Details

3. Reviews and Ratings

4. Payment Details

5. Report generation

III.UML DIAGRAMS

1. Use case Diagram:-

9
2. Class Diagram:-

3. Sequence Diagram:-

10
4. State chart diagram:-

5. Activity diagram:-

11
6. Component Diagram :-

7. Deployment diagram:-

12
8. Package diagram:-

SOURCE CODE Home.html


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bookstore - Home</title>
<style> body {
font-family:timesnow;
margin: 0;

13
padding: 0; }
header { background-color:
#F5A623; color: black;
padding: 30px;
font-weight: bold;
text-align: center;
} nav {
background-color: #0000ff;
color: #fff; padding: 10px
0; text-align: center;
} nav a {
color: black; text-
decoration: none;
margin: 0 10px;
}
nav a:hover { text-
decoration: underline;
} section {
padding: 20px;
text-align: center;
}
.book { display:
inline-block; margin:
50px;
} footer {
background-color: #000080;
color: black;

font-size:20px;
padding: 10px 0;
text-align:right-side;
position: static;
bottom: 10px; width:
100%;
}
14
</style>
</head>
<body>
<header>
<h1>SHAN BOOKS </h1>
<h1>Welcome to Our Bookstore </h1>
</header>
<nav>
<a href="C:\Users\Rohit\Desktop\dp1\ex1.html">Home</a>
<a href="C:\Users\Rohit\Desktop\dp1\reg.html">Registration</a>
<a href="C:\Users\Rohit\Desktop\dp1\cart.html">My cart</a>
<a href="C:\Users\Rohit\Desktop\dp1\pay.html">Payment</a>
</nav>
<section>
<h2>Featured Books</h2>
<div class="book">
<h3>Python programming</h3>
<p>Author: Jasmine Pythia</p>
<img src="book1.jpg" alt="Book 1">
<p>Description: Python Programming Course From Basic</p>
<p>To Advance Level Please Download a Pdf File and
Make You To A</p>
<p>Professional Python Developer Or Freelancer.</p>
</div>
<div class="book">
<h3>C++ course</h3>
<p>Author: Maximillon Codeborne</p>
<img src="book2.jpg" alt="Book 2">
<p>Description: Advance C++ Course in Simple English Language</p>
<p>Please Download A Pdf From Here and Gain Your
Knowledge in C++</p>
</div>
<div class="book">
<h3>Machine learning</h3>
15
<p>Author: Elias Dataforge</p>
<img src="book3.jpg" alt="Book 3">
<p>Description:Advance Machine learning Course From Pdf File </p>
<p>Please Download This File From Here and You</p>
<p>Have From Zero To Hero In Machine learning.</p>
</div>
<div class="book">
<h3>Cloud computing</h3>
<p>Author: Luna Cloudweaver</p>
<img src="book4.jpg" alt="Book 3">
<p>Description:This Is A Book For Cloud computing. Beginner</p>
<p>Friendly all Things need for beginners there in pdf book mentioned</p>
<p>please Download and gain knowledge about Cloud
computing.</p>
</div>
</section>
<script>
</script>
<footer class="bg-dark py-3">
<div class="container">
<div class="row ">
<div class="col-md-6 text-light">
<h5>About Us</h5>
<p>We are an online bookstore offering a wide selection of books for all ages
and interests.</p>
</div>
<div class="col-md-3 text-light">
<h5>Contact</h5>
<ul class="list-unstyled">
<li><a href=" mailto:[email protected]">Gmail</a></li>
<li><a href="tel:+918879004874">Phone</a></li>
<li><a href="https://maps.app.goo.gl/QNQ95q6arqKdRxWf9"
target="_blank">GPS Location</a>
<p>51,RKK nagar, NK palayam ,Singanallur,Coimbatore ,Tamil Nadu-

16
641033</p>
</li>
</ul>
</div>
</div
</div>
</footer>

</body>
</html>

Reg.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-
Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6J
Xm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-
KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG
5KkN" crossorigin="anonymous"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-
ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q
" crossorigin="anonymous"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-

17
JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl
" crossorigin="anonymous"></script>
<script src="form-validation.js"></script>
</head>
<style>
h1{
background-color: #F5A623;
color: #fff;
padding: 20px; text-
align: center;
}
</style
<body>
<h1 class="text-center">SHAN BOOKS</h1>
<div class="container">
<h2>Register</h2>
<form>
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name"
ariadescribedby="nameHelp" placeholder="Enter your name">
</div>
<div class="form-group">
<label for="email">Email address</label>
<input type="email" class="form-control" id="email"
ariadescribedby="emailHelp" placeholder="Enter your email">
</div>
<div class="form-group">
<label for="email">Phone no</label>
<input type="number" class="form-control" id="number"
ariadescribedby="number" placeholder="Enter your number">
</div>
<div class="form-group">
<label for="email">Bookname and Author</label>
18
<input type="text" class="form-control" id="text" aria-describedby="text"
placeholder="Enter Bookname & Author">
</div>
<div class="form-group">
<label for="email">Billing address</label>
<input type="text" class="form-control" id="text" aria-describedby="text"
placeholder="Enter your address">
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Submit</button>
</html>

19
SCREENSHOTS Home page

Login and Register page

20
My cart page

Payment page

21
CONCLUSION

Online bookstore has many advantages compared to its counterparts such


as physical book store, the online bookstore allows it's user to shop at one place
where in physical store the books are scattered at the different places which
consumes a lot of time and online bookstore helps in saving that time and it also
avoids the problem of unavailability of books at physical store as numerous
vendors from different places sell their books at one place. This project is efficient
in maintaining users records and can perform operations on it, also reduces the
work load on the shop owner of knowing the quantity of books available and
which books are available and keeps the records of how many books are
purchased and sold.

22
Ex.No.2
HEALTH MONITORING SYSTEM

AIM

To develop the website for Health Monitoring System.

I.PROBLEM STATEMENT

A health monitoring system is needed to track and monitor an individual's


health parameters and provide real-time feedback to improve their overall
wellbeing. The system should be able to collect data from various sensors and
devices such as wearable devices, medical equipment, and other sources, and
use this data to provide insights on the individual's health status. The system
should also provide alerts and notifications for any critical health issues that
may require immediate attention.

II.SOFTWARE REQUIREMENT SPECIFICATION

1 Introduction

1.1 Purpose

The primary goal of a health monitoring system is to help individuals improve


their health and wellbeing by providing them with the tools to track their progress,
identify potential health issues early on, and make informed decisions about their
health.

23
1.2 Product Scope

The product scope of a health monitoring system refers to the boundaries and
features of the system that are included in its design and development. The
product scope outlines what the system will do and what it will not do.

1.3 Definitions, Acronyms, and Abbreviations

• Health Monitoring System: A system that tracks and monitors an


individual's health parameters and provides real-time feedback to improve
their overall wellbeing.
• Sensors: Electronic devices that detect changes in physical parameters,
such as temperature, humidity, and pressure, and convert them into
electrical signals.
• EHR: Electronic Health Record, a digital version of a patient's medical
record that includes information about their medical history, diagnoses,
medications, and other healthcare-related information.
• IoT: Internet of Things, a system of interconnected devices that can
exchange data over the internet.
• BPM: Beats Per Minute, a unit of measurement for heart rate.
• SpO2: Peripheral Capillary Oxygen Saturation, a measure of the amount of
oxygen in the blood.
• BMI: Body Mass Index, a measure of body fat based on height and weight.

2. Overall Description

2.1 Product Perspective

The product perspective of a health monitoring system describes how the system
fits into the larger context of healthcare and technology.

24
2.2 Product Functions

This software includes details of health data such as:

2.2.1 Health Data Collection

The system should collect data from various sources, such as wearables, medical
devices, and mobile apps, to track an individual's health parameters, such as heart
rate, blood pressure, and activity level.

2.2.2 Data Analysis

The system should analyse the collected data to identify trends, patterns,
and abnormalities in an individual's health status. This can help individuals and
healthcare providers make informed decisions about their health and wellbeing.

2.2.3 Alerting and Notifications

The system should provide alerts and notifications to individuals and


healthcare providers if abnormalities or emergencies are detected. For example,
the system may notify healthcare providers if an individual's blood pressure
reaches a dangerous level.

2.2.4 Real-Time Feedback

The system should provide real-time feedback to individuals to help them make
healthier choices and improve their health parameters. For example, the system
may provide reminders to take medication, exercise, or drink more water.

2.3 User Classes and Characteristics

• Individuals: The primary user class of a health monitoring system is


individuals who want to track and monitor their health status. These
individuals may have various characteristics, such as age, gender, health
conditions, and fitness levels.

25
• Caregivers: Caregivers, such as family members or healthcare
professionals, may also use a health monitoring system to track the health
status of their loved ones or patients. Caregivers may have different user
characteristics than individuals, such as medical knowledge, access to
medical devices, and communication skills.
• Healthcare Providers: Healthcare providers, such as doctors or nurses,
may use a health monitoring system to monitor the health status of their
patients remotely and provide personalized recommendations. Healthcare
providers may have different user characteristics than individuals or
caregivers, such as medical training, access to electronic health records,
and regulatory compliance knowledge.

2.4 General Constraints

Health monitoring systems can have various general constraints that affect
their design, development, and deployment. It must comply with privacy and
security regulations to protect users' personal health information (PHI) from
unauthorized access, use, or disclosure. It must be compatible with various
hardware, software, and network systems to ensure seamless data collection,
analysis, and sharing.

3. External Interface Requirements

3.1 User Interfaces

• Dashboards: Some health monitoring systems provide a dashboard as the


primary user interface. Dashboards are graphical user interfaces that
provide an overview of the system's data and metrics, such as vital signs
or activity levels. Dashboards can include various UI elements, such as
graphs, tables, and widgets.
• Wearables: Some health monitoring systems provide wearables as the
primary user interface. Wearables are small electronic devices that can be

26
worn on the body, such as smartwatches or fitness trackers. Wearables can
include various UI elements, such as touchscreens, buttons, and haptic
feedback.
• Mobile Apps: Many health monitoring systems provide a mobile app as
the primary user interface. Mobile apps allow users to access the system's
features and functions on their mobile devices, such as smartphones or
tablets. Mobile apps can include various UI elements, such as menus,
buttons, forms, and charts.

3.2 Hardware Interfaces


Processor : Intel core i3

Process speed : 1.7 GHz

Memory : 4GB

Hard drive : 443


3.3 Software Interfaces

Operating system : Windows 7,8,10 or 11

Front End : HTML, BOOTSTRAP, JS

Back End : MYSQL

4. System Features

This system contains 4 modules in it. They are given below:

1. Home

2. Dashboard

3. About

4. Contact
III.UML DIAGRAMS

27
1. Use case Diagram:-

2. Class Diagram:-

28
3. Sequence Diagram:-

4. State Chart Diagram:-

29
5. Activity Diagram:-

6. Component Diagram:-

30
7. Deployment Diagram:-

SOURCE CODE

Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Health Monitoring System</title>
<style>
body {
background-image:url('https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcSRz7dF9OPrws2dRsOzhZGDUoUN5r2QwUTdSg
&s');
background-size:1500px 900px;

font-family: Arial, sans-serif;


margin: 0; padding: 0;
background-color: #f2f2f2;

31
}
header {

background-
image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAk
//9k=);
background-size: 1500px 900px;
background-repeat:no-repeat;

background-position: center;

color: white;

padding: 20px;
text-align: center;
}

.container {

max-width: 1200px;
margin: 0 auto; padding:
20px;
}
h1 {
text-align: center; margin-
bottom: 30px;
}
.service {
background-image:url('https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcQBjstNgeHEz8kRNuIG7ShL70WCoJzJYVGumQ&
s');
background-size:900px 700px;

margin-bottom: 50px;
padding: 20px; background-
color: #fff; border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
32
}
.service img {
max-width: 100%;
height: auto; border-
radius: 0px; margin-
bottom: 0px;
}
.service h2 {
text-align: center;
}
.service p {

text-align: center;
}
p{

font-size:20px;

font-weight:bold;

color: black;

footer {

background-color: #000080;
color: black;
font-size:30px;

padding: 10px 0;
text-align:right-side;
position: static;
bottom: 10px; width:
100%;

33
</style>
<header>

</head>
<body>
<h1>Welcome to Health Monitoring System</h1>
</header>
<div class="container">
<div class="service">
<img src="C:/Users/Rohit/Desktop/dp4/ptm.jpg" alt="Patient Monitoring">
<h2>Patient Monitoring</h2>

<p>Our patient monitoring system tracks vital signs, detects anomalies, and
alerts medical staff of any concerning changes in patients' conditions.</p> </div>

<div class="service">
<img src="C:/Users/Rohit/Desktop/dp4/eqgs.jpg" alt="Equipment Maintenance">
<h2>Equipment Maintenance</h2>

<p>We ensure that all medical devices are regularly inspected, calibrated, and
maintained to the highest standards.</p>
</div>
<div class="service">
<img src="C:/Users/Rohit/Desktop/dp4/pda.jpg" alt="Data Analytics">
<h2>Data Analytics</h2>
<p>We collect and analyze healthcare data to provide actionable insights for hospital
administrators and medical staff.</p>
</div>
</div>
<footer class="bg-dark py-3">
<div class="container">
<div class="row ">
<div class="col-md-3 text-light">

34
<h5>About</h5>
<ul class="list-unstyled">
<li><a href=" C:/Users/Rohit/Desktop/dp4/home4.html">Login</a></li>
<li><a href="
C:/Users/Rohit/Desktop/dp4/cont4.html">Contact</a></li>
</ul>
</div>
</div
</div>
</footer>

</body>
</html>

Login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Health Monitoring System</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0; padding: 0;
background-color: #f2f2f2;
}
.container {
max-width: 1200px; margin:
0 auto;

padding: 20px;

35
} h1 { text-
align: center; margin-
bottom: 30px;
}
.login-form { max-width: 400px;
margin: 0 auto; background-color:
#fff; padding: 20px; border-
radius: 8px; box-shadow: 0 0 10px
rgba(0,0,0,0.1);
}
.login-form h2 { margin-
bottom: 20px; text-align:
center;
}
.login-form input[type="text"],
.login-form input[type="password"] {
width: 100%; padding: 10px;
margin-bottom: 20px; border: 1px
solid #ccc; border-radius: 4px;
box-sizing: border-box;
}
.login-form input[type="submit"]
{ width: 100%;
background-color: #4caf50;
color: #fff; padding: 10px;
border: none;

border-radius: 4px;
cursor: pointer;
font-size: 16px;
} button{
background-color: #45a049;
text-align: center;
padding:10px; font-size:20px;
}
36
.login-form p {
text-align: center;
}
.image-container {
display: flex; justify-
content: center; margin-
top: 50px;
}
.image-container img {
width: 300px;
height: auto; margin:
0 10px;
}
</style>
</head>
<body>

<div class="container">
<h1>Welcome to Health Monitoring System</h1>

<div class="login-form">
<h2>Patient Login</h2>
<form action="#" method="post">
<input type="text" name="username" placeholder="Username" required>
<input type="password" name="password" placeholder="Password" required>
<a href="C:\Users\Rohit\Desktop\dp4\ex4.html"> <button type="button" class="btn
btn-primary">Submit</button></a>
</form>
<a href="C:\Users\Rohit\Desktop\dp4\regs.html"><p>Don't have an account?
Sign up</p></a>
</div>

<div class="image-container">
<img src="C:/Users/Rohit/Desktop/dp4/pt.jpg" alt="Health Monitoring">
37
<img src="C:/Users/Rohit/Desktop/dp4/eq.jpg" alt="Medical Devices">
<img src="C:/Users/Rohit/Desktop/dp4/da.jpg" alt="Data Analysis">
</div>
</div>

</body>
</html>

Register.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-
Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6J
Xm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-
KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG
5KkN" crossorigin="anonymous"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fak
FPskvXusvfa0b4Q

" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-
JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl
" crossorigin="anonymous"></script>
<script src="form-validation.js"></script>
</head>
<style>
body
{

38
background-image:url('https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcSRz7dF9OPrws2dRsOzhZGDUoUN5r2Qw
UTdSg&s');
background-size:1500px 900px;
color:white;
h1{
background-
image:url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAp
DoxViSkNFBRrCjJDoxVmsDUOthswGo2tjWY1AGtjWTMQaCkWAtBQHAA0FE
kMli0DRNUDGowM//9k='); background-size:1500px 900px;
background-color: #F5A623;
color: white;
padding: 20px; text-
align: center;
}
</style
<body>
<h1 class="text-center">PATIENT SIGN-IN</h1>
<div class="container">
<h2>Register</h2>
<form>
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name"
ariadescribedby="nameHelp" placeholder="Enter your name">
</div>
<div class="form-group">
<label for="email">Email address</label>
<input type="email" class="form-control" id="email"
ariadescribedby="emailHelp" placeholder="Enter your email">
</div>
<div class="form-group">
<label for="gender">Gender</label>

39
<input type="number" class="form-control" id="number"
ariadescribedby="number" placeholder="Enter your Gender">
</div>
<div class="form-group">
<label for="age">Age</label>
<input type="text" class="form-control" id="text" aria-describedby="text"
placeholder="Enter your Age">
</div>
<div class="form-group">
<label for="email">Address</label>
<input type="text" class="form-control" id="text" aria-describedby="text"
placeholder="Enter your address">
</div>
<div class="form-group">

<a href="C:\Users\Rohit\Desktop\dp4\ex4.html"><p>Submit</p></a>

40
Screenshots:

Home page:

Login page:

41
Sign in page:

Contact page:

42
CONCLUSION

In conclusion, a health monitoring system is a software-based solution that


enables individuals to track, monitor, and analyse their health-related data.
These systems provide users with valuable insights into their health status,
allowing them to make informed decisions about their lifestyle and
wellness. The development of a health monitoring system requires careful
consideration of various factors, such as user needs and expectations,
regulatory compliance, and technical feasibility. The system's design and
development should prioritize usability, reliability, accuracy, affordability,
and ethical and legal compliance to ensure that users receive trustworthy
health information and recommendations. User interfaces play a critical
role in the success of a health monitoring system. The UI should be
userfriendly, visually appealing, and intuitive, providing users with a
positive experience and encouraging user adoption and engagement.
43
Ex. No.3
BUSINESS PORTFOLIO

AIM

To develop the website for Business Portfolio.

I.PROBLEM STATEMENT

Business portfolio refers to the specific challenges or issues that a company


is facing in managing its portfolio of businesses, products, and services. Some
common problems that companies may face when managing their business
portfolio include:

1. Lack of product-market fit: The company's products or services may not


align with the needs and preferences of the target market, leading to low
sales and revenue.

2. Changing consumer trends: Consumer preferences and trends can change


rapidly, making it necessary for companies to adapt their portfolios to stay
relevant and competitive

3. Competitive threats: New competitors may enter the market or existing


ones may improve their products or services, making it difficult for the
company to maintain its market position.

II.SOFTWARE REQUIREMENT SPECIFICATION

1. Introduction

1.1 Purpose

A business portfolio is a collection of businesses, products, and services that a


company offers to the market. The purpose of a business portfolio is to help a
44
company manage its various businesses and products effectively, by assessing
their performance and identifying opportunities for growth and development.

1.2 Product Scope

The product scope for a business portfolio refers to the range of products and
services that a company offers within its portfolio. A company's product scope
may include products or services that are related to each other or may be
completely unrelated.

1.3 Definitions, Acronyms, and Abbreviations

• Business Portfolio: A collection of businesses, products, and services that


a company offers to the market.
• HTML - Hypertext Markup Language
• CSS - Cascading Style Sheets
• JavaScript - A programming language used to create interactive effects
within web browsers
• UI - User Interface
• UX - User Experience
• CMS - Content Management System
• MVC - Model-View-Controller
• API - Application Programming Interface
• SDK - Software Development Kit
• IDE - Integrated Development Environment
• SPA - Single Page Application
• PWA - Progressive Web App
• Hybrid App - A mobile application that combines elements of native and
web applications
• Native App - A mobile application designed specifically for a particular
• Cross-Platform App - A mobile application that can be used on multiple
platforms or devices

45
2. Overall Description

2.1 Product Perspective

The product perspective of a business portfolio refers to the way a company


views and manages its products within the portfolio. This includes the strategic
decisions made about which products to include in the portfolio, how to position
them in the market, and how to manage them over time.

2.2 Product Functions

This software includes details of business such as:

2.2.1 Investment decision-making

A business portfolio can be used to help investors make informed decisions


about which companies to invest in, based on their portfolios of businesses,
products, and services. By analysing a company's portfolio, investors can gain
insight into its strengths, weaknesses, and overall performance.

2.2.2 Strategic planning

A business portfolio can be used as a tool for strategic planning, helping a


company to make informed decisions about which businesses and product lines
to prioritize, how to allocate resources, and how to achieve its long-term goals.

2.2.3 Risk management

A business portfolio can be used to manage risk by diversifying a


company's investments across multiple businesses and product lines. This helps
to reduce the impact of external factors that can affect individual businesses, such
as market fluctuations or changes in consumer behaviour.

46
2.2.4 Performance evaluation

A business portfolio can be used to evaluate the performance of a


company's various businesses and product lines, helping to identify areas of
strength and weakness. This can help a company to make informed decisions
about which businesses and product lines to invest in, and which ones to divest
or discontinue.

2.3 User Classes and Characteristics

• Business Owners: Business owners typically have a strong understanding


of their particular industry and are looking for a portfolio that can
effectively support their business needs. They need a portfolio that can help
them identify areas of opportunity and potential risks, as well as manage
their finances and investments. Characteristics: Knowledgeable, organized,
ambitious, analytical.
• Professionals: Professionals are looking for a portfolio that can help them
manage their finances in the most efficient manner possible. They are
looking for a portfolio that can help them maximize their returns, with
minimal effort and risk. Characteristics: Practical, organized, analytical,
data-driven.
• Investors: Investors are looking for a portfolio that will provide them with
profitable returns and/or a reliable source of income. They need a portfolio
that is well diversified and can be easily managed over time.
Characteristics: Risk-averse, patient, disciplined, data-driven.

2.4 General Constraints

The business portfolio may have to comply with certain laws and
regulations related to e-commerce, data privacy, and online transactions. It may
have a deadline for when it needs to launch or a specific release date to meet. It
needs to be able to handle a large number of customers and transactions.

47
3. External Interface Requirements

3.1 User Interfaces

• Dashboard: This will be the main view of your business portfolio, giving
you an at-a-glance view of all of your investments, their performances, and
any other pertinent information.
• Portfolio Summary: This page will show an overview of your entire
portfolio, including risk profile, diversification, and total returns over time.
• Reports: This page will allow you to generate custom reports on your
portfolio, such as investment performance, portfolio allocation, and more.

3.2 Hardware Interfaces

Processor : Intel core i3

Process speed : 1.7 GHz

Memory : 4GB

Hard drive : 443

3.3 Software Interfaces

Operating system : Windows 7,8,10 or 11

Front End : HTML, CSS, JS

4. System Features

This system contains 5 modules in it. They are given below:

1. Home

2. Services
3. Projects

4. Contact

48
III.UML DIAGRAMS

1. Use case Diagram:-

2. Sequence Diagram:-

49
3. State Diagram:-

4. Activity Diagram:-

50
6. Component Diagram:-

7. Deployment Diagram:-

51
SOURCE CODE Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Business Portfolio</title>
<style>
body {
background-
image:url('https://static.vecteezy.com/system/resources/thumbnails/027/193/230/small
_2x/gradient-color-background-animation-free-video.jpg');
background-size:1500px 900px; color black;
font-family: Arial, sans-serif;
margin: 0; padding: 0;
}
header {
background-image:url(https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcQMWx9VYma0W7knR6z_h6CHFZIt6DYIz
PcPsg&s);
background-size: 1500px 900px;
background-repeat:no-repeat;
background-position: center;
color:
black; padding: 20px;
text-align: center;
} nav {
background-color: #4169E1;
padding: 10px; text-align:
center;
} nav a { color:
black ; text-decoration:
underline ; margin: 0
10px;
52
}
section {
background-image:url('https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcTWWax6fI1O2osFXW46sJOJXLALQiJTsB
EntQ&s'); background-size: 500px 200px;
background-repeat:no-repeat;
background-position: center;
padding: 20px;
color:black;
font-size:20px;
}
p{
text-align:center;
color: black; font-
weight:bold; font-size:40px;
}
h2{
text-align:center;
}
.center {
text-align: center;
}
button{
padding:10px;
}
footer {
background-color: #333;
color: #fff; text-align:
center; padding: 10px;
position: fixed; bottom:
0; width: 100%;
}
</style>
<header>
53
</head>
<body>
<h1>TECH WORLD</h1>

</header>
<nav>
<a href="C:/Users/Rohit/Desktop/dp2/ser.html">Services</a>
<a href="C:/Users/Rohit/Desktop/dp2/prj.html">Projects</a>
<a href="C:/Users/Rohit/Desktop/dp2/cont.html">Contact</a>
</nav>
<section id="about">
<h1>TECH WORLD</h1>
<p>WEB DEVELPOMENT</p>
</section>
<h2>
Web development refers to the creating, building, and maintaining of
websites.
It includes aspects such as web design, web publishing, web
programming, and database management.
It is the creation of an application that works over the internet
</h2>
<div class="center">
<button style="background-color: green; color: white;">Get started</button>
</div>
<footer>

&copy; TECH WORLD

</footer>
</body>
</html>

Service.html:
<!DOCTYPE html>
54
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web Development Services</title>
<style>
/* Add your CSS styles here */
body {
background-
image:url(https://static.vecteezy.com/system/resources/thumbnails/027/193/230/small
_2x/gradient-color-background-animation-free-video.jpg);
background-size: 1500px 900px;
background-repeat:no-repeat;
background-position: center;
font-family: Arial, sans-serif;
margin: 0; padding: 0;
}

header {
background-image:url(https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcQMWx9VYma0W7knR6z_h6CHFZIt6DYIz
PcPsg&s); background-size: 1500px 900px;
background-repeat:no-repeat;
background-position: center;
color: black;
padding: 20px; text-
align: center;
}
h1 {
margin-top: 0;
}

.container {
width: 80%;
55
margin: 0 auto;
padding: 20px;
}

.service {
margin-bottom: 20px;
border: 1px solid #ccc;
padding: 20px;
}

.service h2 {
margin-top: 0;
}
</style>
</head>
<body>
<header>
<h1>Web Development Services</h1>
</header>

<div class="container">
<div class="service">
<h2>Custom Website Design</h2>
<p>We create unique and responsive website designs tailored to your business
needs. Our designs are visually appealing, user-friendly, and optimized for all
devices.</p>
</div>

<div class="service">
<h2>Web Application Development</h2>
<p>Our team specializes in developing custom web applications using the
latest technologies. From e-commerce platforms to content management systems, we
build solutions that help your business thrive online.</p>
</div>
56
<div class="service">
<h2>Website Maintenance and Support</h2>
<p>Once your website is live, we provide ongoing maintenance and support
services to ensure its smooth operation. From regular updates to troubleshooting,
we've got you covered.</p>
</div>

<div class="service">
<h2>SEO and Digital Marketing</h2>
<p>Boost your online visibility and attract more customers with our SEO
and digital marketing services. We'll help you optimize your website for search
engines and create effective marketing strategies to reach your target audience.</p>
</div>
</div>
</body>
</html>
Project.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Our Projects</title>
<style>
/* Add your CSS styles here */
body {
background-
image:url(https://static.vecteezy.com/system/resources/thumbnails/027/193/230/small
_2x/gradient-color-background-animation-free-video.jpg);
background-size: 1500px 900px;
background-repeat:no-repeat;
background-position: center;

57
font-family: Arial, sans-serif;
margin: 0; padding: 0;
}

header {
background-image:url(https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcQMWx9VYma0W7knR6z_h6CHFZIt6DYIz
PcPsg&s);
background-size: 1500px 900px;
background-repeat:no-
repeat; background-position: center;
background-color: #333; color: #fff;
padding: 20px; text-align: center;
}
h1 {
margin-top: 0;
}

.container {
width: 80%;
margin: 0 auto;
padding: 20px;
}

.project { margin-
bottom: 40px;
}

.project img {
max-width: 300px;
height: 150px; display:
inline-block; margin-
bottom: 10px;
}
58
.project h2 {
margin-top: 0;
}

.project p {
font-size 20Px;
font-weight: bold;
margin-bottom: 0;
}
</style>
</head>
<body>
<header>
<h1>Our Projects</h1>
</header>

<div class="container">
<div class="project">
<img src="C:\Users\Rohit\Desktop\dp2\prj1.jpg" alt="Project 1">
<h2>Health Monitoring</h2>
<p>Health Monitoring provides software services that collect and
analyze healthcare data to illuminate complex, large-scale health issues. .</p>

<div class="project">
<img src="C:\Users\Rohit\Desktop\dp2\el.jpg" alt="Project 2">

<h2>E-Learning</h2>
<p>eLearning, also known as electronic learning or online learing, is the
delivery of learning and training through digital resources..</p>
</div>
</div>
</body>
</html>
59
SCREENSHOTS HOME PAGE

SERVICE PAGE

60
PROJECT PAGE

CONTACT PAGE

61
CONCLUSION

A business portfolio is a collection of a company's products, services, and


business units, and it is crucial to the success of the company. By analysing its
portfolio, a company can identify areas where it may need to invest more
resources, divest from less profitable areas, and develop strategies to maximize
profits and growth. A well-managed portfolio helps a company maintain a
competitive advantage and stay relevant in its industry. It is important for a
company to regularly review and update its portfolio to adapt to changing market
conditions and meet customer needs. Overall, a strong business portfolio is
essential for a company's long-term success.

62
Ex.No.4
SCHOLARSHIP MANAGEMENT SYSTEM

AIM

To develop the website for Scholarship Management System.

I.PROBLEM STATEMENT

Scholarship Management system is essential for educational institutions


to manage their scholarship programs efficiently. The current manual system of
managing scholarships is time-consuming, prone to errors, and lacks
transparency. The institution has to collect and manage data of eligible students,
their academic performance, financial status, scholarship amounts, and disbursal
of funds, which involves a lot of paperwork and manual effort.

This manual process of collecting and verifying data, shortlisting eligible


candidates, and disbursing funds to scholarship recipients is prone to errors, and
often, deserving candidates miss out on scholarship opportunities. Moreover, the
lack of transparency in the process creates doubts and mistrust among students
and parents, leading to a negative impact on the institution's reputation.

Therefore, there is a need for an automated Scholarship Management


System that can streamline the entire process, from application submission to
fund disbursal, and ensure transparency, efficiency, and accuracy. The system
should be user-friendly, accessible to all stakeholders, and provide real-time
updates on the application status, scholarship amount, and fund disbursal.

63
II.SOFTWARE REQUIREMENT SPECIFICATION

1 Introduction

1.1 Purpose

The purpose of the Scholarship Management System is to streamline and


automate the entire process of managing scholarships in educational institutions.
The system aims to eliminate the manual effort and paperwork involved in the
current system, which is prone to errors and lacks transparency. The system is
designed to be user-friendly, accessible, and efficient, and provide real-time
updates to all stakeholders involved in the scholarship process.

1.2 Product Scope

The product scope of the Scholarship Management System includes all the
features and functionalities that are required to manage scholarships efficiently
and effectively. Application Submission, Eligibility Check, Shortlisting,
Awarding Scholarships, Disbursal of Funds, Reporting and Analytics, Security
and Access Control, User Interface, Integration.

1.3 Definitions, Acronyms, and Abbreviations

• Scholarship: Financial aid awarded to a student to support their education


and academic achievements.
• Eligibility Criteria: The set of requirements that a student must meet to be
considered eligible for a scholarship.
• SMS: Scholarship Management System.
• SIS: Student Information System.
• FMS: Financial Management System.
• GPA: Grade Point Average.
• Disbursal of Funds: The process of transferring scholarship funds from
the institution to the student's account.

64
2. Overall Description

2.1 Product Perspective

The Scholarship Management System will provide an efficient and transparent


scholarship management process for educational institutions, students, and
parents. The system will reduce the manual effort involved in the scholarship
management process, increase efficiency, and provide real-time updates to all
stakeholders involved.

2.2 Product Functions

This software includes details of Scholarship data such as:

2.2.1 Application Submission

The SMS will allow students to submit their scholarship applications online. The
system will validate the application and provide feedback to the student if any
information is missing or incorrect.

2.2.2 Eligibility Check

The SMS will automatically filter out ineligible candidates based on


predefined eligibility criteria. The system will notify the candidates who do not
meet the criteria and provide them with feedback.

2.2.3 Shortlisting

The SMS will automate the process of shortlisting eligible candidates


based on predefined criteria. The system will notify the shortlisted candidates of
their selection status.

2.2.4 Awarding Scholarships

The SMS will generate an automated list of scholarship recipients and the
amounts awarded based on the predefined criteria. The system will notify the
scholarship recipients of their selection and the amount awarded.

65
2.2.5 Disbursal of Funds

The SMS will have a mechanism for tracking the disbursal of funds and ensuring
that the funds are disbursed to the right candidate at the right time.

2.3 User Classes and Characteristics

• Students: Students will be the primary users of the SMS. They will use
the system to apply for scholarships, check their application status, and
receive updates on the scholarship process. They will be tech-savvy,
comfortable with using web-based applications, and will have basic
knowledge of the scholarship application process.
• Scholarship Committees: Scholarship committees will use the SMS to
evaluate scholarship applications, shortlist candidates, and award
scholarships. They will have in-depth knowledge of the scholarship
application process and will have a strong background in education or
scholarship management.
• Institution Administration: The institution's administration will use the
SMS to oversee the scholarship management process, configure the
eligibility criteria, shortlisting criteria, and awarding criteria. They will
have administrative privileges and will be responsible for the overall
management of the scholarship process.

2.4 General Constraints

The Scholarship Management System (SMS) may have some general


constraints, it must be scalable to accommodate a growing number of users and
scholarship applications. The system must be able to handle the load without
compromising on performance and responsiveness. The System must be
developed and deployed within a specified timeline to ensure that the system is
available for the upcoming scholarship season.

66
3. External Interface Requirements

3.1 User Interfaces

• Dashboard: The SMS dashboard will provide a summary of the


scholarship process, including the number of applications received, the
status of the applications, and the number of scholarships awarded. The
dashboard will also have quick links to frequently used features of the
system.
• Application Form: The SMS application form will be easy to fill out and
will include all necessary fields to complete the application process. The
form will be responsive and mobile-friendly, allowing applicants to apply
from any device.
• Eligibility Criteria: The SMS will clearly outline the eligibility criteria for
each scholarship program, making it easy for students to understand
whether they qualify for the scholarship.

3.2 Hardware Interfaces

Processor : Intel core i3

Process speed : 1.7 GHz

Memory : 4GB

Hard drive : 443

3.3 Software Interfaces

Operating system : Windows 7,8,10 or 11

Front End : HTML, BOOTSTRAP, JS

67
4. System Features

This system contains 4 modules in it. They are given below:

1. Home

2. Profile

3. Application Form

4. Search for Scholarship

III.UML DIAGRAMS

1. Use case Diagram:-

2. Class Diagram:-

68
3. Sequence Diagram:-

4. State chart Diagram:-

69
5. Activity Diagram:-

6. Component Diagram:-

70
7. Deployment Diagram:-

Source Code:
Home.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Scholarship Application</title>
<style>
body {
background-
image:url('https
://encryptedtbn
0.gstatic.com/i
mages?q=tbn:
ANd9GcQpEpl
ByLimyQXZd
CYRp9Zm9D
XWqsVn
84EaGg&s');
background-size:1500px 900px;

71
font-family: Arial, sans-serif;
margin: 0; padding: 0;
background-color: #f2f2f2;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
header
{
background-
image:url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEA
AkGBxANDw8PDQ8NDxAPDw0PDw4PDQ8NDQ4PFREWFhYRFRUYHSggGB
DoxViSkNFBRrCjJDoxVmsDUOthswGo2tjWY1AGtjWTMQaCkWAtBQHAA0FE
kMli0DRNUDGowM//9k='); background-size:1500px 900px;
color: white;
padding: 20px;
text-align: center;
}
h1 {

text-align: center;
}
.form-container {
background-color: #fff;
padding: 20px; border-radius:
8px; box-shadow: 0 0 10px
rgba(0,0,0,0.1);

}
.form-container label {
display: block; margin-
bottom: 10px;
}
72
.form-container input[type="text"],
.form-container
input[type="email"], .form-container
select { width: 100%;
padding: 10px; margin-bottom:
20px; border: 1px solid #ccc;
border-radius: 4px; box-sizing:
border-box;
}
.form-container textarea {
width: 100%; padding:
10px; margin-bottom:
20px; border: 1px solid
#ccc; border-radius:
4px; box-sizing:
border-box;
}
.form-container input[type="submit"] {
width: 100%; background-color:
#4caf50; color: #fff;
padding: 10px; border: none;
border-radius: 4px; cursor: pointer;
font-size: 16px;
}
.form-container input[type="submit"]:hover {
background-color: #45a049;
}
.footer {
background-color: #333;
color: #fff; padding:
20px; text-align: center;
}
.footer img {
max-width: 100px;

73
height: auto; margin:
10px;
}
</style>
<header>
</head>
<body>
<h1>Apply for Scholarship</h1>
</header>
<div class="container">

<div class="form-container">
<form action="#" method="post">
<label for="fullname">Full Name</label>
<input type="text" id="fullname" name="fullname" required>

<label for="email">Email</label>
<input type="email" id="email" name="email" required>

<label for="phone">Phone Number</label>


<input type="text" id="phone" name="phone" required>

<label for="university">University</label>
<input type="text" id="university" name="university" required>

<label for="gpa">GPA</label>
<input type="text" id="gpa" name="gpa" required>

<label for="essay">Essay (Why do you deserve this scholarship?)</label>


<textarea id="essay" name="essay" required></textarea>

<label for="ifc code">Bank IFC code</label>


<input type="text" id="ifc code" name="ifc code" required>

74
<label for="Category">Scholarship Category</label>
<input type="text" id="Category" name="Category" required>

<a href="C:/Users/Rohit/Desktop/dp5/home.html" ><p>Submit</p></a>

</form>
</div>
</div>
</div>

</body>
</html>

75
Screenshots:
Home page:

Login.html:

76
Sign in.html:

Review.html:

77
CONCLUSION

In conclusion, the Scholarship Management System (SMS) is a web-based


platform designed to automate and streamline the scholarship application process.
The system will have various user classes, including students, parents,
scholarship committees, institution administration, financial aid officers, and
system administrators, each with their unique requirements. The SMS will have
a user-friendly interface, real-time updates, and notifications to keep all users
informed about the scholarship process. Additionally, the SMS will be developed
while considering general constraints, including security, compatibility,
scalability, compliance, accessibility, integration, time constraints, and budget.
The UI of the SMS will be designed to provide a user-friendly and intuitive
experience for all users. The SMS is expected to improve the scholarship
application process and help institutions provide scholarships to deserving
students more efficiently.

78
Ex.No.5
E-LEARNING

AIM

To develop the website for E-Learning.

I.PROBLEM STATEMENT

There is a growing demand for flexible and accessible education that


caters to the needs of learners of all ages and backgrounds. Traditional brickand-
mortar educational institutions often face challenges in meeting these demands
due to limited resources, infrastructure, and geographical constraints. As a
result, there is a need for an e-learning website that provides an innovative and
inclusive platform for learners to access high-quality educational resources from
anywhere in the world.

II.SOFTWARE REQUIREMENT SPECIFICATION

1.1 Purpose

A e-learning website is a collection of courses and experienced mentors. The


purpose of an e-learning website is to provide learners with a comprehensive and
inclusive learning environment that meets their needs and enables them to achieve
their educational and career goals.

1.2 Product Scope

The product scope of an e-learning website includes all the features,


functionalities, and services that the website provides to learners, instructors, and
administrators which includes course catalog, course materials, etc.

79
1.3 Definitions, Acronyms, and Abbreviations

• E-learning: The process of delivering educational content and resources to


learners through digital means, such as computers, tablets, or smartphones.
• LMS: Learning Management System
• MOOC: Massive Open Online Course
• VLE: Virtual Learning Environment
• CMS: Content Management System
• SCORM: Sharable Content Object Reference Model
• LCMS: Learning Content Management System
• Virtual classroom: A digital environment that simulates a physical
classroom, allowing instructors and learners to interact and collaborate in
real-time.

2. Overall Description

2.1 Product Perspective

The product perspective of an e-learning website involves understanding the


relationship between the website and its users, as well as its place within the
broader educational landscape.

2.2 Product Functions

This software includes details of courses such as:

2.2.1 Course creation and management

The website should allow instructors or administrators to create and manage


courses, including adding course materials, assessments, and assignments.

2.2.2 Course delivery

The website should enable learners to access course materials, complete


assignments and assessments, and communicate with instructors and peers.

80
2.2.3 Progress tracking and reporting

The website should track learners' progress through courses and provide
reports to instructors or administrators on learner performance.

2.2.4 Certification and credentialing

The website should enable learners to earn certifications or credentials


upon completing a course or program.

2.3 User Classes and Characteristics

• Learners: The primary user class of an e-learning website is learners.


Learners can be categorized by age, education level, or professional
background. They may have different learning preferences and goals,
ranging from acquiring new skills to earning a degree or certification.
• Instructors: Instructors are responsible for creating and delivering
educational content on the e-learning website. Instructors may have
different levels of experience and expertise, and may specialize in
different subjects or areas.
• Administrators: Administrators are responsible for managing the
elearning website and ensuring that it meets the needs of learners and
instructors. Administrators may include IT staff, educational
administrators, or program managers.

2.4 General Constraints

E-learning websites require resources to develop and maintain, including


funding, staffing, and infrastructure. It must provide high-quality content that is
relevant, engaging, and effective for learning. It may face barriers to access,
particularly for learners who lack reliable internet access or who have limited
digital literacy.

81
3. External Interface Requirements

3.1 User Interfaces

• Course dashboard: The website should provide a dashboard or landing


page for each course that displays important course information, progress
tracking, and links to course materials and assignments.
• Assessments and assignments: The website should enable instructors to
create assessments and assignments with different question types, such as
multiple-choice, fill-in-the-blank, and essay questions, and provide
feedback and grading features for instructors.
• Multimedia content: The website should enable instructors to add
multimedia content such as videos, images, and interactive simulations to
course materials, and provide easy-to-use playback and display controls
for learners.

3.2 Hardware Interfaces

Processor : Intel core i3

Process speed : 1.7 GHz

Memory : 4GB

Hard drive : 443

3.3 Software Interfaces

Operating system : Windows 7,8,10 or 11


Front End : HTML, BOOTSTRAP, JS

Back End : MYSQL

4. System Features

This system contains 5 modules in it. They are given below:

1. Categories
82
2. Courses

3. MyLearning

4. Community

5. Certificate generation

III.UML DIAGRAMS

1. Use case Diagram:-

2. Class Diagram:-

83
3. Sequence Diagram:-

4. State Chart Diagram:-

84
5. Activity Diagram:-

6. Component Diagram:-

85
7.Deployment Diagram:-

SOURCE CODE Login.html


Home.html:
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Neopat</title>

<!-- Bootstrap CSS -->

<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/twitterbootstrap/4.6.0/css/bootstrap.min.css">

<!-- Google Web Fonts -->

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

86
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

<link
href="https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600&family=Nunito:
wght@600;700;800&display=swap" rel="stylesheet">

<!-- Icon Font Stylesheet -->

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css"
rel="stylesheet">

<link href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css"
rel="stylesheet">

<!-- Libraries Stylesheet -->

<link href="lib/animate/animate.min.css" rel="stylesheet">

<link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">

<!-- Customized Bootstrap Stylesheet -->

<link href="css/bootstrap.min.css" rel="stylesheet">


<!-- Template Stylesheet -->

<link href="css/style.css" rel="stylesheet">

<script

src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>

<link rel="icon" type="image/x-icon" href="img/logo.jpg">

</head>

<body>

<!-- Navbar -->

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

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

<button class="navbar-toggler" type="button" data-toggle="collapse"


datatarget="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-
label="Toggle navigation">

87
<span class="navbar-toggler-icon"></span>

</button>

<div class="collapse navbar-collapse" id="navbarNav">

<ul class="navbar-nav">

<li class="nav-item active">

<a class="nav-link" href="C:\Users\Rohit\Desktop\dp3\index.html">login <span


class="sr-only">(current)</span></a>

</li>

<li class="nav-item">

<a class="nav-link" href="C:\Users\Rohit\Desktop\dp3\ex.html">Courses</a>

</li>

<li class="nav-item">
<a class="nav-link"
href="C:\Users\Rohit\Desktop\dp3\x.html">MyLearning</a>

</li>

<li class="nav-item">

<a class="nav-link"
href="C:\Users\Rohit\Desktop\dp3\ex.html">Community</a>

</li>

</ul>

<ul class="navbar-nav ml-auto">

<li class="nav-item">

<a class="nav-link" href="C:\Users\Rohit\Desktop\dp3\index.html">Log


out</a>

</li>

</ul>

88
</div>

</nav>

<!-- Categories Start -->

<div class="container-xxl py-5 category">

<div class="container">

<div class="text-center wow fadeInUp" data-wow-delay="0.1s">

<h6 class="section-title bg-white text-center text-primary px-3">Categories</h6>

<h1 class="mb-5">Courses Categories</h1>

</div>

<div class="row g-3">

<div class="col-lg-7 col-md-6">


<div class="row g-3">

<div class="col-lg-12 col-md-12 wow zoomIn" data-wow-delay="0.1s">

<a class="position-relative d-block overflow-hidden" href="">

<img class="img-fluid" src="C:\Users\Rohit\Desktop\dp3\web.avif"


alt="">

<div class="bg-white text-center position-absolute bottom-0 end-0 py-2


px-3" style="margin: 1px;">

<h5 class="m-0">Web Design</h5>

<small class="text-primary">301 Courses</small>

</div>

</a>

</div>

<div class="col-lg-6 col-md-12 wow zoomIn" data-wow-delay="0.3s">

<a class="position-relative d-block overflow-hidden" href="">

89
<img class="img-fluid" src="C:\Users\Rohit\Desktop\dp3\graphic.jpg"
alt="">

<div class="bg-white text-center position-absolute bottom-0 end-0 py-2


px-3" style="margin: 1px;">

<h5 class="m-0">Graphic Design</h5>

<small class="text-primary">101 Courses</small>

</div>

</a>

</div>

<div class="col-lg-6 col-md-12 wow zoomIn" data-wow-delay="0.5s">

<a class="position-relative d-block overflow-hidden" href="">


<img class="img-fluid" src="C:\Users\Rohit\Desktop\dp3\vedio.jpg"
alt="">

<div class="bg-white text-center position-absolute bottom-0 end-0 py-2


px-3" style="margin: 1px;">

<h5 class="m-0">Video Editing</h5>

<small class="text-primary">51 Courses</small>

</div>

</a>

</div>

</div>

</div>

<div class="col-lg-5 col-md-6 wow zoomIn" data-wow-delay="0.7s"


style="minheight: 350px;">

<a class="position-relative d-block h-100 overflow-hidden" href="">

<img class="img-fluid position-absolute w-100 h-100"


src="C:\Users\Rohit\Desktop\dp3\mark.jpg" alt="" style="object-fit: cover;">
90
<div class="bg-white text-center position-absolute bottom-0 end-0 py-2 px-3"
style="margin: 1px;">

<h5 class="m-0">Online Marketing</h5>

<small class="text-primary">151 Courses</small>

</div>

</a>

</div>

</div>

</div>

</div>
<!-- Categories end -->

<!-- Courses Start -->

<div class="container-xxl py-5">

<div class="container">

<div class="text-center wow fadeInUp" data-wow-delay="0.1s">

<h6 class="section-title bg-white text-center text-primary px-3">Courses</h6>

<h1 class="mb-5">Popular Courses</h1>

</div>

<div class="row g-4 justify-content-center">

<div class="col-lg-4 col-md-6 wow fadeInUp" data-wow-delay="0.1s">

<div class="course-item bg-light">

<div class="position-relative overflow-hidden">

<img src="C:\Users\Rohit\Desktop\dp3\webdev.jpg" alt="">

<div class="w-100 d-flex justify-content-center position-absolute bottom-0


start-0 mb-4">

91
<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3 borderend"
style="border-radius: 30px 0 0 30px;">Read More</a>

<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3"


style="border-radius: 0 30px 30px 0;">Join Now</a>

</div>

</div>

<div class="text-center p-4 pb-0">

<h3 class="mb-0">1490.00</h3>

<div class="mb-3">

<small class="fa fa-star text-primary"></small>


<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small>(123)</small>

</div>

<h5 class="mb-4">Web Design & Development</h5>

</div>

<div class="d-flex border-top">

<small class="flex-fill text-center border-end py-2"><i class="fa fa-user-tie


text-primary me-2"></i>Jiiva</small>

<small class="flex-fill text-center border-end py-2"><i class="fa fa-clock


text-primary me-2"></i>2.49 Hrs</small>

<small class="flex-fill text-center py-2"><i class="fa fa-user text-primary


me-2"></i>45 Students</small>

</div>

92
</div>

</div>

<div class="col-lg-4 col-md-6 wow fadeInUp" data-wow-delay="0.1s">

<div class="course-item bg-light">

<div class="position-relative overflow-hidden">

<img src="C:\Users\Rohit\Desktop\dp3\ms.jpg" alt="">

<div class="w-100 d-flex justify-content-center position-absolute bottom-0


start-0 mb-4">

<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3 borderend"


style="border-radius: 30px 0 0 30px;">Read More</a>

<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3"


style="border-radius: 0 30px 30px 0;">Join Now</a>

</div>

</div>

<div class="text-center p-4 pb-0">

<h3 class="mb-0">1999.00</h3>

<div class="mb-3">

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small>(120)</small>

</div>

<h5 class="mb-4">MS Office</h5>

93
</div>

<div class="d-flex border-top">

<small class="flex-fill text-center border-end py-2"><i class="fa fa-user-tie


text-primary me-2"></i>Fardeen</small>

<small class="flex-fill text-center border-end py-2"><i class="fa fa-clock


text-primary me-2"></i>3.49 Hrs</small>

<small class="flex-fill text-center py-2"><i class="fa fa-user text-primary


me-2"></i>49 Students</small>

</div>

</div>
</div>

<div class="col-lg-4 col-md-6 wow fadeInUp" data-wow-delay="0.1s">

<div class="course-item bg-light">

<div class="position-relative overflow-hidden">

<img src="C:\Users\Rohit\Desktop\dp3\cyber.jpg" alt="">

<div class="w-100 d-flex justify-content-center position-absolute bottom-0


start-0 mb-4">

<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3 borderend"


style="border-radius: 30px 0 0 30px;">Read More</a>

<a href="#" class="flex-shrink-0 btn btn-sm btn-primary px-3"


style="border-radius: 0 30px 30px 0;">Join Now</a>

</div>

</div>

<div class="text-center p-4 pb-0">

<h3 class="mb-0">9500.00</h3>

<div class="mb-3">

<small class="fa fa-star text-primary"></small>


94
<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small class="fa fa-star text-primary"></small>

<small>(203)</small>

</div>

<h5 class="mb-4">Cyber Security</h5>

</div>
<div class="d-flex border-top">

<small class="flex-fill text-center border-end py-2"><i class="fa fa-user-tie


text-primary me-2"></i>Tarun</small>

<small class="flex-fill text-center border-end py-2"><i class="fa fa-clock


text-primary me-2"></i>10.49 Hrs</small>

<small class="flex-fill text-center py-2"><i class="fa fa-user text-primary


me-2"></i>99 Students</small>

</div>

</div>

</div>

</div>

</div>

</div>

<!-- Courses End -->

<!-- Footer start -->

<footer class="bg-light py-5">

<div class="container">

<div class="row">
95
<div class="col-md-4">

<h4>About Us</h4>

<p>We are an online learning platform that offers courses in various


subjects.</p>

</div>

<div class="col-md-4">

<h4>Quick Links</h4>
<ul class="list-unstyled">

<li><a href="C:\Users\Rohit\Desktop\dp3\index.html">Home</a></li>

<li><a href="C:\Users\Rohit\Desktop\dp3\index.html">Courses</a></li>

<li><a href="C:\Users\Rohit\Desktop\dp3\enroll.html">MyLearning</a></li>

<li><a href="com.html">Community</a></li>

</ul>

</div>

<div class="col-md-4">

<h4>Contact Us</h4>

<p>123, Srit Street,<br>Srit, Coimbatore 641010,<br>Phone: (123) 456-


7890<br>Email: [email protected]</p>

</div>

</div>

<hr>

<p class="text-center">© 2023 eLearning Website. All Rights Reserved.</p>

</div>

</footer>

<!-- Footer end -->

96
</body>

</html>

Mylearning.html

<div class="container mt-4">

<div class="jumbotron">

<h1 class="display-4">Welcome to My Learning!</h1>


<p class="lead">Here you can track your progress, view your courses, and access
your certificates.</p>

<hr class="my-4">

<p>Get started by selecting a course from the list below.</p>

<a class="btn btn-primary btn-lg" href="#" role="button">View Courses</a>

</div>

<div class="row">

<div class="col-md-8">

<h2>My Courses</h2>

<p>You are currently enrolled in the following courses:</p>

<ul>

<li>Full Stack Web Development</li>

<li>Data Science</li>

<li>Cyber Security</li>

</ul>

</div>

<div class="col-md-4">

<h2>My Certificates</h2>

<p>You have earned the following certificates:</p>

97
<ul>

<li><a href="img/Ethical Hacking.jpg" target="_blank">Ethical


Hacking</a></li>

<li><a href="img/GuviCertification.png" target="_blank">Artificial


Intelligence</a></li>

</ul>
</div>

</div>

</div>

<section class="my-5">

<div class="container">

<div class="row">

<div class="col-md-6">

<h2>My Progress</h2>

<p>Track your progress and see how you're doing in your courses.</p>

</div>

<div class="col-md-6">

<div class="progress">

<div class="progress-bar" role="progressbar" style="width: 75%;"


ariavaluenow="75" aria-valuemin="0" aria-valuemax="100">75%</div>

</div>

<p class="mt-2 mb-0">Cyber Security</p>

<div class="progress">

<div class="progress-bar" role="progressbar" style="width: 50%;"


ariavaluenow="50" aria-valuemin="0" aria-valuemax="100">50%</div>

</div>

98
<p class="mt-2 mb-0">Data Science</p>

<div class="progress">

<div class="progress-bar" role="progressbar" style="width: 25%;"


ariavaluenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>

</div>
<p class="mt-2 mb-0">Full Stack Web Development</p>

<div class="progress">

<div class="progress-bar" role="progressbar" style="width: 5%;"


ariavaluenow="1" aria-valuemin="0" aria-valuemax="100">1%</div>

</div>

</div>

</div>

</div>

</section>

99
SCREENSHOTS

Login page:

Home page:

100
101
102
CONCLUSION

In conclusion, an e-learning website is a powerful tool for delivering


education and training to learners in a flexible and accessible format. With the
right design and implementation, an e-learning website can provide a wide range
of features and functionalities that enable learners to access course materials,
interact with instructors and peers, and track their progress and performance. Key
considerations for the design of an e-learning website include user needs and
preferences, technical constraints, and design principles such as navigation,
multimedia content, assessments and assignments, collaboration and
communication, personalization, mobile optimization, accessibility, and branding
and aesthetics. By carefully considering these factors and designing an e-learning
website that meets the needs of its users, educational institutions and
organizations can provide an effective and engaging learning experience that can
enhance the skills and knowledge of learners and support their professional
development.

103

You might also like