You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

122 lines
4.3 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>868 Mhz</title>
<meta name="description" content="XPUB">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/pages.css">
<link rel="icon" href="img/favicon.ico" type="image/x-icon" />
</head>
<body>
<style>
body{color:#ff4800;
}
#main{background-color: black;}
.ext {color: #a2a2a2;
border-bottom-color: none;
background: none;
}
.fullscreen-video {
position: fixed;
overflow: hidden;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
transform: translateX(-50%) translateY(-50%);
z-index: -10;
}
#wrapper {
background-color: black;
}
#hleft-text{z-index: 2;}
header{z-index: 2;}
#ihtp {
color: #a2a2a2;
}
#about-student {
color: #99f;
}
#homebttn {
color: #a2a2a2;
}
#galleries li, #galleries p {
color: #99f;
}
.workimg{
opacity: 75%;}
</style>
<div id='wrapper'></div>
<a href='../' id='homebttn' class='ext'> << home</a>
<header>
<h1 id='project-title'>868 MHz<a href='#hleft-text' class='show'></a></h1>
<h2 id='student-name'>Louisa Teichmann</h2>
<div id='hleft-text'>
<a href=# id='back'>
<div id='inner-hleft-text'>
<div id='ihtp'>
<object>
<div id='about-project'>
<p>868 MHz is a hybrid reality game running on the same standardized frequency as the LoRa gateways of The Things Network. Rotterdam is one of many cities world-wide in the process of building an Urban Data Platform (UDP), a sort of mirror world of real-time data collected in public space via smart devices. A major facilitator of this development is The Things Network, a global IoT Network connecting thousands of sensors through long range radio transmission. From lamp posts to advertisement screens, sourced information is not only collected, but can be processed and fed back into the city streets to adjust spaces and manipulate citizens' movement through them. <br> 868 MHz suggests a player's mod of this framework of scattered, hidden devices feeding into one central server. Chase the electric currents of the asphalt to locate gateways and encounter a being which has nested itself beneath the city streets, all the way down the power lines woven amidst to its whirring epicentre. Encased in its concrete and metal armour, lie the keys to the pulsating veins of a mirror world. Whatever makes it inside its bloodstream, will travel fast and eternally through the nexus of time and space it occupies in that instant. </p>
</div>
<hr align='left'>
<div id='about-student'>
<p>Louisa Teichmann (Heidelberg, 1995) is a Rotterdam based media artist working with themes around gaming and the effect of new technologies on the players' perception of reality. By analysing gameplay methods and implementing them into RL settings, they are creating scenarios in which the viewer turns into the protagonist of an interactive fictional narrative.</p>
</div>
<a id='getback' class='int'> go back </a>
</object>
</div>
</div>
</a>
</div>
</header>
<section id='main'>
<video class="fullscreen-video" id="myVideo" autoplay="autoplay" muted loop>
<source src="img/bg.mp4">
</video>
<div id="galleries">
<div id='work'>
<h3 class='gal-title'>Work</h3>
<ul id='publist'>
<li><a href='https://868mhz.net' target="_blank" class='ext'>Mobile Game</a></li>
<li><a href='https://github.com/louisafriederike/xpub_prototype_citynet' target="_blank" class='ext'>Git Repository</a></li>
</ul>
<img src="img/868Mhz (1).jpg" class='workimg'/>
<img src="img/868Mhz (8).jpg" class='workimg'/>
<img src="img/868Mhz (3).jpg" class='workimg'/>
<img src="img/868Mhz (6).jpg" class='workimg'/>
</div>
<div id='publication'>
<h3 class='gal-title'>Publication</h3>
<ul id='publist'>
<li><a href='http://louisateichmann.com/asphaltspur.pdf' target="_blank" class='ext'>Publication PDF</a></li>
</ul>
</div>
<!-- <div id='gradshow'>
<h3 class='gal-title'>Graduation Show</h3>
<img src="img/gradshow1.jpg" class='workimg'/>
<img src="img/gradshow2.jpg" class='workimg'/>
<img src="img/gradshow3.jpg" class='workimg'/>
<img src="img/gradshow4.jpg" class='workimg'/>
</div> -->
</div>
</section>
</div>
</body>
</html>