-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
232 lines (232 loc) · 13.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="RoadVisor, an augmented reality navigation application providing real-time traffic information and enhancing driving experience." />
<meta name="author" content="RoadVisor Team" />
<title>RoadVisor: Your trusted companion on the road</title>
<!-- Favicon-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico" />
<!-- Font Awesome icons (free version)-->
<script src="https://use.fontawesome.com/releases/v6.3.0/js/all.js" crossorigin="anonymous"></script>
<!-- Google fonts-->
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700" rel="stylesheet" type="text/css" />
<!-- Core theme CSS (includes Bootstrap)-->
<link href="css/styles.css" rel="stylesheet" />
</head>
<body id="page-top">
<!-- Navigation-->
<nav class="navbar navbar-expand-lg navbar-dark fixed-top" id="mainNav">
<div class="container">
<a class="navbar-brand" href="#page-top"><span style="color:#fed136; font-family: Roboto; font-weight: bold; font-size: 24px; margin-left: 10px;">RoadVisor</span></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
Menu
<i class="fas fa-bars ms-1"></i>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav text-uppercase ms-auto py-4 py-lg-0">
<li class="nav-item"><a class="nav-link" href="#features">Features</a></li>
<li class="nav-item"><a class="nav-link" href="#team">Team</a></li>
<li class="nav-item"><a class="nav-link" href="#project-advisors">Project Advisors</a></li>
<li class="nav-item"><a class="nav-link" href="#reports">Reports</a></li>
<li class="nav-item"><a class="nav-link" href="#user-manual">User Manual</a></li>
<li class="nav-item"><a class="nav-link" href="#presentation">Presentation</a></li>
</ul>
</div>
</div>
</nav>
<!-- Masthead-->
<header class="masthead">
<div class="container">
<div class="masthead-subheading">Welcome to RoadVisor!</div>
<div class="masthead-heading text-uppercase">Smart AR Navigation</div>
<a class="btn btn-primary btn-xl text-uppercase" href="#introduction">Discover More</a>
</div>
</header>
<!-- Brief Introduction-->
<section class="page-section bg-light" id="introduction">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Brief Introduction to RoadVisor</h2>
</div>
<div class="row">
<div class="col-lg-8 mx-auto text-center">
<p class="large text-muted">RoadVisor is an innovative augmented reality navigation application designed to enhance your driving experience. By combining real-time traffic information with advanced computer vision techniques, RoadVisor aims to provide a safer, more efficient, and enjoyable journey for drivers. Discover how our cutting-edge technology can improve your time on the road and make driving a pleasure.</p>
</div>
</div>
</div>
</section>
<!-- Features-->
<section class="page-section" id="features">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Features</h2>
<h3 class="section-subheading text-muted">Enhance your driving experience with RoadVisor's cutting-edge technology.</h3>
</div>
<div class="row text-center">
<div class="col-md-3">
<img class="img-fluid mx-auto mb-3" src="assets/img/features/ar-navigation.jpeg" alt="Augmented Reality Navigation" />
<h4 class="my-3">Augmented Reality Navigation</h4>
<p class="text-muted">RoadVisor provides an AR-based navigation system that overlays directions on the real-time camera view, making it easier for drivers to follow the route and stay focused on the road.</p>
</div>
<div class="col-md-3">
<img class="img-fluid mx-auto mb-3" src="assets/img/features/sign-detection.jpeg" alt="Traffic Light & Sign Detection" />
<h4 class="my-3">Traffic Light & Sign Detection</h4>
<p class="text-muted">RoadVisor detects traffic lights and signs in real-time, providing drivers with important information about the road ahead, ensuring they remain aware and compliant with traffic regulations.</p>
</div>
<div class="col-md-3">
<img class="img-fluid mx-auto mb-3" src="assets/img/features/pedestrian-detection.jpeg" alt="Pedestrian Detection" />
<h4 class="my-3">Pedestrian Detection</h4>
<p class="text-muted">RoadVisor uses advanced computer vision techniques to detect pedestrians in the camera view, helping drivers stay aware of their surroundings and prevent accidents.</p>
</div>
<div class="col-md-3">
<img class="img-fluid mx-auto mb-3" src="assets/img/features/emergency-assistance.jpeg" alt="Driving Analytics & Feedback" />
<h4 class="my-3">Emergency Assistance</h4>
<p class="text-muted">RoadVisor enables users to quickly send SOS messages to designated contacts in case of emergencies or accidents.</p>
</div>
</div>
</div>
</section>
<!-- Team-->
<section class="page-section bg-light" id="team">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Meet The Team</h2>
<h3 class="section-subheading text-muted">Our motivated group of enthusiastic computer engineering students.</h3>
</div>
<div class="row justify-content-center">
<div class="col-lg-2">
<div class="team-member">
<!-- a -->
<img class="mx-auto rounded-circle" src="assets/img/team/1.jpeg" alt="Ahmet Faruk Ulutaş" />
<h4>Ahmet Faruk Ulutaş</h4>
<p class="text-muted">Full-stack Development & AR & ML</p>
<a href="https://www.linkedin.com/in/farukulutas/" target="_blank"><i class="fab fa-linkedin fa-lg"></i></a>
</div>
</div>
<div class="col-lg-2">
<div class="team-member">
<!-- b -->
<img class="mx-auto rounded-circle" src="assets/img/team/2.jpeg" alt="Arda İçöz" />
<h4>Arda İçöz</h4>
<p class="text-muted">Frontend Development & AR</p>
<a href="https://www.linkedin.com/in/arda-icoz/" target="_blank"><i class="fab fa-linkedin fa-lg"></i></a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-8 mx-auto text-center">
<p class="large text-muted">Our team comprises dedicated computer engineering students with diverse skills and knowledge, collaborating on this capstone project to develop innovative solutions for safer and more efficient driving experiences.</p>
</div>
</div>
</div>
</section>
<section class="page-section bg-light" id="project-advisors">
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Meet The Project Advisors</h2>
<h3 class="section-subheading text-muted">Our distinguished mentors guiding us through our computer engineering capstone project.</h3>
</div>
<div class="row justify-content-center">
<div class="col-lg-2">
<div class="team-member">
<!-- a -->
<img class="mx-auto rounded-circle" src="assets/img/team/6.jpeg" alt="Hamdi Dibeklioğlu" />
<h4>Dr. Hamdi Dibeklioğlu</h4>
<p class="text-muted">Supervisor Instructor</p>
<a href="https://www.linkedin.com/in/dibeklioglu/" target="_blank"><i class="fab fa-linkedin fa-lg"></i></a>
</div>
</div>
<div class="col-lg-2">
<div class="team-member">
<!-- b -->
<img class="mx-auto rounded-circle" src="assets/img/team/7.jpeg" alt="Erhan Dolak" />
<h4>Erhan Dolak</h4>
<p class="text-muted">Course Instructor</p>
<a href="https://www.linkedin.com/in/erhandolak/" target="_blank"><i class="fab fa-linkedin fa-lg"></i></a>
</div>
</div>
<div class="col-lg-2">
<div class="team-member">
<!-- c -->
<img class="mx-auto rounded-circle" src="assets/img/team/8.jpeg" alt="Tagmac Topal" />
<h4>Tagmac Topal</h4>
<p class="text-muted">Course Instructor</p>
<a href="https://www.linkedin.com/in/tagmac-topal-06a8879/" target="_blank"><i class="fab fa-linkedin fa-lg"></i></a>
</div>
</div>
<div class="col-lg-2">
<div class="team-member">
<!-- d -->
<img class="mx-auto rounded-circle" src="assets/img/team/9.jpeg" alt="Cem Çimenbiçer" />
<h4>Cem Çimenbiçer</h4>
<p class="text-muted">Innovation Expert</p>
<a href="https://www.linkedin.com/in/daegoth/" target="_blank"><i class="fab fa-linkedin fa-lg"></i></a>
</div>
</div>
</div>
</section>
<!-- Reports and User Manual -->
<div class="py-5" id=reports>
<div class="container">
<div class="text-center">
<h2 class="section-heading text-uppercase">Reports</h2>
</div>
<div class="row text-center">
<div class="col-md-3 col-sm-6 my-3">
<i class="fas fa-file-alt fa-4x"></i>
<h4 class="my-3">Project Specification Report</h4>
<a href="assets/reports/T2317_Project_Specification_Document.pdf" class="btn btn-primary" download>Download</a>
</div>
<div class="col-md-3 col-sm-6 my-3">
<i class="fas fa-file-alt fa-4x"></i>
<h4 class="my-3">Analysis and Requirement Report</h4>
<a href="assets/reports/T2317_Analysis_Requirements_Report.pdf" class="btn btn-primary" download>Download</a>
</div>
<div class="col-md-3 col-sm-6 my-3">
<i class="fas fa-file-alt fa-4x"></i>
<h4 class="my-3">Detailed Design Report</h4>
<a href="assets/reports/T2317_Detail_Design_Document.pdf" class="btn btn-primary" download>Download</a>
</div>
<div class="col-md-3 col-sm-6 my-3">
<i class="fas fa-file-alt fa-4x"></i>
<h4 class="my-3">Final Report</h4>
<a href="assets/reports/T2317_FinalReport.pdf" class="btn btn-primary" download>Download</a>
</div>
</div>
<div class="row text-center my-5" id=user-manual>
<div class="col-12 my-3">
<h3 class="section-heading text-uppercase mb-4">User Manual</h3>
<i class="fas fa-file-alt fa-4x"></i>
<h4 class="my-3">User Manual</h4>
<a href="assets/reports/User_Manual.pdf" class="btn btn-primary" download>Download</a>
</div>
</div>
</div>
</div>
<div class="py-5 bg-light" id="presentation">
<div class="container">
<div class="row text-center my-5">
<div class="col-12 my-3">
<h3 class="section-heading text-uppercase mb-4">Presentation</h3>
<iframe src="assets/presentation/RoadVisor.pdf" style="width:100%; height:1000px;" frameborder="0"></iframe>
</div>
</div>
</div>
</div>
<!-- Footer-->
<footer class="footer py-4">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-12 text-center">Copyright © RoadVisor 2023</div>
</div>
</div>
</footer>
<!-- Bootstrap core JS-->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<!-- Core theme JS-->
<script src="js/scripts.js"></script>
</body>
</html>