-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
124 lines (119 loc) · 6.83 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Inavicon</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
<link rel="icon" href="media/favicon.ico" type="image/x-icon">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
<script src="js/scroll.js"></script>
<script src="js/menuMarker.js"></script>
<meta property="og:title" content="Icon based indoor navigation" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://karlssonkristoffer.com/bachelor_thesis/" />
<meta property="og:description" content="A bachelor thesis looking in to a new concept of navigation" />
<meta property="og:image" content="http://karlssonkristoffer.com/bachelor_thesis/media/mapping.jpg" />
</head>
<body>
<div id="header" class="row animated">
<div id="navigation" class="row">
<div class="menu">
<a id="firstMenuItem" class="menuItem" href="#header">Home</a><br>
<a class="menuItem" href="#about">About the project</a><br>
<a class="menuItem" href="#works">How it works</a><br>
<a class="menuItem" href="#developers">Developers</a>
</div>
</div>
<div id="headerText" class="col center-block">
<h1>Bachelor Thesis in Cognitive Science</h1>
<h2>Icon based indoor navigation</h2>
<h3>Inavicon</h3>
</div>
<a id="arrowLink" class="menuItem animated" href="#about">
<span id="arrowImage" class="glyphicon glyphicon-menu-down"></span></a>
</div>
<div id="about" class="row page">
<div id="aboutContent" class="pageContent row">
<h3>What is this project about?</h3>
<div id="aboutText" class="col-md-4 text">
<h4>The fault with navigation aids of today</h4>
<p>Research has shown that we are getting worse at navigating when using tools like Google Maps. One major
reason for this is that we do not pay enough attention to the environment. Instead we are looking at
our dot on a small screen and follows that. We do not interact with our surroundings. <br>
There is also a hype on indoor navigation. But the solutions today uses the same interface as
outdoor-services. This will leave us with the same problem.
</p>
<h4>The solution?</h4>
<p>In this project we will develop a indoor navigation app where the users are presented with a set of icons
that will guide them between checkpoints to their goal. This will force interaction with the
surroundings in a easy way</p>
</div>
<div id="aboutImageDiv" class="col-md-8">
<figure>
<img id="aboutImage" src="media/mapping.jpg" class="img-responsive">
<figcaption>A picture of the data-collection to map a building</figcaption>
</figure>
</div><br>
</div>
</div>
<div id="works" class="row page">
<div id="worksContent" class="pageContent row">
<h3>How does it work?</h3>
<div id="worksImageDiv" class="col-md-8">
<img id="worksImage" src="media/using.png" class="img-responsive">
</div>
<div id="worksText" class="col-md-4 text">
<p>The app will run on an Android device and present icons for the user to follow. Each icon represents
a place or a thing in the real world that the user has to pass to find his or her destination.
To accomplish this we are using IndoorAtlas to map up a building. IndoorAtlas uses radio waves,
magnetic fields, acoustic signals and other sensory information collected by a smartphone device to
finger print positions indoors. By using these fingerprints we later can determine the position of the
user. <br> We also uses Proximi.io:s services for adding Geofences. Geofences is basically an area on a
map that we have marked out that, when entered, triggers an event in our app and changes the icon on
display. </p>
</div>
<div id="video" class="row">
<iframe id="videoFrame" class="col" width="570" height="325"
src="https://www.youtube.com/embed/45_0j63rows?controls=1" frameborder="0" allowfullscreen>
</iframe>
</div>
</div>
</div>
<div id="developers" class="row page">
<div id="developersContent" class="pageContent row">
<h3>Who develops it?</h3>
<div id="kristofferImageDiv" class="col-md-4 profile">
<img id="kristofferImage" src="media/kristoffer.jpg" class="img-responsive img-circle profileImage">
<h4>Kristoffer Karlsson</h4>
</div>
<div id="arvidImageDiv" class="col-md-4 profile">
<img id="arvidImage" src="media/arvid2.jpg" class="img-responsive img-circle profileImage">
<h4>Arvid Horned</h4>
</div>
<div id="contacts" class="row">
<div id="git" class="col-md-12">
<h3>View the code and read the thesis</h3>
<a href="https://github.com/kristofferkarlsson93/Inavicon">
<img id="gitImage" class="img-responsive animated" src="media/GitHub-Mark-120px-plus.png">
</a>
<button id="thesisButton" type="button" class="btn btn-info"
onClick="window.open('media/Bachelor_Thesis%20_Horned_Karlsson_final.pdf');">Read thesis</button>
</div>
</div>
</div>
</div>
</body>
</html>