172 lines
5.0 KiB
HTML
172 lines
5.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Veit's Art</title>
|
|
<meta charset="utf-8">
|
|
<link type="text/css" rel="stylesheet" href="https://cdn.rawgit.com/patriciogonzalezvivo/glslGallery/gh-pages/build/glslGallery.css">
|
|
<script type="text/javascript" src="https://cdn.rawgit.com/patriciogonzalezvivo/glslGallery/gh-pages/build/glslGallery.js"></script>
|
|
<style>
|
|
@font-face {
|
|
font-family: 'charterregular';
|
|
src: url('/charter_regular-webfont.eot');
|
|
src: url('/charter_regular-webfont.woff') format('woff');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
body, html {
|
|
width: 80vw;
|
|
min-width: 600px;
|
|
margin: auto;
|
|
margin-bottom: 1em;
|
|
font-family: 'charter', Georgia, serif;
|
|
}
|
|
h1, h2 {
|
|
font-weight: 400;
|
|
border-left: 5px solid #D6F1F3;
|
|
border-top: 5px solid #D6F1F3;
|
|
display: inline-block;
|
|
border-right: 5px solid #F3D8D6;
|
|
border-bottom: 5px solid #F3D8D6;
|
|
margin-bottom: 0;
|
|
}
|
|
p {
|
|
margin-top: 0;
|
|
}
|
|
ul {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
li {
|
|
padding-left: 1em;
|
|
text-indent: -.7em;
|
|
}
|
|
li::before {
|
|
content: "•";
|
|
padding-right: 0.5em;
|
|
color: #F3D8D6;
|
|
}
|
|
.l {
|
|
text-decoration: none;
|
|
color: #000;
|
|
border-bottom: 3px solid #F3D8D6;
|
|
}
|
|
.l:hover {
|
|
background-color: #F3D8D6;
|
|
}
|
|
.description {
|
|
font-weight: 600;
|
|
}
|
|
.section {
|
|
margin-bottom: 2em;
|
|
}
|
|
.gridify {
|
|
display: inline-block;
|
|
width: 250px;
|
|
height: 250px;
|
|
margin-right: 2px;
|
|
margin-bottom: 5px;
|
|
vertical-align: top;
|
|
}
|
|
.gridify a {
|
|
text-decoration: none;
|
|
color: #000;
|
|
}
|
|
.gridify img {
|
|
width: 250px;
|
|
height: 250px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Veit's Art</h1>
|
|
<div class="section">
|
|
<p>
|
|
<span class="description">Noise:</span>
|
|
Thoughts on Georgi Voronoi, Ryoji Ikeda, Robert Brown, and Ken Perlin.
|
|
Made with WebGL.
|
|
</p>
|
|
|
|
<p>Something may happen if you hover over the images.</p>
|
|
|
|
<div class="glslGallery" data="170612231711,170612232000,170612232122,170612232140,170626220714,170629023312,170703214919,170704191818,170727205708" data-properties="showTitle:false,openFrameIcon:false,showAuthor:false"></div>
|
|
</div>
|
|
|
|
<div class="section">
|
|
<p>
|
|
<span class="description">Lines:</span>
|
|
Grids, infinite and infinitessimal.
|
|
Made with p5js.
|
|
</p>
|
|
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/HksDR0yib">
|
|
<img src="/static/perlin_circle.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/BJ4NgxYoW">
|
|
<img src="/static/lichen.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/SkQGDyKTZ">
|
|
<img src="/static/swish.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/rybVHNX-f">
|
|
<img src="/static/letter_to_mother.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/HkBZVB7bG">
|
|
<img src="/static/deep_square.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/Hyx_BqLWM">
|
|
<img src="/static/block.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/HkD_S9U-z">
|
|
<img src="/static/spike.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/ryAMZlyZz">
|
|
<img src="/static/saturn.png"></img>
|
|
</a>
|
|
</div>
|
|
<div class="gridify">
|
|
<a href="http://alpha.editor.p5js.org/full/rkFZ02DrM">
|
|
<img src="/static/hedges.png"></img>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="section">
|
|
<p>
|
|
<span class="description">Runes:</span>
|
|
Logorrheic incantations.
|
|
</p>
|
|
<div class="gridify">
|
|
<a href="http://github.com/hellerve/m">
|
|
<img src="/static/work_of_fart.png"></img>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<h2>Other</h2>
|
|
<p>Of note:</p>
|
|
<ul>
|
|
<li>A defunct generative art <a class="l" href="http://blog.veitheller.de/I_Can't_Paint.html">Twitter bot.</a></li>
|
|
<li><a class="l" href="http://blog.veitheller.de/us,_sorted.html">us, sorted.</a></li>
|
|
<li><a class="l" href="https://veitheller.de/poems">poems.</a></li>
|
|
<li><a class="l" href="http://blog.veitheller.de/RC_Popup,_Intermission.html">RC Popup. Intermission.</a></li>
|
|
<li><a class="l" href="https://github.com/hellerve/anima">anima,</a> a micro-framework for drawing in Carp.</li>
|
|
</ul>
|
|
</body>
|
|
</html>
|