PROJECT REPORT

ON

“EYE CLINIC WEBSITE”

Submitted In The Partial fulfilment of Masters in

Computer Application

TO

UTTARANCHAL UNIVERSITY

Under the supervision :- Submitted By :-

Mr. Abhishek kumar pathak kavita Bhatt
Assistant professor Sanchit Bisht
MCA IIth Sem
(2020-22)

ACKNOWLEDGEMENT
 The most awaited moment of any Endeavour is successful completion, but nothing can be done
successfully if done alone. Success is the outcome of contribution and consistent help of various
persons and we thank those ones who helped us in the successful completion of this project.

We would like to thank Director of UIM Dr. Pradeep Suri for providing us with all the necessary
resources required to complete this project. We profusely are thankful to the department‘s head of the
Department, “Dr. SONAL SHARMA”and our guide “Mr. Abhishek Kumar Pathak”. Both have
been generous enough to provide us an opportunity and accepting our candidature for the most
valuable guidance and affordable treatment given to us at every stage to boost our morale.

Kavita Bhatt

Sanchit Bisht

DECLARATION
hereby declare that the project work entitled “Eye clinic website”submitted to the “Uttaranchal
Institute of management”, is a record of an original work done by me under the guidance of “Mr.
Abhishek kumar pathak” and this project work has not performed the basis for theawardof any

Degree or diploma/ associateship/fellowship and similar project if any .

Kavita Bhatt

Sanchit Bisht

CERTIFICATE OF ORIGINALITY
This is to certify that Kavita Bhatt And Sanchit Bisht
student of 2st semester, session 2020-22 has completed the
project Entitled.

“EYE CLINIC WEBSITE” using the HTML.CSS, PHP, JAVA Language and MySQL database,
under my guidance.

His work is satisfactory to be submitted for the fulfilment of award of degree of Master of
Computer Application.

Under the guidance of:

Mr. Abhishek kumar pathak

Asst. Prof.

Dept. Of Computer Application

Uttaranchal University, Dehradun

TABLE OF CONTENT
 ✓ Acknowledgement----------------------------------------------I

✓ Declaration------------------------------------------------------II

✓ Certificate-------------------------------------------------------II

✓ List Of Figure--------------------------------------------------IV
1. Introduction-------------------------------------------------------------------------------1
2. Objective ----------------------------------------------------------------------------------2
3. System Analysis--------------------------------------------------------------------------3
3.1. Identification of Need-------------------------------------------------------------3
3.2. Preliminary Investigation-------------------------------------------------------3-4
3.3. Feasibility Study-----------------------------------------------------------------5-6
3.4. Project Planning--------------------------------------------------------------------7
3.5. Project Scheduling--------------------------------------------------------------8-9
3.6. Software Requirement Specification---------------------------------------10
4. Data Models----------------------------------------------------------------------------11-13
 ER- Diagram----------------------------------------------------------------------------11
 UML Diagram--------------------------------------------------------------------------12-13
 USE CASE- Diagram---------------------------------------------------------------14
 ACTIVITY Diagram--------------------------------------------------------------15
 SEQUENCE Diagram-----------------------------------------------------------16-17
5. System Design--------------------------------------------------------------------------18
5.1. Modularization Detail----------------------------------------------------------18
5.2. User Interface Design ------------------------------------------------------20-21
5.3. Data integrity and constrains--------------------------------------------------22

6. Testing-----------------------------------------------------------------------------------23-24
6.1. Testing Techniques Used------------------------------------------------------23
6.2. Test Reports for Unit and System Test Case2---------------------------24

7. System Security measure--------------------------------------------------------------25

8. Future Scope-----------------------------------------------------------------------------26
9. Appendices------------------------------------------------------------------------------27-44
• Coding----------------------------------------------------------------------------------27-44
 Bibliography-----------------------------------------------------------------------------45
INTRODUCTION
This project “Eye Clinic Website” is website for eye clinic. This website is developed using HTML.CSS,
PHP, Visual Studio, SQL Database. User can get the details of doctors, facilities provided by the clinic.
User can also book appointment online using this website. User can also get the overview of the hospital,
images of the clinic in this website.

The frontend of the website is made very simple and easy, this website is made so simple that everyone
can use this website. eye clinic website is online booking appointment system is the developed using
Html.css, Php and MySQL.

