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.

153 lines
6.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>ilinx</title>
<meta name="description" content="XPUB">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/pages.css">
<style type="text/css">
body { font-family: "Lucida Console", Monaco, monospace !important;
color: white;
background-color: black !important;
background: radial-gradient(15px 5px at 25% 0, transparent 0%, transparent 80%, rgba(255, 255, 255, 0.06) 80%, rgba(255, 255, 255, 0.06) 99%, transparent 99%, transparent 100%),
radial-gradient(15px 5px at 75% 100%, transparent 0%, transparent 80%, rgba(255, 255, 255, 0.06) 80%, rgba(255, 255, 255, 0.06) 99%, transparent 99%, transparent 100%),
radial-gradient(10px 3px at 25% 0, transparent 0%, transparent 70%, rgba(255, 255, 255, 0.05) 70%, rgba(255, 255, 255, 0.05) 99%, transparent 99%, transparent 100%),
radial-gradient(10px 3px at 75% 100%, transparent 0%, transparent 70%, rgba(255, 255, 255, 0.05) 70%, rgba(255, 255, 255, 0.05) 99%, transparent 99%, transparent 100%),
radial-gradient(30px 8px at 25% 0, transparent 0%, transparent 55%, rgba(255, 255, 255, 0.02) 55%, rgba(255, 255, 255, 0.02) 99%, transparent 99%, transparent 100%),
radial-gradient(30px 8px at 75% 100%, transparent 0%, transparent 55%, rgba(255, 255, 255, 0.02) 55%, rgba(255, 255, 255, 0.02) 99%, transparent 99%, transparent 100%), #c4cbc3;
background-size: 60px 40px, 60px 40px, 40px 24px, 40px 24px, 120px 64px, 120px 64px;
background-position: 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%;
-webkit-animation: wave 5s linear infinite;
animation: wave 5s linear infinite;
}
@-webkit-keyframes wave {
0% {
background-position: 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%;
}
20% {
background-position: 51% 48%, 51% 48%, 53% 52%, 53% 52%, 48% 47%, 48% 47%;
}
40% {
background-position: 49% 51%, 49% 51%, 48% 51%, 48% 51%, 54% 50%, 54% 50%;
}
60% {
background-position: 53% 54%, 53% 54%, 46% 54%, 46% 54%, 53% 46%, 53% 46%;
}
80% {
background-position: 51% 52%, 51% 52%, 49% 49%, 49% 49%, 49% 48%, 49% 48%;
}
0% {
background-position: 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%;
}
}
@keyframes wave {
0% {
background-position: 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%;
}
20% {
background-position: 51% 48%, 51% 48%, 53% 52%, 53% 52%, 48% 47%, 48% 47%;
}
40% {
background-position: 49% 51%, 49% 51%, 48% 51%, 48% 51%, 54% 50%, 54% 50%;
}
60% {
background-position: 53% 54%, 53% 54%, 46% 54%, 46% 54%, 53% 46%, 53% 46%;
}
80% {
background-position: 51% 52%, 51% 52%, 49% 49%, 49% 49%, 49% 48%, 49% 48%;
}
0% {
background-position: 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%, 50% 50%;
}
}
h1 { font-family: "Lucida Console", Monaco, monospace !important; }
#wrapper {background-color: #0000 !important}
#ihtp {color: white !important; width: 92% !important;}
a{color: white !important; }
a#student-page{color: white !important;}
.ext2 {
border-bottom-color: #00fc33;
background:linear-gradient(to bottom, #00fc33 0, #00fc33 100%);
background-position:0 100%;
background-repeat:repeat-x;
background-size: 0 0;
transition:background .2s ease-in-out;
}
#about-student {
color: #00fc33;
}
#bio{font-size: 0.9em;
line-height: 120%;}
#publication { float: left !important; margin-right: 100px !important; }
#thesisLink {line-height: 25px !important;}
</style>
</head>
<body>
<div id='wrapper'>
<a href='../' id='homebttn' class='ext'> << home</a>
<header>
<h1 id='project-title'>ilinx <a href='#hleft-text' class='show'></a></h1>
<h2 id='student-name'><a href='http://hub.xpub.nl/ilinx/dls/' target='_blank' class='ext2' id='student-page'>Tancredi Di Giovanni</a></h2>
<div id='hleft-text'>
<a href=# id='back'>
<div id='inner-hleft-text'>
<div id='ihtp'>
<object>
<div id='about-project'>
<p>Ilinx is an online experiment that explores the relationship between computation and humans as a phenomenal world extending the existential search for knowledge.<br><br>
The research around the project was done through reading, writing and re-editing of texts and software, theory and fiction.
These formed a collection of materials to be interconnected with each other, creating a map and navigating through it as the work progressed.<br><br>
The result is an explorable diary and labyrinth where humans and machines, texts and codes melt togheter taking the shape of an hypertextual theory-fiction.</p>
</div>
<hr align='left'>
<div id='about-student'>
<p id="bio">Tancredi Di Giovanni is a researcher and theorist exploring the boundaries between art, science and technology in the attempt to dismantle them. Originally trained in design and visual communication, but profoundly discouraged by the economical factors compromising the discipline, he started to think of himself as a <br> "nomad-by-necessity" in search for a not yet existing new field.
<!-- Lately his interests are drifting toward the potential of theory-fiction to escape control and the value of subjective consciousness as the eden of anticapitalist surrealism. -->
</p>
</div>
<a id='getback' class='int'> go back </a>
</object>
</div>
</div>
</a>
</div>
</header>
<section id='main'>
<div id="galleries">
<div id='publication'>
<h3 class='gal-title'>Publication</h3>
<ul id='publist'>
<li><a id="thesisLink" href='pdf/OHE.pdf' target="_blank" class='ext2'>Out-of-Hardware Experience: Consciousness and Software</a></li>
</ul>
</div>
<div id='work'>
<h3 class='gal-title'>Work</h3>
<ul id='publist'>
<li><a href='http://hub.xpub.nl/ilinx' target="_blank" class='ext2'>Project Website</a></li>
</ul>
<img src="img/3.png" class='workimg' />
<!-- <img src="img/2.png" class='workimg'/> -->
<img src="img/1.png" class='workimg'/>
<img src="img/5.png" class='workimg'/>
<img src="img/6.png" class='workimg'/>
<img src="img/4.png" class='workimg'/>
</div>
</div>
</section>
</div>
</body>
</html>