-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
178 lines (172 loc) · 8.97 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.5.0/pure-min.css">
<link href="http://fonts.googleapis.com/css?family=Abel" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="stylesheets/lightbox.css">
<link href="stylesheets/style.css" rel="stylesheet" type="text/css" media="screen"></link>
</head>
<body>
<nav>
<div class="container">
<img class="logo" src="./images/logo.svg" height="80px">
<ul>
<li><a href="">Bot</a></li>
<li><a href="">Team</a></li>
<li><a href="">Press Releases</a></li>
<li><a href="">Partners</a></li>
</ul>
</div>
</nav>
<section id="beachbot-section" style="background-image: url(images/b.jpg); height: 700px" >
<h1>BeachBot</h1>
<!-- <img src="./images/logo.svg" width="600px">
--> </section>
<section>
<div class="pure-g">
<div class="pure-u-1-1 centertext">
<h2>Worlds first autonomous sand art robot</h2>
<p></p></div>
</div>
</section>
<section id="photos" class="content-section">
<div class="pure-g">
<div class="pure-u-1-5">
<a data-lightbox="lb1" style="background: #FE6C30 url(images/sl/IMG_0719.jpg); background-size: cover;" href="images/sl/IMG_0719.jpg" class="imagethumb">
</a>
</div> <div class="pure-u-1-5">
<a href="images/sl/atWattunfinished.jpg" data-lightbox="lb1" style="background: #FE6C30 url(images/sl/atWattunfinished.jpg); background-size: cover;" class="imagethumb">
</a>
</div> <div class="pure-u-1-5">
<a href="images/sl/IMG_1042.jpg" data-lightbox="lb1" style="background: #FE6C30 url(images/sl/IMG_1042.jpg); background-size: cover;" class="imagethumb">
</a>
</div> <div class="pure-u-1-5">
<a href="images/sl/happy.jpg" data-lightbox="lb1" style="background: #FE6C30 url(images/sl/happy.jpg); background-size: cover;" class="imagethumb">
</a>
</div> <div class="pure-u-1-5">
<a href="images/sl/IMG_0675.jpg" data-lightbox="lb1" style="background: #FE6C30 url(images/sl/IMG_0675.jpg); background-size: cover;" class="imagethumb">
</a>
</div>
</div>
</section>
<section class="content-section">
<div class="pure-g">
<div class="pure-u-1-2">
<h2>The Project</h2>
<p>The BeachBot is an autonomous robot that can create large scale sand art. The robot will
be deployed at a public beach to amaze beachgoers who pass by. Not only the
final picture is important, the whole drawing process will provide an exceptional,
magical show.</p>
<p>
The BeachBot is not just a lifeless, mechanical being; it is a friendly looking creature with a soul. </p>
<h2 class="">Technical Concept</h2>
<p>The BeachBot is 60 cm in length and 40 cm in both width and height. To provide maximal mobility and enough robustness a 3 wheel arrangement with differential drive back wheels and a steered wheel in the front is used.</p>
<p>The BeachBot carves pictures into sand with a rake consisting of seven individual movable elements actuated by servo motors. They are attached at the tail of the robot. This solution leads to great visibility of the drawn lines and to a large variety in line width, from minimal 5 cm up to the width of the robot.</p>
<p>To be able to draw precisely the BeachBot needs accurate localization. The concept consists of an laser scanner mounted on the robot plus reflective poles, marking the border of the drawing field. (Therefore the laser can create an active map of its surrounding.)</p>
<p>To withstand the rough condition on the beach, the robot must be completely sealed from sand. An aluminum shell and sealing lips make sure no sand enters the interior of the BeachBot.</p><p>
Smart software is used to transform images into sand art as well as to control the robot's movement to ensure a spectacular drawing process.</p>
<p>To be visually appealing the industrial design students of ZHdK created an enchanting cover for the BeachBot
in the shape of a turtle.</p>
<h2>Testing, Prototyping, CAD Process</h2>
<p>To come up with the final technical concept a lot of prototyping and testing needed to be done.
The very first task was to set up a testing environment, which suited our needs. A mini test beach with 3 cubic meters of sand was set up.</p>
<p>To test different wheel arrangements and robot weights the “motorized prototype” was built.</p>
<p>To come up with an optimal mechanical solution for the drawing tool a lot of prototypes were build. (e.g. early rake prototype).</p>
</div>
<div class="pure-u-1-2">
<div class="pure-g">
<div class="pure-u-1-1 gimage" style="background-image: url(images/beachbot1.jpg);">
</div>
<div class="pure-u-1-1 gimage" style="background-image: url(images/beachbot2.jpg);">
</div>
</div>
</div>
</div>
</div>
</section>
<section id="team-section" class="content-section">
<div class="pure-g">
<div class="pure-u-1-1">
<h2>About us</h2>
</div>
<div class="pure-u-1-2">
<p>Focus Projects at ETH Zurich offer students the opportunity to deepen their knowledge in a project-based environment instead of visiting regular courses. Spanning two semesters, teams of 5-8 students work in various fields of mechanical engineering, designing and constructing a prototype that is presented in a project rollout in the main hall of ETH at the end of the spring semester.</p>
<p>Our Team consists of 7 mechanical engineers and one electrical engineer from ETH Zurich complemented by 2 industrial designers from the Zurich University of the Arts (ZHdK). </p>
</div>
<div class="pure-u-1-2 gimage" style="background-image: url(images/team.jpg)">
</div>
<div class="pure-u-1-1 small-head">
<h2>Hardware</h2>
</div>
<div class="pure-u-1-4">
<h3>Timo Müller</h3>
<p>Locomotion</p>
</div>
<div class="pure-u-1-4">
<h3>Jonathan Huber</h3>
<p>Steering Mechanism</p>
</div>
<div class="pure-u-1-4">
<h3>Roman Müller</h3>
<p>Drawing Mechanism</p>
</div>
<div class="pure-u-1-4">
<h3>Markus Stäuble</h3>
<p>Sensor Suspension</p>
</div>
<div class="pure-u-1-1 small-head">
<h2>Software</h2>
</div>
<div class="pure-u-1-4">
<h3>Timon Homberger</h3>
<p>Control</p>
</div>
<div class="pure-u-1-4">
<h3>Lorenz Wellhausen</h3>
<p>Localization</p>
</div>
<div class="pure-u-1-4">
<h3>Wolf Vollprecht</h3>
<p>Path Planning</p>
</div>
<div class="pure-u-1-1 small-head">
<h2>Industrial Design and Electrical Engineering</h2>
</div>
<div class="pure-u-1-4">
<h3>Manuel Rossegger</h3>
<p>Industrial Design</p>
</div>
<div class="pure-u-1-4">
<h3>Philipp Bühler</h3>
<p>Industrial Design</p>
</div>
<div class="pure-u-1-4">
<h3>Dominik Rüttimann</h3>
<p>Electrical Engineering</p>
</div>
</div>
</section>
<section class="content-section">
<div class="pure-g">
<div class="pure-u-1-1">
<h2>Contact / Facebook</h2>
</div>
<div class="pure-u-1-1">
<h2>Address</h2>
<p>Leonhardstrasse 27<br>LEO B8.4<br>8052 Zürich<br>Tel: 044 633 82 21
<br><br>Email us: <a href="mailto:[email protected]">[email protected]</a>
</p>
<h2>Like us on <a href="https://www.facebook.com/eth.beachbot">Facebook</a>!</h2>
<p>To get all the latest news from the BeachBot project!</p>
</div>
</div>
</section>
</body>
<script src="js/skrollr.min.js"></script>
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/lightbox.min.js"></script>
<script src="js/effects.js"></script>
</html>