summaryrefslogtreecommitdiff
path: root/tutorial.html
diff options
context:
space:
mode:
authorJules Laplace <jules@okfoc.us>2014-11-22 23:19:36 -0500
committerJules Laplace <jules@okfoc.us>2014-11-22 23:19:36 -0500
commit070b5e6d9d3c7e23c06f0ae0b75026923529c24d (patch)
tree89c430dd17ca54ff60f885ecd99cf6cfa0f0b7ff /tutorial.html
parent04537ed34d443d0610b77420d1dbef64bc05fbfa (diff)
parent1631cdf643283fc71bc9d70b5dcbce03ab9c2386 (diff)
Merge branch 'master' of lmno:dither
Diffstat (limited to 'tutorial.html')
-rw-r--r--tutorial.html29
1 files changed, 29 insertions, 0 deletions
diff --git a/tutorial.html b/tutorial.html
new file mode 100644
index 0000000..3b4a58b
--- /dev/null
+++ b/tutorial.html
@@ -0,0 +1,29 @@
+<!doctype html>
+<html>
+<head>
+<title>tutorial</title>
+<style type="text/css">
+html,body{margin:0;padding:0; padding: 5px;}
+article { font-family: serif; font-size: 14px; margin:0;padding:0;}
+u{ color: #866; }
+i{ color: #666; }
+a{ color: #a39; }
+</style>
+</head>
+<body>
+<article id="pre">Shaders are procedures that draw a picture by coloring each pixel individually. Use shaders on gifs and images to make new effects.
+
+Your basic variables are position (x, y),
+time (t), and color (r, g, b, a).
+
+Many math functions such as <i>cos</i> and <i>sqrt</i> are available, along with functions from GLSL like <i>step</i> and <i>mix</i>. You can see a full list by clicking "commands" above. When you make a cool effect, render a gif and save the shader for others to use.
+
+You can apply these shaders to any image. Click "images" below to search <a href="http://dump.fm/">Dumpfm</a> and <a href="http://asdf.us/im/" target="_blank">Photoblaster</a>, or enter a URL at top left.
+
+See more: <a href="http://asdf.us/dither/" target="_blank">Dither</a>
+</article>
+</body>
+<script>
+pre.innerHTML = pre.innerHTML.replace(/\(/g,"(<i>").replace(/\)/g,"</i>)").replace(/\n/g,"<br>")
+</script>
+</html>