Where patients can take appointment through online and track their records through it. The project eye
clinic is to provides patients or any customer an easy way of booking appointments .it can also maintain
list of doctors, available appointment time, book appointment. This project `provides the searching
facilities based on various factors doctors, test, eye treatments like (Glaucoma services, Orbit
services ,Computerised Eye Test, etc).

OBJECTIVE
Our website is user-friendly software. Through this project, we present a comprehensive solution
for booking appointment in the clinic. Therefore, the main purpose is to develop a website for
providing a platform for online booking appointment and checking checkup details.

It includes:-
 To provide the detail about facilities provided by clinic.
 To get appointment from anywhere.
 To keep the records of the patient.

SYSTEM ANALYSIS
System Analysis is a process of collecting and interpreting facts, identifying the problems and
decomposition of a system into its components.
System analysis is being conducted for the purpose of studying a system or its parts in order to
identify its objectives. It is a problem solving technique that improves the system and ensures
that all the components of the system work efficiently to accomplish their purpose.

3.1 IDENTIFICATION OF NEED:-

Our project Ramrati- Eye Clinic Website is a website which has developed to book an
appointment without going anywhere. It is very hard for the customer to book an appointment.
By using this website paperwork and man work of that place (Clinic) will be reduced and the
customer will be also satisfied by booking an appointment online. This system decreases the time
taken to complete the task.

3.2 PRELIMINARY STUDY:-

The current process of booking appointment is slow, requires the physical presence for booking
appointment if someone wants to get his\her eye checkup.So, we need to develop a website that
can overcome all these problems. The proposed system needs to provide a simple interface that
should allow the user to easily book the appointments.

Existing System:-

The existing system is a manual system. There should be a man to book event. Due to this a lot
of the time and energy has been utilized and this leads to wastage of important resources.

 Lack of security of data

 Manpower
 Needs manual calculation
 Time is taken to share information

Proposed System:-
We will develop a website that will eliminate the existing manual system and help website users
to save time by booking appointment online.

Our project is designed to support the following features:

 All the data or record is stored automatically in the Database.

 User-friendly interface through which the user can easily understand what to do.
 All the changes are done by the admin only.
 Admin can see the member who is registered.

FEASIBILITY STUDY
By the investigation, we have identified the need, problems, and requirements. So our next step
was to determine exactly what the proposed system is to do by defining its expected
performance. This kind of work can be carried out in the Feasibility Study . In the conduct of the
feasibility study, we have gone through followings distinct, but inter-related types of feasibility.
These are:

I. Technical feasibility

II. Economical feasibility

III. Operational feasibility

 Technical Feasibility:-
The website we intend to build require frontend to interact with the clients only, that would view
various information about the facilities provided by clinic and booking of appointment. The front
end is provided by HTML.CSS , PHP and back end by MySQL, so the proposed system is
technically feasible.

 Economical Feasibility:-
The proposed system is economically feasible as the tools and platform we require are of
minimum cost.

 Operational Feasibility:-
We compared the operational part of the proposed system with manual operation. We found the
proposed system is more beneficial from an operational point of view. It can overcome the
manual problem and also speed up the working process. The system is operationally feasible as
the website is a simple Website with all the instructions provided and all operations separated in
different menu and submenu. So, the users i.e., the common public need none other than the
general internet knowledge for viewing the website so we find the system easy to use and thus,
the system is operationally feasible.

PROJECT PLANNING
 Firstly we analyzed all possible sectors that are in the Eye Clinic Website which must be on
our website
 Then we understand the needs and requirement for the development of such a system that
could make this process faster, and easier to manage.
 According to the needs of the system, we chose the language or platform for the development
of this system which we found out that HTML.CSS, PHP is suitable for such project
 Then we decided the modules and sub-modules required for our system and the work tobe
accomplished by each module
 Then we created the front-end of the website in HTML.CSS.
 Then we designed the database, tables and its attributes and designed back-end of the system
in MySQL.

PROJECT SCHEDULING
PERT CHART

GANTT CHART
 Software Requirements Specification (SRS)
Introduction
The following subsections of the SRS document provide an overview of the entire SRS .
  Purpose
The purpose of our project is to provide the facility to the users as well as administrative staff.
This website will help in managing tasks automatically.

 Scope
The website will be used by administrative staff and users. Admin can easily insert, delete and
update the details from the website.

 Benefits
This website reduces the complexity, increase efficiency, increases accessibility and
saving time.

HARDWARE AND SOFTWARE USED

Hardware Used:-
 Processor- 1.19 GHz Intel Core i5-1035G1 10th Gen Processor

 Installed RAM-8GB

 HDD–1TB

 Graphics – Intel HD Graphics

Software Used:-

 Operating System- Windows.

 Front-End- html.css, php, Javascript.

 Back-End- MySQL.

 Web Server- Apache SERVER.

USE CASE DIAGRAM

Registration

Login
 Check Details

Check Previous Treatment

user
guest
Book appoinment

Add record

Update record

Delete record
admin

UML DIAGRAM
User Activity Diagram

Start

Registration
 Verify Email Verify Mobile

Registration Successful

Login
Invalid Password
Reset
Valid

Book Appointment

Make Payment

logout

Admin Activity Diagram

Start
 Login

Invalid Password
Reset
Valid

Control Services

Control Users

Logout

ER DIAGRAM
Name
D_ Id
Age
Name Address

Address Ph.No
D_ Id
Department

Gender

TREATS
DOCTOR PATIENT
Ph_No Gender

ISSUED

ASSIGN

Bill _No

Doc_Charges
BILL

Room Charges

Type
ROOM

Room_id

ACTIVITY DIAGRAM

Login To The Eye Clinic

Website
Start

Check User Level And

Permission
Check Permission Check Permission Check Permission Check Permission Check Permission

Manage clinic Manage patients Manage doctor Manage booking Manage

appointment

Logout from the website

End
SEQUENCE DIAGRAM
USER SEQUENCE DIAGRAM

USER Sign Up SYSTEM Add Details DATABASE

Verification Code

Verify User Added

 Login Check

Verified
Response

Search Eye Service Search For Eye Service

Service Found

Book Appointment Appointment Edit

Appointment Booked

Payment Make Payment

Booking Appointment Conform

ADMIN SEQUENCE DIAGRAM

ADMIN SYSTEM DATABASE

Sign Up Add Details

Verification code

Admin Added
verify
 Login Check

Verified

Response

Select Eye Services Eye Services Search

Services Found

Select User User Found Appointment

Call User For Treatments

SYSTEM DESIGN
Modularization Details:-

1. Admin:-

1) Manage users
2) Manages Data of Patient
3) View appointment booking request from patients.
4) Manage employee
5) Report generation
2. User:-

1) Manage profile
2) View Gallery
3) View Details of Clinic
4) View services
5) Book Appointments
6) Give feedback

3. Guest Users:-

1) View Gallery
2) View Details of Clinic
3) View services

Data Integrity and Constraints:-

The integrity of the data in the database is maintained through constraints. There as manytypes of
constraint on the attributes of the tables. For example, in users table, the database has its primary
key that has constraint NOT NULL and is ‘auto increment’ so that it generates automatically.
Every related table is assigned with a foreign key to check the relation.

VALIDATION AND CONSTRAINTS:-

If you did not input any value or enter the wrong value than it will show an alert box in login
page:
 User Interface:-

Welcome Page:-
Login Page:-
Registration Page:-

About Page:-
Service Page:-
Gallery:-
 TESTING
Testing Technique and Testing Reports
Unit Testing

Unit testing, also known as component testing refers to tests that verify the functionality of
aspecific section of code, usually at the function level. In an object-oriented environment, this is
usually at the class level, and the minimal unit tests include the constructors and destructors.

Testing Objectives

 Testing is a process of executing a program with the intention of finding an error.

 A good test case is one that has a high probability of finding an as yet undiscovered error.
 A successful test is one that uncovers an as yet undiscovered error.
 Test Cases

Test Case 1:-

If we enter a wrong or null value it will show alert box.

All the fields are mandatory and should be filled with required details.
 SYSTEM SECURITY MEASURES
Secure and Robust Programming:-
Many system failures and security vulnerabilities arise at the programming level. These can often
be attributed to inadequate handling of exceptional situations, poor understanding of the details
of the programming language in use, incomplete descriptions of the interfaces between
components, and insufficient care in the treatment of concurrency and threading issues. In this
system, special care has been taken while performing the programming for the web application
so that the web application doesn’t get corrupted or meet any fatal error while running.

Data Security and Privacy:-

 As increasing amounts of data are captured so keeping concerns about the treatment of
personal database concept has been designed.
 The use of HTML.CSS , PHP , JAVA makes it a secure website as it provide many features
to get security.
 The database is not open and is secured by password, only the admin can access the database.
 FUTURE SCOPE AND ENHANCEMENT
 We can make the frontend more attractive.
 We can add cancelling of the appointment feature.
 We can add more online payment options.
 We can add virtual voice help option.
 APPENDICES

Coding:-

<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<center>
<div class="main" >
<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href="home.html"><b>ADMIN</a></li>
<li><a href="login.html">LOG-IN</b></a></li>
<li><a href="services.html"><b>CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="home.html">HOME</b></a></li>
</ul>
</div>
<div class="head">
<img class="s" src="001.jpg" height="300px" width="100%">
<img class="s" src="2.jpeg" height="300px" width="100%">
<img class="s" src="002.jpg" height="300px" width="100%">
<img class="s" src="3.jpeg" height="300px" width="100%">
<img class="s" src="4.jpeg" height="300px" width="100%">

</div>
<div class="clinic">

<div class="about">
<h2>Welcome to
Ramrati-Eye Clinic</h2>
<p>RAMRATI EYE CLINIC is one of the most
pioneer eye center of </br>Dehradun Uttarakhand</br>
Ramrati eye clinic started 7 Nov 2011</br>
During 7 year period hospital condected so many free eye camp.</br>
Clinic provided all eye services Clinic having his own optical</br>
& pharmacy Department.</br>
Ramrati eye clinic, Dehradun Dr Sanjeev kumar</br>
completed MBBS in 2006 From Kempegowda institute of
medical </br> science, Banglore.</p>
</div>

<div class="img">
<div class="ig">
<img src="doctor.jpg" height="100%" width="100%" class="a">
</div>
</div>
</div>
<div class="container">

<div class="cot">
<img src="0.jpg" height="100%" width="100%">
</div>
<div class="cont"><li class="b"><a href="appoinment.html">Take Appoinment</a><li></div>
</div>
<div class="footer">

<pre class="chinki">

<h1 style="margin-left:150px; text-shadow: 8px 8px 5px black;">Visiting Consulttants</h1>

<h2>Dr Prashant Naithani</h2></br></br></br>
AIMS0, FICO(UK),FRCS(GLASG)
Retina Specialist Every 2n saturday of month

<h2>Dr Vipul Arora</h2></br></br></br>

M.S fellow (NYEEI, New York) Oculoplasty surgoen

<h2>Dr Vishal H Sharma</h2></br></br></br>

MBBS DNB (Opthalmology)
FCFS (Hyderabad), FNYECC(U.S.A)

</pre>
<div class="z">
<div class="z1">
<img src="003.jpg" style="width:100%;">
</div>
</div>

</div>
<div class="ft">

<div class=ft1>
<center class="f0">
</br><h1 style="color:white; text-align:s; text-shadow:10px 10px 8px black; margin-left:10px; margin-
top:0px;">Contact Us</h1>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Address: 34/2 special wing
Amitabh Textite Mill Pump House
Kandara Vidhyalya Road Premnagar Dehradun</p>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Email:
[email protected]
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px"> TEL: 0135-2770104,
+91-9027489104, +91-7500529097
</center>
</div>
</div>

</center>
</body>
<script>
var slideIndex=0;
carousal();

function carousal()
{
var i;
var x=document.getElementsByClassName("s");
for (i = 0; i < x.length; i++)
{
x[i].style.display = "none";
}
slideIndex++;
if (slideIndex > x.length ) {slideIndex = 1}
x[slideIndex-1].style.display = "block";
setTimeout(carousal, 2000);
}
</script>
</html>

<html>
<head>
<link rel="stylesheet" type="text/css" href="about.css">
</head>
<body>
<center>
<div class="main" >
<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href=" Admin.html"><b>ADMIN</b></a></li>
<li><a href="login.html"><b>LOG-IN</b></a></li>
<li><a href="service.html"><b> CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html"><b>ABOUT</a></li>
<li><a href="home.html"><b>HOME</a></li>
</ul>
</div>
<div class="container">
<div class="kk">

<p style="color:white; text-align: justify; text-shadow:10px 10px 8px black; margin-left:100px; margin-
top:100px">
Welcome to RAMRATI EYE HOSPITAL,
Dehradun RAMRATI EYE HOSPITAL is one of the pioneer eye centre of Dehradun,
Uttarakhand Ramrati eye hospital started in 7 nov 2011 .
During 7 year period hospital conducted so many free eye camps .
Hospital provide all eye services . Hospital having his own Optical & pharmacy department.RAMRATI EYE
HOSPITAL
Dr Sanjeev Kumar completed MBBS in 2006 from Kempegowda institute of medical science,
Bangalore.He completed his DOMS in the year 2008 from K. L. E. Belgaum university.
Then he completed two year 2008 to 2010 anterior segment & IOL fellowship from Aravind Eye Hospital,
Tirunelveli. After completing fellowship he worked In Eye Q superspeciality hospital,
Muzaffarnagar & Roorkee for 8 month. Then he worked with Drishti eye centre ,
Dehradun for 6 month. After that he opened his own Ramrati Eye Hospital in premnagar , Dehradun.
During his academic carear he presented so many free papers & posters both national & state wise.
He conducted so many free eye camps.
</p>
</div>

<div class="k">
<div class="z1">
<img src="003.jpg" style="width:100%;">
</div>
</div>
</div>
<div class="ft">

<div class=ft1>
<center class="f0">
</br><h1 style="color:white; text-align:s; text-shadow:10px 10px 8px black; margin-left:10px; margin-
top:0px;">Contact Us</h1>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Address: 34/2 special wing
Amitabh Textite Mill Pump House
Kandara Vidhyalya Road Premnagar Dehradun</p>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Email:
[email protected]
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px"> TEL: 0135-2770104,
+91-9027489104, +91-7500529097
</center>
</div>
</div>

</center>
</body>
</html>

<html>
<head>
<link rel="stylesheet" type="text/css" href="gallary.css">
</head>
<body>
<center>
<div class="main" >
<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href=" Admin.html"><b>ADMIN</b></a></li>
<li><a href="login.html"><b>LOG-IN</b></a></li>
<li><a href="services.html"><b> CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html"><b>ABOUT</a></li>
<li><a href="home.html"><b>HOME</a></li>
</ul>
</div>
<div class="at">

<div style="height:200px; width:25%; float:right; margin-right:40px; box-shadow:10px 10px 10px">

<img src="img/01.jpg" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; box-shadow:10px 10px 10px;">

<img src="img/02.png" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; float:left; margin-top:-16.5%; margin-left:40px; box-shadow:10px 10px 10px

">
<img src="img/03.jpg" height="100%" width="100%">
</div>

</div>

<div class="a1">

<div style="height:200px; width:25%; float:right; margin-right:40px; box-shadow:10px 10px 10px ">

<img src="img/04.png" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; margin-top:50px; box-shadow: 10px 10px 10px ; ">

<img src="img/05.png" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; float:left; margin-top:-16.5%; margin-left:40px; box-shadow:10px 10px

10px " >
<img src="img/06.png" height="100%" width="100%">
</div>

</div>

<div class="a2">

<div style="height:200px; width:25%; float:right; margin-right:40px; box-shadow:10px 10px 10px">

<img src="img/07.png" height="100%" margin-top:50px; width="100%">
</div>

<div style="height:200px; width:25%; margin-top:50px; box-shadow: 10px 10px 10px ; ">

<img src="img/9.jpg" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; float:left; margin-top:-16.5%; margin-left:40px; box-shadow:10px 10px

10px;" >
<img src="img/54.jpg" height="100%" width="100%">
</div>

</div>

<div class="a3">
<div style="height:200px; width:25%; float:right; margin-right:40px; box-shadow:10px 10px 10px ">
<img src="img/10.jpg" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; box-shadow: 10px 10px 10px">

<img src="img/11.jpg" height="100%" width="100%">
</div>

<div style="height:200px; width:25%; float:left; margin-top:-16.5%; margin-left:40px; box-shadow:10px 10px 10px

">
<img src="img/12.jpg" height="100%" width="100%">
</div>

</div>
<div class="ft">

<div class=ft1>
<center class="f0">
</br><h1 style="color:white; text-align:s; text-shadow:10px 10px 8px black; margin-left:10px; margin-
top:0px;">Contact Us</h1>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Address: 34/2 special wing
Amitabh Textite Mill Pump House
Kandara Vidhyalya Road Premnagar Dehradun</p>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Email:
[email protected]
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px"> TEL: 0135-2770104,
+91-9027489104, +91-7500529097
</center>
</div>
</div>
</center>

</body>
</html>

<html>
<head>
<link rel="stylesheet" type="text/css" href="gallary.css">
</head>
<body>
<center>
<div class="main" >
<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href=" Admin.html"><b>ADMIN</b></a></li>
<li><a href="login.html"><b>LOG-IN</b></a></li>
<li><a href="services.html"><b> CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html"><b>ABOUT</a></li>
<li><a href="home.html"><b>HOME</a></li>
</ul>
</div>

<div class="serv">

<div style="height: 300px; width:40%; float:right; margin-right:50px;">

<figure>
<img src="New folder/02.jpeg" height="100%" width="100%">
<figcaption> Glaucoma services </figcaption>
</figure>
</div>

<div style="height: 300px; width:40%; float:left; margin-left:50px;">

<figure>
<img src="New folder/03.jpg" height="100%" width="100%">
<figcaption>Computerised Eye Teat</figcaption>
</figure>
</div>

</div>

<div class="serve">

<div style="height: 300px; width:40%; float:left; margin-left:50px; margin-top:20px;">

<figure>
<img src="New folder/04.jpg" height="100%" width="100%">
<figcaption>Cornea Services</figcaption>
</figure>
</div>

<div style="height: 300px; width:33.5%; float:right; margin-top:40px; margin-right:90px; ">

<img src="New folder/06.jpg" height="100%" width="100%">
<figcaption>Orbit Services</figcaption>
</figure>
</div>
</div>

<div class="serves">

<div style="height: 300px; width:40%; float:right; margin-right:50px; margin-top:20px;">

<figure>
<img src="New folder/07.jpg" height="100%" width="100%">
<figcaption>Retina Services</figcaption>
</figure>
</div>

<div style="height: 300px; width:40%; float:left; margin-left:50px; margin-top:20px;">

<figure>
<img src="New folder/05.jpg" height="100%" width="100%">
<figcaption>Padiatric Ophthamology</figcaption>
</figure>
</div>
</div>

<div class="ft" style="margin-top:7%;">

<div class=ft1>
<center class="f0">
</br><h1 style="color:white; text-align:s; text-shadow:10px 10px 8px black; margin-left:10px; margin-
top:0px;">Contact Us</h1>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Address: 34/2 special wing
Amitabh Textite Mill Pump House
Kandara Vidhyalya Road Premnagar Dehradun</p>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Email:
[email protected]
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px"> TEL: 0135-2770104,
+91-9027489104, +91-7500529097
</center>
</div>
</div>

</center>
</body>
</html>

<html>
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css.css">
<title>
</title>
<style>
.alert{

margin-top:50%;
}

</style>
</head>
<body>
<center>

<div class="main" >

<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href=" Admin.html"><b>ADMIN</b></a></li>
<li><a href="login.html"><b>LOG-IN</b></a></li>
<li><a href="services.html"><b> CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html"><b>ABOUT</a></li>
<li><a href="home.html"><b>HOME</a></li>
</ul>
</div>

<div class="t">
<img src="4.png"/>
<form name="loginForm" method="post">
<div class="form" method="post" name="myform">
<input type="text" name="usr" id="usr" placeholder="username"/>
</div>
<div class="form-input">
<input type="password" id="pword" placeholder="password"/>
</div>
<input type="submit" id="submit" onclick="raman()" value="Login" class="btn-login"/>
</form>
</div>
<script language="javascript">

function raman()
{
window.alert("Invalid username or password. Please try again");
}
</script>

<div class="ft">

<div class="ft1">
</br><h1 style="color:white; text-align:s; text-shadow:10px 10px 8px black; margin-left:10px; margin-
top:0px;">Contact Us</h1>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Address: 34/2 special wing
Amitabh Textite Mill Pump House
Kandara Vidhyalya Road Premnagar Dehradun</p>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Email:
[email protected]
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px"> TEL: 0135-2770104,
+91-9027489104, +91-7500529097
</div>
</div>

</body>

</html>

<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<center>
<div class="main" >
<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href=" Admin.html"><b>ADMIN</b></a></li>
<li><a href="login.html"><b>LOG-IN</b></a></li>
<li><a href="services.html"><b> CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html"><b>ABOUT</a></li>
<li><a href="home.html"><b>HOME</a></li>
</ul>
</div>

<div class="logf">

<form action="insert.php" method="POST" >

<center class="k">
<table class="ww"><tr>
<td>Your Name</td><td><input type="text" name="name" placeholder="Your Name" size="30px" style="box-
shadow:10px 10px 8px black"></td></tr>
<tr><td>Phone.No </td><td><input type="phone" name="phone" placeholder="Contact" size="30px" style="box-
shadow:10px 10px 8px black"></td></tr>
<tr><td>Address</td><td><input type"text" name="address" placeholder="Address" size="30px" style="box-
shadow:10px 10px 8px black"></td></tr>
<tr><td>Email.Id</td><td><input type="text" name="email" placeholder="Your Email" size="30px" style="box-
shadow:10px 10px 8px black"></td></tr>
<tr><td>Description</td><td><input type="text" name="note" placeholder="Subject" size="30px" style="box-
shadow:10px 10px 8px black"></td></tr><br/>
<tr><td><input type="button" class="btn" value="submit" name="submit"></td></tr>
</center>
</table>
</form>
</div>

<div class="ft" style="margin-top:50px">

<div class=ft1>
</br><h1 style="color:white; text-align:s; text-shadow:10px 10px 8px black; margin-left:10px; margin-
top:0px;">Contact Us</h1>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Address: 34/2 special wing
Amitabh Textite Mill Pump House
Kandara Vidhyalya Road Premnagar Dehradun</p>
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px">Email:
[email protected]
<p style="color:white; text-align:; text-shadow:10px 10px 8px black; margin-left:10px"> TEL: 0135-2770104,
+91-9027489104, +91-7500529097
</center>
</div>
</div>

</center>
</body>
</html>

<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<center>
<div class="main" >
<B>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:20px; margin-left:20px; text-
align:left; font-size: 40px ">R</p>
<p style="color:white; text-shadow: 10px 10px 10px red; padding:20px; margin-top:-120px; margin-left:50px;
text-align:left; font-size: 30px">amrati-Eye clinic</p></B>
<ul>
<li><a href=" Admin.html"><b>ADMIN</b></a></li>
<li><a href="login.html"><b>LOG-IN</b></a></li>
<li><a href="services.html"><b> CLINIC-SERVICES</a></li>
<li><a href="gallary.html"><b>GALLARY</a></li>
<li><a href="about.html"><b>ABOUT</a></li>
<li><a href="home.html"><b>HOME</a></li>
</ul>
</div>
</center>
</body>
</html>

.main
{
box-shadow: 10px 10px 10px ;
background-color: blue;
background-position: center;
height: 150px;
width: 90%;
text-align: center;
float: center;
}
.cont a{
margin-top:10px;
}
.a{
margin-top: 30px;
margin-left: 40%;
}
.container
{
margin-top: 10px;
height: 300px;
width: 90%;
}
.container a
{
font-size: 40px;
margin-top:10px;
color: white;
text-shadow: 10px 10px 10px grey;
font-family: arial;
font-style: none;
text-align: center;
text-decoration: none;
padding: 15px;
}
.cont
{
box-shadow: 10px 10px 20px grey;
background-color: blue;
height: 300px;
width: 49%;
float: left;

}
.cot
{
box-shadow: 10px 10px 20px grey;
background-color: purple;
height: 300px;
width: 49%;
float: right;
}
body{
background-image: url('6.jpg');
background-position: center;
background-repeat: No-repeat;
background-size: cover;
}
ul{
list-style-type: none;
margin-top: 20px;
padding: 0;
}
.cont li {
list-style-type: none;
margin-top: 15%;
margin-right: 25%;
text-align:center;
align: center;
}
.cont li a:hover{
color: black;
background-color: blue;
}
li a{
text-shadow: 8px 8px 5px black;
float: right;
display: block;
color: white;
font-family: arial;
font-style: none;
text-align: center;
font-size: 15px;
text-decoration: none;
padding: 15px;
margin-right: 10px;
margin-top: -20px;
}
li a:hover{
color: black;
background-color: white;
}
.head
{
box-shadow: 10px 10px 10px;
height: 300px;
width: 90%;
text-align: center;
float: center;
margin-top: 10px;
}

.clinic{
margin-top: 10px;
box-shadow: 10px 10px 10px grey;
height: 300px;
width: 90%;
float: center;
background-color: blue;
margin-top:10px;
}
.about{
background-color: blue;
height: 300px;
width: 50%;
float: right;
}
.img{
background-color: blue;
height: 300px;
width: 50%;
float: right;

}
.about h2{
float: left;

text-shadow: 10px 10px 5px black;

background-color: blue;
color: white;
font-size: 35px;
margin-left: 10px;
margin-top: 25px;
}
.about p{
text-shadow: 8px 8px 5px grey;
color: white;
text-align: justify;
font-size: 15px;
float: left;
margin-left: 10px;
text-padding: 10px;
}
.footer{
background-color: blue;
margin-top: 10px;
background-position: center;
height: 400px;
width: 90%;
text-align: center;
float: center;
box-shadow: 10px 10px 10px black;
}

h2
{
text-shadow: 8px 8px 5px black;
line-height: 12pt;
float: left;
background-color: blue;
color: white;
font-size: 20px;
margin-left: 200px;
}

.chinki{
overflow:hidden;
text-shadow: 8px 8px 5px grey;
line-height: 10pt;
float: left;
background-color: blue;
color: white;
font-size: 15px;
text-align:left;
padding: 0px;
}

.ft
{
box-shadow: 8px 8px 5px;
margin-top:10px;
background-color: blue;
background-position: center;
height: 200px;
width: 90%;
text-align: center;
float: center;
}
.f0{
}

.z{
width: 42%;
text-align: center;
float: right;
position: relative;
}
.z1{
width: 80%;
margin-top:50px;
margin-right:100px;
box-shadow: 10px 10px 50px ;
}
.ig{
height:250px;
width:250px;
}

.serv{
height:300px;
margin-left:3%;
width: 90%;
}
.serve{
height:300px;
margin-left:3%;
width: 90%;
margin-top:40px;
}

.serves{
height:300px;
margin-left:3%;
width: 90%;
margin-top:40px;
}

figcaption{
background-color: black;
color:white;
padding: 2px;
text-align:center;
}
.logf{
height: 350px;
width: 750px;
background-color: rgba(44, 62, 80, 0.7);
margin-top: 25px;
}

form
{
font-size:10px;
padding: 10px 0px;
border: 5px;
margin-top: 10%;
align: center;
text color :red;
}

.ww{
align:center;
font-size:25px;
color: white;
text-shadow: 10px 10px 8px black;
font-weight:bold;
}

.k{
padding:10px;
margin-top:40px;
}

.btn{
margin-top:15px;
margin-left:100px;
box-shadow:10px 10px 8px black;
background-color: green;
padding: 10px 20px;
color: #fff;
}
.alert{
margin-top:50%;
}

.main
{
box-shadow: 10px 10px 10px grey;
background-color: blue;
background-position: center;
height: 150px;
width: 90%;
text-align: center;
float: center;
}
li a{
text-shadow: 8px 8px 5px grey;
float: right;
display: block;
color: white;
font-family: arial;
font-style: none;
text-align: center;
font-size: 15px;
text-decoration: none;
padding: 15px;
margin-right: 10px;
margin-top: -20px;
}
li a:hover{
color: black;
background-color: white;
}
ul{
list-style-type: none;
margin-top: 20px;
padding: 0;
}

.at{
height: 200px;
width: 90%;
margin-top: 50px;
}
.a1{
height: 200px;
width: 90%;
margin-top: 20px;
}
.a2{
height: 200px;
width: 90%;
margin-top: 20px;
}
.a3{
height: 200px;
width: 90%;
margin-top: 50px;
}

.ft
{
box-shadow: 8px 8px 5px;
margin-top:10px;
background-color: blue;
background-position: center;
height: 200px;
width: 90%;
text-align: center;
float: center;
}
.f0{
}
.serv{
margin-top:20px;
height:300px;
margin-left:3%;
width: 90%;
}
.serve{
margin-top:20px;
height:300px;
margin-left:3%;
width: 90%;
margin-top:40px;
}

.serves{
margin-top:20px;
height:300px;
margin-left:3%;
width: 90%;
margin-top:40px;
}

figcaption{
background-color: black;
color:white;
padding: 2px;
text-align:center;}
Bibliography
https://www.tutorialspoint.com/system_analysis_and_design/system_analysis_and_design_overv
iew.htm

Rajib Mall, “Fundamentals of Software Engineering” 2008,Prentice Hall India Learning Private
Limited. pg.no 161-195,361-393,396-42)

 tutorialspoint.com
 geeksforgeeks.com