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
|
<!DOCTYPE html>
<html lang="en">
<title>KIT-Campus in Minecraft</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="./stylesheets/w3stylesheet.css">
<link rel="stylesheet" href="./stylesheets/style.css" type="text/css" />
<link href="./feed.xml" type="application/xml" />
<!--todo die beiden minecraft schriften runterladen und selber hosten-->
<body>
<!-- Navbar -->
<div class="w3-top">
<div class="w3-bar w3-green w3-card w3-left-align w3-large">
<button onclick="myFunction()" class="w3-bar-item w3-button w3-padding-large w3-white">Home</button>
<a href="https://youtu.be/w41kzO3rxOQ"
class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Trailer</a>
<a href="./map" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white"
target="_blank">Live-Map</a>
<a href="https://discord.gg/dFGcb4jUd4"
class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Neu:
Survival
Games</a>
<a href="#campusfuehrung" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white">Event:
Campusführung (18.11. um 18 Uhr)</a>
<a href="https://discord.gg/dFGcb4jUd4"
class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Discord</a>
</div>
<!-- Navbar on small screens -->
<div id="navDemo" class="w3-bar-block w3-white w3-hide w3-hide-large w3-hide-medium w3-large" target="_blank">
<a href="https://youtu.be/w41kzO3rxOQ" class="w3-bar-item w3-button w3-padding-large"
target="_blank">Trailer</a>
<a href="./dynmap" class="w3-bar-item w3-button w3-padding-large" target="_blank">Live-Map</a>
<a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large" target="_blank">Neu:
Survival Games</a>
<a href="#campusfuehrung" class="w3-bar-item w3-button w3-padding-large">Event:
Campusführung (18.11. um 18 Uhr)</a>
<a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large"
target="_blank">Discord</a>
</div>
</div>
<!-- Header -->
<header class="w3-container w3-black w3-center"
style="padding:56px 16px 56px 16px; background-image: url('./schloss.png'); background-repeat: no-repeat; background-position: center; background-size: cover;">
<h1 class="w3-margin w3-jumbo mctitle">Der Minecraft Campus<br><br><br></h1>
<p class="w3-xlarge mcfont" style="color: rgb(234, 235, 243);">Besuche den KIT-Campus in Minecraft!</p>
</header>
<!-- First Grid -->
<div class="w3-row-padding w3-padding-64 w3-container">
<div class="w3-content">
<div class="w3-twothird">
<h1>Der KIT-Campus als Minecraft-Welt</h1>
<div class="w3-padding-32 w3-text mcfont">Um sich den virtuellen Campus anzusehen, benötigst du die
Minecraft Java Edition. So kommst du auf den Campus:
<ol>
<li>Starte Minecraft in der Version 1.16.3 oder neuer</li>
<li>Gehe auf Multiplayer > Server hinzufügen</li>
<li>Server-Adresse: "campus-kit.de"</li>
</ol>
</div>
</div>
<div class="w3-third w3-center">
<figure><img srcset="./grass.png"></figure>
</div>
</div>
</div>
<div class="w3-row-padding w3-padding-64 w3-container">
<div class="w3-content">
<h1>Was erwartet dich auf dem Campus?</h1>
<div class="w3-padding-64 w3-third w3-center">
<div style="display: block; margin:auto; position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; width: 100%; height: auto;"
class="w3-half">
<iframe style="position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;" width="718" height="303" src="https://www.youtube-nocookie.com/embed/w41kzO3rxOQ"
frameborder="0"
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen></iframe>
</div>
</div>
<div class="w3-twothird">
<div class="w3-padding-32 w3-text mcfont" style="margin-left:5%">
<ol>
<li>Erkunde den Campus anhand der Live-Karte (oben verlinkt) und vergleiche ihn mit der Realität
(wir empfehlen google maps).</li>
<li>Erfahre mehr über die Gebäude auf dem Campus - an einigen finden sich kleine Texte mit
Hintergründen.</li>
<li>Nimm teil an den Minigames auf dem Campus! Mehr Infos dazu findest du auf Discord.</li>
<li>Am 18.11. gibt es eine Campusführung um 18 Uhr.</li>
</ol>
</div>
</div>
<div id="campusfuehrung"></div>
<h1>Die Campusführung in Minecraft</h1>
<div class="w3-padding-32 w3-text mcfont">
Die Campusführung findet um 18 Uhr am 18.11. statt. <br>
Du kannst entweder in Minecraft mit herumlaufen während der Führung, oder du schaust einfach auf Zoom
zu.
<br>
Zoom-Zugangsdaten: <a
href="https://kit-lecture.zoom.us/j/65375315081?pwd=Ky9ZM1NLcWxCS0s5c3pDRHQvSWV2dz09"
target="_blank">https://kit-lecture.zoom.us/j/65375315081?pwd=Ky9ZM1NLcWxCS0s5c3pDRHQvSWV2dz09</a>
<br>
Meeting-ID: 653 7531 5081, Kenncode: 428117
</div>
</div>
</div>
<figure style="margin:0;">
<img width="100%" srcset="./mensa.png">
</figure>
<div class="w3-row-padding w3-padding-64 w3-container">
<div class="w3-content">
<h1>Wie realisiert man so ein Projekt in Minecraft?</h1>
<div class="w3-padding-32 w3-text mcfont">
Im Wesentlichen teilt sich das Vorgehen in unserem Fall zwei Schritte auf:
<ol>
<li>Man importiert vom Campus existierende 3D-Daten in Minecraft. Dann hat man schon mal die Umrisse
der Gebäude, aber die Texturen fehlen noch.</li>
<li>Man bearbeitet die Gebäude manuell, in unserem Fall mit "Worldedit". Dies benötigt sehr viel
Zeit, deshalb sind wir auch noch lange nicht mit allen Gebäuden fertig.</li>
</ol>
Noch ein Tipp zum Schluss: Erfahre mehr über die Entstehungsgeschichte der Aktion und über das Studium
am KIT aus der Sicht von Studierenden - in unserem neuen Podcast (siehe unten)!
</div>
</div>
</div>
<!-- Second Grid -->
<div class="w3-container w3-center mcfont">
<div class="w3-content">
<div class="w3-third w3-center">
<svg width="50%" viewBox="0 0 34 34" class="logo-3LF899" color="#7289DA">
<g fill="currentColor">
<path
d="M18.1558 14.297C17.1868 14.297 16.4218 15.13 16.4218 16.167C16.4218 17.204 17.2038 18.037 18.1558 18.037C19.1248 18.037 19.8898 17.204 19.8898 16.167C19.8898 15.13 19.1078 14.297 18.1558 14.297ZM11.9508 14.297C10.9818 14.297 10.2168 15.13 10.2168 16.167C10.2168 17.204 10.9988 18.037 11.9508 18.037C12.9198 18.037 13.6848 17.204 13.6848 16.167C13.7018 15.13 12.9198 14.297 11.9508 14.297Z">
</path>
<path
d="M26.4178 0.152954H3.63783C1.71683 0.152954 0.152832 1.71695 0.152832 3.63795V26.418C0.152832 28.339 1.71683 29.903 3.63783 29.903H22.9158L22.0148 26.792L24.1908 28.798L26.2478 30.685L29.9198 33.864V3.63795C29.9028 1.71695 28.3388 0.152954 26.4178 0.152954ZM19.8558 22.168C19.8558 22.168 19.2438 21.437 18.7338 20.808C20.9608 20.179 21.8108 18.802 21.8108 18.802C21.1138 19.261 20.4508 19.584 19.8558 19.805C19.0058 20.162 18.1898 20.383 17.3908 20.536C15.7588 20.842 14.2628 20.757 12.9878 20.519C12.0188 20.332 11.1858 20.077 10.4888 19.788C10.0978 19.635 9.67283 19.448 9.24783 19.21C9.19683 19.176 9.14583 19.159 9.09483 19.125C9.06083 19.108 9.04383 19.091 9.02683 19.091C8.72083 18.921 8.55083 18.802 8.55083 18.802C8.55083 18.802 9.36683 20.145 11.5258 20.791C11.0158 21.437 10.3868 22.185 10.3868 22.185C6.62983 22.066 5.20183 19.618 5.20183 19.618C5.20183 14.195 7.64983 9.79195 7.64983 9.79195C10.0978 7.97295 12.4098 8.02395 12.4098 8.02395L12.5798 8.22795C9.51983 9.09495 8.12583 10.438 8.12583 10.438C8.12583 10.438 8.49983 10.234 9.12883 9.96195C10.9478 9.16295 12.3928 8.95895 12.9878 8.89095C13.0898 8.87395 13.1748 8.85695 13.2768 8.85695C14.3138 8.72095 15.4868 8.68695 16.7108 8.82295C18.3258 9.00995 20.0598 9.48595 21.8278 10.438C21.8278 10.438 20.4848 9.16295 17.5948 8.29595L17.8328 8.02395C17.8328 8.02395 20.1618 7.97295 22.5928 9.79195C22.5928 9.79195 25.0408 14.195 25.0408 19.618 C25.0408 19.601 23.6128 22.049 19.8558 22.168Z">
</path>
</g>
</svg>
</div>
<div class="w3-twothird">
<h1>Unser Discord-Server </h1>
<p class="w3-text-grey mcfont">Verpasse keine neue Aktion auf dem Server! Für Fragen, Feedback,
gegenseitigen Austausch, Ankündigung von weiteren Aktionen, oder falls du Lust bekommen hast selbst
mitzuhelfen. Zum Beitreten einfach oben auf "Discord" klicken.
</p>
</div>
</div>
</div>
<div class="w3-container w3-center mcfont">
<div class="w3-padding-64 w3-content">
<div class="w3-twothird">
<h1 id="podcast">Unser Podcast </h1>
<p class="w3-text-grey mcfont">
In der ersten Episode des Podcasts Campus Life (WIP) erzählen wir euch die Entstehungsgeschichte des
Minecraft Campus. <br> Der Podcast ist auf vielen gängigen Plattformen verfügbar.<br> <a
href="https://www.youtube.com/watch?v=CA7qQt43xGE&list=PL10P69YYZwkSIw-Il1PwidhNPT-86WM2Z"
target="_blank">Zur Youtube-playlist</a>
</p>
<audio controls="controls" src="audio/campus_live_0.mp3">
Your browser does not support the HTML5 Audio element.
</audio>
<p class="w3-text-grey mcfont">
In der zweiten Episode des Podcasts stellen wir euch den Informatik Studiengang am KIT vor.
</p>
<audio controls="controls" src="audio/campus_life_1.mp3">
Your browser does not support the HTML5 Audio element.
</audio>
</div>
<div class="w3-onethird">
<script class="podlove-subscribe-button"
src="https://cdn.podlove.org/subscribe-button/javascripts/app.js" data-language="en" data-size="big"
data-json-data="podcastData" data-color="#469cd1" data-format="cover" data-style="filled"></script>
<noscript><a href="https://campus-kit.de/feed.xml">Subscribe to feed</a></noscript>
</div>
</div>
</div>
<!-- Footer -->
<footer class="w3-container w3-padding-64 w3-center w3-opacity">
<p> <a href="./impressum.html" target="_blank">Impressum</a></p>
<p>Powered by <a href="https://www.w3schools.com/w3css/default.asp" target="_blank">w3.css</a></p>
</footer>
<script>
// Used to toggle the menu on small screens when clicking on the menu button
function myFunction() {
var x = document.getElementById("navDemo");
if (x.className.indexOf("w3-show") == -1) {
x.className += " w3-show";
} else {
x.className = x.className.replace(" w3-show", "");
}
}
window.podcastData = { "title": "Campus Life", "subtitle": "(WIP)", "description": "In diesem Podcast erzälen wir euch, was so für ein Studieneinstieg am KIT wichtig ist.", "cover": "https://campus-kit.de/podcast.jpg", "feeds": [{ "type": "audio", "format": "mp3", "url": "https://campus-kit.de/feed.xml", "directory-url-itunes": "https://podcasts.apple.com/de/podcast/campus-life/id1541080501" }] }</script>
</body>
</html>
|
