colorlab
clone your own copy | download snapshot

Snapshots | iceberg

Inside this repository

main.html
text/html

Download raw (7.4 KB)

<!DOCTYPE html>
<html dir="ltr" class="sid-plesk" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>laboratorium</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="">
    <link rel="stylesheet" href="styles-main.css">
    <script src="scripts/jquery-1.9.1.js"></script>
    <script src="scripts/jquery-ui-1.9.2.custom.js"></script>
</head>
<body>
  <div id="menu">
    <ul>
      <li>COLORLAB LABORATORIUM</li>
      <li>COLOR RESEARCH</li>
      <li>RESEARCH PROJECTS</li>
      <li>EDUCATION</li>
    </ul>
  </div>
  <div id="left-menu-about">
    <h1>About</h1>

        <p class="header"><em>Laboratorium</em> is the experimental lab for art/design and biotechnology at KASK / School of Arts Ghent. As a biolab in art and design it focuses on exploring different interactions between art, science and technology. </p>

        <h2>Art, science and technology</h2>
        <p>The lab is a place for practice-based experimentation, research and education. The lab is open. It invites artists, designers, scientists and other interested parties to engage in a process of creative cross-pollination. Participants get a basic introduction to the functioning and principles of the lab, but are encouraged to bring in and open up their own backgrounds, creative methodologies, artistic practices and research questions.</p>

        <h2>Color research</h2>
        <p>From 2016 up until the end of 2019 an initial research project is being conducted at the lab focusing on new ways of creating colours. This Color Research project is led by María Boto together with Kristel Peters and explores different approaches to the production and application of living, sustainable and/or open colours by making use of waste or living organisms.</p>

        <h2>Additive technologies</h2>
        <p>The lab is located at the Media Arts Studio of KASK, neighboring the Formlab. The Formlab is offering high-end tools and support for 3D additive technologies. Establishing links between the realms of biotechnology and 3D printing is one of their main key interests.</p>

        <h2>Greenhouse</h2>
        <p>As part of Laboratorium, a greenhouse has been installed in the Bijloke. Nowadays it is being used to cultivate coloring plants together with other art-science projects.</p>

        <h2>Lab (equipment)</h2>
        <p>As part of color research and with the objective to promote art-science works, a laboratory has been installed in the School of Arts, within the Media department (Offerlaan 5).</p>

        <p class="footer">If you are interested in participating or using our facilities, send us an email to
        <em>info@laboratorium.bio</em></p>
        <p class="footer-more"><a href="about.html">→ read more about</a></p>



  </div>

  <div id="left-menu">
        <h1>Color researchs</h1>
        <p class="header">The Color Biolab is a transdisciplinary research project approaching the color field from different perspectives: from sustainable production and application, to the use of color as a common language between art and science. Starting from <a href="">traditional coloring</a>, to <a href="">living organisms</a> or waste, this project aims to reflect about the possibilities of new coloring sources, and the implications involved. </p>
        <p>Most of the work has been developed in <em>Laboratorium</em>, the experimental lab for art/design and biotechnology at KASK. In <em>Laboratorium</em> microorganisms have been cultured, pigment extraction has been performed and applied as well as microbial visualization or chemical reactions.</p>
        <p>Some of the results generated of this research have been exhibited and presented in national and international conferences and art spaces. Knowledge generated is transferred by workshops, presentations and a seminar, in and out of the art academy. </p>
        <p class="footer-more"><a href="">↓ Latest available colors</a></p>
    <ul >
      <li>
      <span class="color lv-hp"><p>Haematococcus pluvialis</p></span>
      </li>
      <li>
      <span class="color lv-ds"><p>Dunaliella Salina</p></span>
      </li>
      <li>
      <span class="color lv-sp"><p>Spirulina</p></span>
      </li>
      <li>
      <span class="color lv-murex"><p>Murex</p></span>
      </li>
      <li>
      <span class="color lv-cm"><p>Chelidonium majus</p></span>
      </li>
      <li>
      <span class="color"></span>
      </li>
    </ul>
  </div>

  <div id="main">
    <div class="background">

        <div class="intro">
          <h1>Research Projects</h1>
          <p class="header"><em>Laboratorium</em> develops projects in collaboration with artists and scientists applying the research from the color biolab project.</p>
          <p class="footer-more"><a href="">↓ Latest posts</a></p>

        </div>

        <ul>
          <li>
            <h2>Tierra de Diatomeas</h2>
            <figure>
                <img src="img-website/musac_lab987_tierradediatomeas_1_xl.jpg"/>
            </figure>
          </li>
          <li>
            <h2>neochromologism.io </h2>
            <figure>
                <img src="img-website/neochrom_2_2-1024x504.png"/>
            </figure>
          </li>
          <li>
            <h2>FARO</h2>
            <figure>
                <img src="img-website/faroweb-1024x677.jpg"/>
            </figure>
          </li>
          <li>
            <h2>Monochrome_ LINK TO LIVING</h2>
            <figure>
                <img src="img-website/dhoe9342-1024x683.jpg"/>
            </figure>
          </li>
          <li>
            <h2>KARS&BOOM</h2>
          </li>
        </ul>
      </div>
 </div>
 <div id="right-menu">
   <div class="background">
     <div class="intro">
       <h1>Education</h1>
       <p class="header"><em>Laboratorium</em> organises workshops, lectures and participates in the academic programme of KASK within the topics as colors, biomaterials, Art+Science and DIYbio. Here you can find info of the previous activities organised as well as a list of the upcoming events.</p>
       <p class="footer-more"><a href="">↓ Latest posts</a></p>

    </div>
   </div>


 </div>
<!-- DANS SCRIPTS METTEZ VOS SCRIPTS :)-->
<script src="scripts/jquery-smooth-scroll.js"></script>
<script>
    /* JUSTE EN DESSOUS METTEZ LES NOUVEAUX SCRIPTS:*/
     $('a').smoothScroll();
</script>
<script>

  function gradient(rot, gradient) {
    return 'repeating-linear-gradient(' + rot.toString(10) + 'deg, var(--background-color),  var(--background-color) 1px, transparent 1px,transparent 4px)';
  }

  function initBackgrounds() {
    // document.querySelectorAll('#menu, li, #left-menu').forEach(el => {
    document.querySelectorAll('.colored-wrapper').forEach(el => {
      var rotation = parseInt(Math.random() * 90);
      el.dataset.rotation = rotation;
      el.dataset.speed = (Math.random() * 3) - 1.5;
      el.style.backgroundImage = gradient(rotation, window.getComputedStyle(el).backgroundImage);
    });
  }

  function updateBackgrounds() {
    document.querySelectorAll('.colored-wrapper').forEach(el => {
      var rotation = Math.round((window.scrollY * parseFloat(el.dataset.speed) + parseInt(el.dataset.rotation)) % 360);
      console.log(rotation);
      el.style.backgroundImage = gradient(rotation, window.getComputedStyle(el).backgroundImage);
    });
  }

  document.addEventListener('scroll', updateBackgrounds);

  initBackgrounds();

</script>

</body>
</html>