a-seat-for-the-sea
clone your own copy | download snapshot

Snapshots | iceberg

Inside this repository
index.html
text/html

Download raw (3.1 KB)

<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link href="style.css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.7.8/dat.gui.min.js"></script>
    <script src="blotter/blotter.min.js"></script>
    <script src="blotter/liquidDistortMaterial.js"></script>
  </head>

  <body>
    <h1>A Seat for the Sea</h1>
    <div class="textbox">
      <h1>#1</h1>
      <p class="wobblyText">
        A Seat for the Sea #1: Gesticulated conference at FramerFramed ,
        Amsterdam Can we collectively represent what is still unthinkable,
        namely “how does the sea raise its voice”?
      </p>
      <h1>#2</h1>
      <p class="wobblyText">
        The so-called Blue Economy serves as a background for this meeting: it
        conceives industrial and investment projects which are (to be) carried
        out in the sea. The next Big Thing is deep-sea mining in which the Low
        Lands with its dredging companies and shipbuilders play a significant
        role.
      </p>
      <h1>#3</h1>
      <p class="wobblyText">
        Yet, in the setting of FramerFramed's exhibition 'Court for
        Intergenerational Climate Crimes', created by Radha D'Souza & Jonas
        Staal, it is more than appropriate to hear how artists with a strong
        bond with the sea relate to this new industrial niche. So, once again:
        How can we strengthen the voice of the sea? And, dilemma, can we talk in
        the name of the sea?
      </p>
      <h1>#4</h1>
      <p class="wobblyText">
        Admission is free, please register through Eventbrite. If you’re unable
        to attend, the event will also be streamed on YouTube channel Framer
        Framed.
      </p>
    </div>

    <svg>
      <filter
        style="color-interpolation-filters: sRGB"
        id="bodyNoise"
        x="0"
        y="0"
      >
        <feTurbulence
          numOctaves="5"
          baseFrequency="0.0050"
          id="feTurbulence2370"
          type="fractalNoise"
        />

        <feDisplacementMap
          yChannelSelector="A"
          xChannelSelector="A"
          scale="20"
          in="SourceGraphic"
          in2="feTurbulence2370"
          id="feDisplacementMap2364"
          numOctaves="5"
        />
      </filter>
      <filter id="titleNoise">
        <feTurbulence
          numOctaves="5"
          baseFrequency="0.0050"
          id="feTurbulence2360"
          type="fractalNoise"
        />

        <feDisplacementMap
          yChannelSelector="A"
          xChannelSelector="A"
          scale="40"
          in="SourceAlpha"
          in2="feTurbulence2360"
          id="feDisplacementMap2364"
          numOctaves="5"
        />
      </filter>
      <animate
        xlink:href="#feTurbulence2360"
        attributeName="baseFrequency"
        dur="30s"
        keyTimes="0;0.5;1"
        values="0.005 0.006;0.01 0.01;0.005 0.006"
        repeatCount="indefinite"
      />
    </svg>

    <script src="script.js"></script>
  </body>
</html>