<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>SLPES</title>
<meta content="" name="descriptison">
<meta content="" name="keywords">
<!-- Favicons -->
<!-- <link href="assets/img/favicon.png" rel="icon">-->
<link href="assets/img/favicon.ico" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
rel="stylesheet">
<!--font awesome link-->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/icofont/icofont.min.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/owl.carousel/assets/owl.carousel.min.css" rel="stylesheet">
<link href="assets/vendor/venobox/venobox.css" rel="stylesheet">
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
<script src="assets/vendor/jquery/jquery.min.js"></script>
<!-- links for the timeline-->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" id="bootstrap-css"
rel="stylesheet">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<link href="assets/css/timeline.css" rel="stylesheet">
<style>
th.diagonalFalling {
background: linear-gradient(to right top, #ffffff 0%, #ffffff 49.9%, #000000 50%, #000000 51%, #ffffff 51.1%, #ffffff 100%);
}
.fa-check {
color: green;
}
.fa-times {
color: red;
}
</style>
<!-- =======================================================
* Template Name: Bocor - v2.1.0
* Template URL: https://bootstrapmade.com/bocor-bootstrap-template-nice-animation/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<!-- ======= Header ======= -->
<header id="header">
<div class="container d-flex align-items-center">
<div class="logo mr-auto">
<h1 class="text-light"><a href="index.html">SLPES<span>.</span></a></h1>
<!-- Uncomment below if you prefer to use an image logo -->
<!-- <a href="index.html"><img src="assets/img/logo.png" alt="" class="img-fluid"></a>-->
</div>
<nav class="nav-menu d-none d-lg-block">
<ul>
<li class="active"><a href="index.html">Home</a></li>
<li><a href="#researchScope">Research Project Scope</a></li>
<li><a href="#researchMilestone">Research Project Milestones</a></li>
<li><a href="#documents">Documents</a></li>
<li><a href="#presentation">Presentation</a></li>
<li><a href="#aboutUs">About Us</a></li>
<li><a href="#contact">Contact Us</a></li>
</ul>
</nav><!-- .nav-menu -->
</div>
</header><!-- End Header -->
<!-- ======= Hero Section ======= -->
<section id="hero">
<div class="container">
<div class="row d-flex align-items-center">
<div class=" col-lg-6 py-5 py-lg-0 order-2 order-lg-1" data-aos="fade-right">
<h1>Taking the classroom monitoring to the next level with SLPES</h1>
<h2>Works well for Administration, Lecturers and Students</h2>
</div>
<div class="col-lg-6 order-1 order-lg-2 hero-img" data-aos="fade-left">
<!-- <img src="assets/img/application.jpg" class="img-fluid" alt="">-->
<img alt="" class="img-fluid" src="assets/img/Home/04.png">
<!-- <img src="assets/img/application_1.jpg" class="img-fluid" alt="">-->
</div>
</div>
</div>
</section><!-- End Hero -->
<main id="main">
<!-- ======= Research Scope Section ======= -->
<section class="researchScope section-bg" id="researchScope">
<div class="container">
<div class="section-title">
<h2 data-aos="fade-in">Research Project Scope</h2>
<!-- <p data-aos="fade-in">Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>-->
</div>
<!--nav tabs-->
<ul class="nav nav-tabs nav-fill" id="nav_bar" role="tablist">
<li class="nav-item">
<a aria-controls="lit_survey" aria-selected="false" class="nav-link active" data-toggle="tab"
href="#lit_survey"
id="lit-survey-tab" role="tab">Literature Survey</a>
</li>
<li class="nav-item">
<a aria-controls="research_gap" aria-selected="false" class="nav-link" data-toggle="tab"
href="#research_gap" id="research-gap-tab" role="tab">Research Gap</a>
</li>
<li class="nav-item">
<a aria-controls="research_problem" aria-selected="false" class="nav-link" data-toggle="tab"
href="#research_problem" id="research-problem-tab" role="tab">Research Problem</a>
</li>
<li class="nav-item">
<a aria-controls="research_objectives" aria-selected="false" class="nav-link" data-toggle="tab"
href="#research_objectives" id="research-objectives-tab" role="tab">Research Objectives</a>
</li>
<li class="nav-item">
<a aria-controls="methodology" aria-selected="false" class="nav-link" data-toggle="tab"
href="#methodology" id="methodology-tab" role="tab">Methodology</a>
</li>
<li class="nav-item">
<a aria-controls="technologies_used" aria-selected="false" class="nav-link" data-toggle="tab"
href="#technologies_used" id="technologies-used-tab" role="tab">Technologies used</a>
</li>
</ul>
<!--tab content-->
<div class="tab-content" id="tabContentDetails">
<!--literature_survey-->
<div class="tab-pane fade in active" id="lit_survey" role="tabpanel">
<h2>Literature Survey</h2>
<!--1st row-->
<div class="row">
<!--1st column-->
<div class="col-lg-6">
<div class="card m-4" data-aos="fade-right">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">ClassDojo</h4>
</div>
<div class="card-body">
<p class="card-text">Software that encourages positive classroom behavior by
awarding points for
participation</p>
<h5 class="font-weight-bold">Best For: </h5>
<ul type="square">
<li>Teachers</li>
<li>School leaders</li>
<li>Families</li>
</ul>
<h5 class="font-weight-bold">Features</h5>
<p class="card-text">
Useful for
classrooms, Real-time chat facility.
</p>
</div>
</div>
</div>
<!--end of 1st column-->
<div class="col-lg-2 p-4" data-aos="fade-right">
<img alt="" src="assets/img/literature_survey/class_dojo.jpg">
</div>
</div>
<!--end of 1st row-->
<!--2nd row-->
<div class="row">
<div class="col-lg-6"></div>
<div class="col-lg-4">
<div class="card m-4" data-aos="fade-left">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">TopHat</h4>
</div>
<div class="card-body">
<p class="card-text">The Top Hat app motivates students to engage with course
content, participate in
class and ultimately master your material.
</p>
<p class="card-text">
Run discussions in your classroom, assign interactive readings and quiz for
understanding, all with one easy-to-use interface.
</p>
<h5 class="font-weight-bold">Features</h5>
<ul type="square">
<li>Get real-time feedback on student progress.</li>
<li>Leverage students' devices in class to increase participation.</li>
<li>Upload your slides easily and add interactive questions.</li>
<li>Take attendance effortlessly and prevent absent students from bending the
rules.
</li>
<li>Launch real-time polls to gauge student understanding.</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-2 p-4" data-aos="fade-left">
<!-- <img alt="" src="assets/img/literature_survey/tophat_logo.svg">-->
<img alt="" src="assets/img/literature_survey/06.png">
</div>
</div>
<!--end of 2nd row-->
<!--3rd row-->
<div class="row">
<div class="col-lg-6">
<div class="card m-4" data-aos="fade-right">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">AI-enabled classrooms in China</h4>
</div>
<div class="card-body">
<p class="card-text">
A High School in Hangzhou, China has installed cameras which are designed to
mark attendance automatically and track activities that students are engaging
in,
including reading, writing or listening.
</p>
<p class="card-text">
In addition, students’ real-time emotions such as fear, happiness, sadness,
surprise, disgust, anger and neutral are also tracked.
</p>
</div>
</div>
</div>
<div class="col-lg-2 p-4" data-aos="fade-right">
<img alt="" src="assets/img/literature_survey/AI_china.jpg">
</div>
</div>
<!--end of 3rd row-->
<!--4th row-->
<div class="row">
<div class="col-lg-6"></div>
<div class="col-lg-4">
<div class="card m-4" data-aos="fade-left">
<div class="card-header text-white bg-secondary">
<h4 class="font-weight-bold">EduSense: Practical Classroom Sensing at Scale</h4>
</div>
<div class="card-body">
<p class="card-text">
EduSense is a comprehensive, open source, sensing system that produces a
plethora of theoretically-motivated visual and audio features correlated with
effective instruction, which can feed professional development tools in much the
same way as a Fitbit sensor reports step count to an end user app
</p>
<p class="card-text">
The system consists of 3 main components as follows.
</p>
<ul type="disc">
<li>Body Segmentation, Keypoints and Interframe tracking</li>
<li>Facial Landmarks</li>
<li>Speech Detection</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-2 p-4" data-aos="fade-left">
<img alt="" src="assets/img/literature_survey/edusense.PNG">
</div>
</div>
<!--end of 4th row-->
</div>
<!-- end of literature_survey-->
<!--research gap-->
<div class="tab-pane fade" id="research_gap" role="tabpanel">
<h2>Research Gap</h2>
<!--research gap table-->
<table class="table table-striped">
<thead>
<tr>
<th class="diagonalFalling"></th>
<th>AI Systems in China</th>
<th>TopHat</th>
<th>ClassDojo</th>
<th>EduSense</th>
<th>SLPES</th>
</tr>
</thead>
<tbody>
<tr>
<td>Attendance Register</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
</tr>
<tr>
<td>Monitoring Student Behavior</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
</tr>
<tr>
<td>Lecture Summarizing</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
</tr>
<tr>
<td>Monitoring Lecturer Performance</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-times fa-3x"></i>
</td>
<td>
<i aria-hidden="true" class="fa fa-check fa-3x"></i>
</td>
</tr>
</tbody>
</table>
<!--end of research gap table-->
</div>
<!-- end of research gap-->
<!--research problem-->
<div class="tab-pane fade" id="research_problem" role="tabpanel">
<h2>Research Problem</h2>
<ul class="list-group">
<li class="mx-4">
“What is the optimum way of tracking student attendance in a much efficient way
and how does the lecturer analyze reasons for student absenteeism?” (Q1).
</li>
<li class="mx-4">
“Does a correlation exist between lecturing style and student behavior in the
classroom and how can Computer Vision and Artificial Intelligence be
incorporated in determining this relationship?” (Q2).
</li>
<li class="mx-4">
“How to summarize the lecture content to enable students to pay more attention
to the lecture and reduce time spent for taking notes?” (Q3).
</li>
<li class="mx-4">
“How to evaluate lecture performance by tracking their behavior during a lecture
and analyzing the quality of the lecture content which is delivered by the
lecturer?” (Q4).
</li>
</ul>
</div>
<!-- end of research problem-->
<!--research objectives-->
<div class="tab-pane fade" id="research_objectives" role="tabpanel">
<h2>Research Objectives</h2>
<!--1st row-->
<div class="row" data-aos="fade-right">
<div class="col-lg-8">
<div class="card shadow-lg">
<div class="card-header text-white bg-primary">
<h2>Main Objectives</h2>
</div>
<div class="card-body">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Tracking student attendance using facial detection and facial recognition,
notify
and getting opinion from the students who are absent and students who are
leaving
the lecture in the during a specified time period.
</span>
</div>
<div class="col-lg-2">
<img alt="" height="100" src="assets/img/objectives/face_recognition.jpg"
width="100">
</div>
</div>
<hr style="border: 2px solid black">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Monitoring student behavior within the classroom during lecture periods to
identify potential problem areas in retaining student attention and adapting
the
lecturing styles to suit the student needs.
</span>
</div>
<div class="col-lg-2">
<img alt="" height="100" src="assets/img/objectives/monitoring.jpg"
width="100">
</div>
</div>
<hr style="border: 2px solid black">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Summarize the converted text and present as a document and identify the
important points of the lecture to display them highlighted.
</span>
</div>
<div class="col-lg-2">
<img alt="" height="100" src="assets/img/objectives/speech_to_text.png"
width="100">
</div>
</div>
<hr style="border: 2px solid black">
<div class="row">
<div class="col-lg-10">
<span class="font-weight-bold" style="text-align: justify">
Monitoring lecturers’ behavior by analyzing the lecture audio data recorded
in a
lecture hall during lecture hours.
</span>
</div>
<div class="col-lg-2">
<img alt="" height="100" src="assets/img/objectives/dashboard.jpg"
width="100">
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4"></div>
</div>
<!--end of 1st row-->
<!--2nd row-->
<div class="row mt-4" data-aos="fade-right">
<div class="col-lg-4"></div>
<div class="col-lg-8">
<div class="card shadow-lg">
<div class="card-header text-white bg-success">
<h2>Specific Objectives</h2>
</div>
<div class="card-body">
<p>Hello</p>
</div>
</div>
</div>
</div>
<!--end of 2nd row-->
</div>
<!-- end of research objectives-->
<!--methodology-->
<div class="tab-pane fade" id="methodology" role="tabpanel">
<h2>Methodology</h2>
<div class="row no-gutters">
<!--diagram column-->
<div class="col-lg-4">
<img alt="system diagram" height="400" src="assets/img/methodology/system_diagram.jpg"
width="300">
</div>
<!--end of diagram column-->
<!--description column-->
<div class="col-lg-8">
<div class="card shadow-lg bg-white">
<div class="card-body">
<p class="card-text" style="font-size: 20px; text-align: justify">
As mentioned in the System Diagram, this system will mainly consist of a mobile
and web
application.
When the students and the lecturer enter the classroom, their behavior will be
monitored
by two separate video-cameras and a microphone. The collected data will transmit
to the
server through local machine and stores the gathered data in the MongoDB cloud
database
service.
</p>
<p class="card-text" style="font-size: 20px; text-align: justify">
While the video camera tracks both facial expression and body
movements, the
microphone will record the lecture for further analysis. The student attendance
will
register by capturing facial identity using deep learning and computer vision
mechanisms.
Students will be monitored by capturing their facial and body movements by
Computer
Vision and Deep Learning algorithms.
</p>
<p class="card-text" style="font-size: 20px; text-align: justify">
The lecturer audio and video details will
be
gathered and stored for analyzing as such lecture summarizing and monitoring
lecturer
performance using machine learning, deep learning, and computer vision
technologies.
While the students have access to the mobile application, the lecturers and the
higher
management have the authority to manage the web-application. Frontend components
will communicate with the backend using Django REST API.
</p>
</div>
</div>
</div>
<!--end of description column-->
</div>
</div>
<!-- end of methodology-->
<!--technologies used-->
<div class="tab-pane fade" id="technologies_used" role="tabpanel">
<h2>Domains</h2>
<!-- logos of the domains used-->
<div class="row no-gutters clients-wrap clearfix wow fadeInUp mt-4" data-aos="fade-right">
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
src="assets/img/technologies/deep_learning.jpg">
<span>Deep Learning</span>
</div>
</div>
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="400" src="assets/img/technologies/computer_vision.jpg">
<span>Computer Vision</span>
</div>
</div>
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="100" src="assets/img/technologies/machine_learning.jpg">
<span>Machine Learning</span>
</div>
</div>
<div class="col-lg-3 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="200" src="assets/img/technologies/nlp.jpg">
<span>Natural Language Processing</span>
</div>
</div>
</div>
<!--end of domains-->
<h2>Tools</h2>
<!-- logos of the technologies used-->
<div class="row no-gutters clients-wrap clearfix wow fadeInUp mt-4" data-aos="fade-left">
<div class="col-lg-2 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
src="assets/img/technologies/django.png">
</div>
</div>
<div class="col-lg-2 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="400" src="assets/img/technologies/djangorestframework.png">
</div>
</div>
<div class="col-lg-2 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="100" src="assets/img/technologies/mongo.png">
</div>
</div>
<div class="col-lg-2 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="200" src="assets/img/technologies/opencv.png">
</div>
</div>
<div class="col-lg-2 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="300" src="assets/img/technologies/tensorflow.png">
</div>
</div>
<div class="col-lg-2 col-md-4 col-6">
<div class="client-logo">
<img alt="" class="img-fluid" data-aos="flip-right"
data-aos-delay="400" src="assets/img/technologies/flutter.png">
</div>
</div>
</div>
<!--end of logos-->
</div>
<!-- end of technologies used-->
</div>
<!--end of tab content-->
</div>
</section>
<!-- End Research Scope Section -->
<!-- ======= Research Milestones Section ======= -->
<section class="researchMilestone section-bg" id="researchMilestone">
<div class="container">
<div class="section-title">
<h2 data-aos="fade-in">Research Project Milestones</h2>
</div>
<!--row-->
<div class="row">
<div class="container">
<div class="row">
<div class="col">
<div class="card text-center">
<a href="#proposal" class="card-header bg-info" style="padding: 7px; font-size: 25px; color: white; text-decoration: none" data-toggle="collapse">Proposal</a>
<div id="proposal" class="collapse mt-4">
<div class="card bg-white shadow-lg">
<div class="card-header">
<h1 class="card-title">Proposal</h1>
</div>
<div class="card-body">
<h3 class="font-weight-bold">Description</h3>
<div class="justify-content-center">
<p class="card-text">The Research group was given the opportunity to elaborate
the research problem,
research objectives and tentative methodology of the proposed study. The
presentation was carried out by each
individual describing their components</p>
</div>
<h3 class="font-weight-bold">Date</h3>
<div class="justify-content-center">
<p class="card-text">
<i class="glyphicon glyphicon-time"></i>
Feb 27th, 2020.
</p>
</div>
<h3 class="font-weight-bold">Marks</h3>
<div class="justify-content-center">
<p class="card-text">10</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card text-center">
<a href="#pp1" class="card-header bg-info" style="padding: 7px; font-size: 25px; color: white; text-decoration: none" data-toggle="collapse">Progress presentation 1</a>
<div id="pp1" class="collapse mt-4">
<div class="card bg-white shadow-lg">
<div class="card-header">
<h1 class="card-title">Progress Presentation - 1</h1>
</div>
<div class="card-body">
<h3 class="font-weight-bold">Description</h3>
<div class="justify-content-center">
<p class="card-text">This presentation was aimed to show the progress of the ongoing porcess,
such that 50% of the complete product had to be presented. Each individual had to clearly mention what they
have done and the actual percentage of the work completed</p>
</div>
<h3 class="font-weight-bold">Date</h3>
<div class="justify-content-center">
<i class="glyphicon glyphicon-time"></i>
July 13, 2020
</div>
<h3 class="font-weight-bold">Marks</h3>
<div class="justify-content-center">
15%
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card text-center">
<a href="#pp2" class="card-header bg-info" style="padding: 7px; font-size: 25px; color: white; text-decoration: none" data-toggle="collapse">Progress presentation 2</a>
<div id="pp2" class="collapse mt-4">
<div class="card bg-white shadow-lg">
<div class="card-header">
<h1 class="card-title">Progress Presentation - 2</h1>
</div>
<div class="card-body">
<h3 class="font-weight-bold">Description</h3>
<div class="justify-content-center">
<p class="card-text">The main purpose of this presentation was to show the progress of the
project. It was expected that 90% of the project to be completed.</p>
</div>
<h3 class="font-weight-bold">Date</h3>
<div class="justify-content-center">
<i class="glyphicon glyphicon-time"></i>
September 24, 2020
</div>
<h3 class="font-weight-bold">Marks</h3>
<div class="justify-content-center">
??
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card text-center">
<a href="#demo" class="card-header bg-info" style="padding: 7px; font-size: 25px; color: white; text-decoration: none" data-toggle="collapse">Demo</a>
<div id="demo" class="collapse mt-4">
<div class="card bg-white shadow-lg">
<div class="card-header">
<h1 class="card-title">Demo</h1>
</div>
<div class="card-body">
<h3 class="font-weight-bold">Description</h3>
<div class="justify-content-center">
<p class="card-text">The research project group had to design a Research Poster to provide a
basic understand about the Research. The content included were Introduction, Literature Survey,
Research Problem, Research Objectives, Methodology, Results and Discussion and Conclusion</p>
</div>
<h3 class="font-weight-bold">Date</h3>
<div class="justify-content-center">
<i class="glyphicon glyphicon-time"></i>
September 24, 2020
</div>
<h3 class="font-weight-bold">Marks</h3>
<div class="justify-content-center">
??
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card text-center">
<a href="#viva" class="card-header bg-info" style="padding: 7px; font-size: 25px; color: white; text-decoration: none" data-toggle="collapse">Final Assessment</a>
<div id="viva" class="collapse mt-4">
<div class="card bg-white shadow-lg">
<div class="card-header">
<h1 class="card-title">Final Assessment</h1>
</div>
<div class="card-body">
<h3 class="font-weight-bold">Description</h3>
<div class="justify-content-center">
<p class="card-text">??</p>
</div>
<h3 class="font-weight-bold">Date</h3>
<div class="justify-content-center">
<i class="glyphicon glyphicon-time"></i>
To be Informed
</div>
<h3 class="font-weight-bold">Marks</h3>
<div class="justify-content-center">
??
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--end of row-->
<!--beginning of the timeline-->
<!-- <ul class="timeline">-->
<!-- <!–timeline - 1–>-->
<!-- <li data-aos="fade-right">-->
<!-- <div class="timeline-badge"><i class="glyphicon glyphicon-check"></i></div>-->
<!-- <div class="timeline-panel">-->
<!-- <div class="timeline-heading">-->
<!-- <h4 class="timeline-title">Project Proposal Presentation</h4>-->
<!-- <p><small class="text-muted"><i class="glyphicon glyphicon-time"></i> 11 hours ago via-->
<!-- Twitter</small></p>-->
<!-- </div>-->
<!-- <div class="timeline-body">-->
<!-- <p>Some text</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </li>-->
<!-- <!–end of timeline - 1–>-->
<!-- <!–timeline - 2–>-->
<!-- <li class="timeline-inverted" data-aos="fade-left">-->
<!-- <div class="timeline-badge warning"><i class="glyphicon glyphicon-credit-card"></i></div>-->
<!-- <div class="timeline-panel">-->
<!-- <div class="timeline-heading">-->
<!-- <h4 class="timeline-title">Progress Presentation - I</h4>-->
<!-- </div>-->
<!-- <div class="timeline-body">-->
<!-- <p>Some text...</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </li>-->
<!-- <!–end of timeline - 2–>-->
<!-- <!–timeline - 3–>-->
<!-- <li data-aos="fade-right">-->
<!-- <div class="timeline-badge danger"><i class="glyphicon glyphicon-credit-card"></i></div>-->
<!-- <div class="timeline-panel">-->
<!-- <div class="timeline-heading">-->
<!-- <h4 class="timeline-title">Progress Presentation - II</h4>-->
<!-- </div>-->
<!-- <div class="timeline-body">-->
<!-- <p>Some text...</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </li>-->
<!-- <!–end of timeline - 3–>-->
<!-- <!–timeline - 4–>-->
<!-- <li class="timeline-inverted" data-aos="fade-left">-->
<!-- <div class="timeline-panel">-->
<!-- <div class="timeline-heading">-->
<!-- <h4 class="timeline-title">Demo (Camera-ready Poster)</h4>-->
<!-- </div>-->
<!-- <div class="timeline-body">-->
<!-- <p>Some text...</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </li>-->
<!-- <!–end of timeline - 4–>-->
<!-- <!–timeline - 5–>-->
<!-- <li data-aos="fade-right">-->
<!-- <div class="timeline-badge info"><i class="glyphicon glyphicon-floppy-disk"></i></div>-->
<!-- <div class="timeline-panel">-->
<!-- <div class="timeline-heading">-->
<!-- <h4 class="timeline-title">Final Assessment</h4>-->
<!-- </div>-->
<!-- <div class="timeline-body">-->
<!-- <p>Some text...</p>-->
<!-- <hr>-->
<!-- <div class="btn-group">-->
<!-- <button class="btn btn-primary btn-sm dropdown-toggle" data-toggle="dropdown"-->
<!-- type="button">-->
<!-- <i class="glyphicon glyphicon-cog"></i>-->
<!-- <span>View more</span>-->
<!-- </button>-->
<!-- <ul class="dropdown-menu" role="menu">-->
<!-- <li><a href="#">Action</a></li>-->
<!-- <li><a href="#">Another action</a></li>-->
<!-- <li><a href="#">Something else here</a></li>-->
<!-- <li class="divider"></li>-->
<!-- <li><a href="#">Separated link</a></li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </li>-->
<!-- <!–end of timeline - 5–>-->
<!-- <!–timeline - 6–>-->
<!-- <li data-aos="fade-right">-->
<!-- <div class="timeline-panel">-->
<!-- <div class="timeline-heading">-->
<!-- <h4 class="timeline-title">Viva</h4>-->
<!-- </div>-->
<!-- <div class="timeline-body">-->
<!-- <p>Some text...</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </li>-->
<!-- <!–end of timeline - 6–>-->
<!-- </ul>-->
<!--end of the timeline-->
</div>
<div style="height: 100px"></div>
</section>
<!-- End About Section -->
<!-- ======= Services Section ======= -->
<section class="documents section-bg" id="documents">
<div class="container">
<div class="section-title">
<h2 data-aos="fade-in">Documents</h2>
<!-- <p data-aos="fade-in">Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>-->
</div>
<!-- documents row-->
<div class="row">
<!--project charter document-->
<div class="col-md-3 d-flex align-items-stretch" data-aos="fade-right">
<div class="card">
<a href="https://drive.google.com/file/d/1DRr_m2lqWN7Md8akLOeOB16hW4ytqbkV/view?usp=sharing" style="text-decoration: none">
<div class="card-img">
<img alt="..." src="assets/img/documents/08.png">
</div>
<div class="card-inner text-center">
<div class="header">
<h2>Project Charter</h2>
</div>
</div>
</a>
</div>
</div>
<!-- end of project charter document-->
<!-- proposal documents-->
<div class="col-md-3 d-flex align-items-stretch" data-aos="fade-left">
<div class="card">
<a href="https://drive.google.com/file/d/1LpSWOBgxhZeqVxyTBFg0vICFE8BXi9__/view?usp=sharing" style="text-decoration: none">
<div class="card-img">
<img alt="..." src="assets/img/documents/08.png">
</div>
<div class="card-inner text-center">
<div class="header">
<h2>Project Proposal</h2>
</div>
</div>
</a>
</div>
</div>
<!-- end of proposal documents-->
<!-- research paper -->
<div class="col-md-3 d-flex align-items-stretch" data-aos="fade-right">
<div class="card">
<a href="https://drive.google.com/file/d/1L6jMzmAJ8tI6jwOr_drzLSZpzRSEQGx7/view?usp=sharing" style="text-decoration: none">
<div class="card-img">
<img alt="..." src="assets/img/documents/08.png">
</div>
<div class="card-inner text-center">
<div class="header">
<h2>Research Paper</h2>
</div>
</div>
</a>
</div>
</div>
<!-- end of research paper -->
<!-- final thesis-->
<div class="col-md-3 d-flex align-items-stretch" data-aos="fade-left">
<div class="card">
<a href="https://drive.google.com/file/d/1Qma23sGsjHh9u2WnaAR_VPG0p7rApTSg/view?usp=sharing" style="text-decoration: none">
<div class="card-img">
<img alt="..." src="assets/img/documents/08.png">
</div>
<div class="card-inner text-center">
<div class="header">
<h2>Final Thesis</h2>
</div>
</div>
<div class="card-body">
<div class="dropdown show">
<a class="btn btn-info dropdown-toggle btn-block" href="#" role="button"
id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
View more
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
<a class="dropdown-item"
href="https://drive.google.com/file/d/10ABw2L3xLK2WispcjMuyXG_vwUS_2cjM/view?usp=sharing">IT17138000</a>
<a class="dropdown-item"
href="https://drive.google.com/file/d/18K63kV65Hmvc-F4oX4JSBK37KoeFha3S/view?usp=sharing">IT17097284</a>
<a class="dropdown-item"
href="https://drive.google.com/file/d/1BfxIt-iTpnSnWEbUajfpDahsi6YhBenf/view?usp=sharing">IT17098960</a>
<a class="dropdown-item"
href="https://drive.google.com/file/d/1FYxarfpV63CjCi45ZNfOQZ5OPOhsFWaK/view?usp=sharing">IT17100908</a>
</div>
</div>
</div>
</a>
</div>
</div>
<!-- end of final thesis-->
</div>
<!-- end of documents row-->
<hr>
</div>
</section><!-- End Services Section -->
<!-- ======= Documents Section ======= -->
<section class="presentation section-bg" id="presentation">
<div class="container">
<div class="section-title">
<h2 data-aos="fade-in">Presentation</h2>
</div>
<div class="row content">
<div class="col-md-5" data-aos="fade-right">
<img alt="" class="img-fluid" src="assets/img/presentations/proposal.PNG">
</div>
<div class="col-md-7 pt-4" data-aos="fade-left">
<a href="https://drive.google.com/file/d/14-ySPADcmmWZX4Ivc9MUBDgUK0AJEYcx/view?usp=sharing">
<h2>Proposal Presentation</h2>
<hr style="height:2px;border-width:2px;color:gray;background-color:#284864">
</a>
<!-- <ul>-->
<!-- <li><i class="icofont-check"></i> Ullamco laboris nisi ut aliquip ex ea commodo consequat.</li>-->
<!-- <li><i class="icofont-check"></i> Duis aute irure dolor in reprehenderit in voluptate velit.-->
<!-- </li>-->
<!-- </ul>-->
</div>
</div>
<div class="row content">
<div class="col-md-5 order-1 order-md-2" data-aos="fade-right">
<img alt="" class="img-fluid" src="assets/img/presentations/pp1.PNG">
</div>
<div class="col-md-7 pt-5 order-2 order-md-1" data-aos="fade-left">
<a href="https://drive.google.com/file/d/1YWvLFZvCnrMKk4uSbVf4AhbXNChq7bZ4/view?usp=sharing">
<h2>Progress Presentation - I</h2>
<hr style="height:2px;border-width:2px;color:gray;background-color:#284864">
</a>
</div>
</div>
<div class="row content">
<div class="col-md-5" data-aos="fade-right">
<img alt="" class="img-fluid" src="assets/img/presentations/pp2.PNG">
</div>
<div class="col-md-7 pt-5" data-aos="fade-left">
<a href="https://drive.google.com/file/d/1rcbsZPKKuP03xnGZ9c07l-sh-TmDstNG/view?usp=sharing">
<h2>Progress Presentation - II</h2>
<hr style="height:2px;border-width:2px;color:gray;background-color:#284864">
</a>
<!-- <ul>-->
<!-- <li><i class="icofont-check"></i> Ullamco laboris nisi ut aliquip ex ea commodo consequat.</li>-->
<!-- <li><i class="icofont-check"></i> Duis aute irure dolor in reprehenderit in voluptate velit.-->
<!-- </li>-->
<!-- <li><i class="icofont-check"></i> Facilis ut et voluptatem aperiam. Autem soluta ad fugiat.</li>-->
<!-- </ul>-->
</div>
</div>
<div class="row content">
<div class="col-md-5 order-1 order-md-2" data-aos="fade-left">
<img alt="" class="img-fluid" src="assets/img/presentations/final_presentation.png">
</div>
<div class="col-md-7 pt-5 order-2 order-md-1" data-aos="fade-right">
<a href="#">
<h1>Final Presentation</h1>
<hr style="height:2px;border-width:2px;color:gray;background-color:#284864">
</a>
</div>
</div>
</div>
</section><!-- End Features Section -->
<!-- ======= About Us Section ======= -->
<section class="team section-bg" id="aboutUs">
<div class="container">
<div class="section-title">
<h2 data-aos="fade-in">About Us</h2>
</div>
<div class="section-title">
<h4 data-aos="fade-in">Supervisors</h4>
<!-- <p data-aos="fade-in">Magnam dolores commodi suscipit. Necessitatibus eius consequatur ex aliquid fuga eum quidem. Sit sint consectetur velit. Quisquam quos quisquam cupiditate. Et nemo qui impedit suscipit alias ea. Quia fugiat sit in iste officiis commodi quidem hic quas.</p>-->
</div>
<!-- About Us - Supervisors-->
<div class="row">
<div class="col-xl-3 col-lg-4 col-md-6">
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="member" data-aos="fade-up">
<div class="pic"><img alt="" src="assets/img/about_us/Samantha_sir.jpg"></div>
<h4>Samantha Rajapaksha</h4>
<span>Senior Lecturer</span>
<!-- <div class="social">-->
<!-- <a href=""><i class="icofont-twitter"></i></a>-->
<!-- <a href=""><i class="icofont-facebook"></i></a>-->
<!-- <a href=""><i class="icofont-instagram"></i></a>-->
<!-- <a href=""><i class="icofont-linkedin"></i></a>-->
<!-- </div>-->
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="member" data-aos="fade-up">
<div class="pic"><img alt="" src="assets/img/about_us/Dinuka_miss.jpg"></div>
<h4>Ms. Dinuka Wijendra</h4>
<span>Lecturer</span>
<!-- <div class="social">-->
<!-- <a href=""><i class="icofont-twitter"></i></a>-->
<!-- <a href=""><i class="icofont-facebook"></i></a>-->
<!-- <a href=""><i class="icofont-instagram"></i></a>-->
<!-- <a href=""><i class="icofont-linkedin"></i></a>-->
<!-- </div>-->
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
</div>
</div>
<!-- End of About Us - Supervisors-->
<!--About Us - Group Members-->
<div class="section-title mt-4">
<h4 data-aos="fade-in">Group Members</h4>
</div>
<div class="row">
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="member" data-aos="fade-up">
<div class="pic"><img alt="" src="assets/img/about_us/Ishan.jpg"></div>
<h4>Ishan Seneviratne</h4>
<span>Group Leader</span>
<!-- <div class="social">-->
<!-- <a href=""><i class="icofont-twitter"></i></a>-->
<!-- <a href=""><i class="icofont-facebook"></i></a>-->
<!-- <a href=""><i class="icofont-instagram"></i></a>-->
<!-- <a href=""><i class="icofont-linkedin"></i></a>-->
<!-- </div>-->
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="member" data-aos="fade-up" data-aos-delay="100">
<div class="pic"><img alt="" src="assets/img/about_us/sohan.PNG"></div>
<h4>Sohan Perera</h4>
<span>Member</span>
<!-- <div class="social">-->
<!-- <a href=""><i class="icofont-twitter"></i></a>-->
<!-- <a href=""><i class="icofont-facebook"></i></a>-->
<!-- <a href=""><i class="icofont-instagram"></i></a>-->
<!-- <a href=""><i class="icofont-linkedin"></i></a>-->
<!-- </div>-->
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="member" data-aos="fade-up" data-aos-delay="200">
<div class="pic"><img alt="" src="assets/img/about_us/sachith.jpg"></div>
<h4>Sachith Fernando</h4>
<span>Member</span>
<!-- <div class="social">-->
<!-- <a href=""><i class="icofont-twitter"></i></a>-->
<!-- <a href=""><i class="icofont-facebook"></i></a>-->
<!-- <a href=""><i class="icofont-instagram"></i></a>-->
<!-- <a href=""><i class="icofont-linkedin"></i></a>-->
<!-- </div>-->
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="member" data-aos="fade-up" data-aos-delay="300">
<div class="pic"><img alt="" src="assets/img/about_us/linisha.jpg"></div>
<h4>Linisha Siriwardana</h4>
<span>Member</span>
<!-- <div class="social">-->
<!-- <a href=""><i class="icofont-twitter"></i></a>-->
<!-- <a href=""><i class="icofont-facebook"></i></a>-->
<!-- <a href=""><i class="icofont-instagram"></i></a>-->
<!-- <a href=""><i class="icofont-linkedin"></i></a>-->
<!-- </div>-->
</div>
</div>
</div>
<!--End of About Us - Group members-->
</div>
</section><!-- End Team Section -->
<!-- ======= Contact Section ======= -->
<section class="contact section-bg" id="contact">
<div class="container">
<div class="section-title">
<h2 data-aos="fade-in">Contact</h2>
<p data-aos="fade-in">Make contact via the details below to get in touch with us.</p>
</div>
<div class="row">
<div class="col-lg-6">
<div class="row">
<div class="col-md-12">
<div class="info-box" data-aos="fade-up">
<i class="bx bx-map"></i>
<h3>Our Address</h3>
<p>Sri Lanka Institute of Information Technology, New Kandy Rd, Malabe 10115</p>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<form action="forms/contact.php" class="php-email-form" data-aos="fade-up" method="post"
role="form">
<div class="form-row">
<div class="col-md-6 form-group">
<input class="form-control" data-msg="Please enter at least 4 chars"
data-rule="minlen:4" id="name" name="name"
placeholder="Your Name" type="text"/>
<div class="validate"></div>
</div>
<div class="col-md-6 form-group">
<input class="form-control" data-msg="Please enter a valid email" data-rule="email"
id="email"
name="email" placeholder="Your Email"
type="email"/>
<div class="validate"></div>
</div>
</div>
<div class="form-group">
<input class="form-control" data-msg="Please enter at least 8 chars of subject"
data-rule="minlen:4" id="subject" name="subject"
placeholder="Subject" type="text"/>
<div class="validate"></div>
</div>
<div class="form-group">
<textarea class="form-control" data-msg="Please write something for us" data-rule="required"
name="message"
placeholder="Message" rows="5"></textarea>
<div class="validate"></div>
</div>
<div class="mb-3">
<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your message has been sent. Thank you!</div>
</div>
<div class="text-center">
<button type="submit">Send Message</button>
</div>
</form>
</div>
</div>
</div>
</section><!-- End Contact Section -->
</main><!-- End #main -->
<!-- ======= Footer ======= -->
<footer id="footer">
<div class="footer-top">
<div class="container" data-aos="fade-up">
<div class="row justify-content-center">
<div class="col-lg-6">
<h3>SLPES</h3>
<p>Taking the classroom monitoring to the next level with SLPES</p>
</div>
</div>
</div>
</div>
<div class="container footer-bottom clearfix">
<div class="copyright">
© Copyright <strong><span>SLPES</span></strong>. All Rights Reserved
</footer><!-- End Footer -->
<a class="back-to-top" href="#"><i class="icofont-simple-up"></i></a>
<!-- Vendor JS Files -->
<!--<script src="assets/vendor/jquery/jquery.min.js"></script>-->
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/jquery.easing/jquery.easing.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/owl.carousel/owl.carousel.min.js"></script>
<script src="assets/vendor/venobox/venobox.min.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>-->
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>