add more stuff to portfolio

site/lists/portfolio.html

@@ -13,14 +13,14 @@
 	<main>
 		<h1 id="portfolio">Portfolio</h1>
 <p>
-Hi this is a non-exhaustive list of my personal projects. It appears I like making things with computers.<br>
+Hi, this is a non-exhaustive list of my personal projects. It appears I like making things with computers. The dates listed are the last time any significant change was made, for projects that spanned several months.<br>
 </p>
 <h1 id="hardware">hardware</h1>
 <h3 id="leko-pona">leko pona</h3>
 <p>
 <code>2022-08</code><br>
 <a href="https://git.crispypin.cc/CrispyPin/leko-pona">git.crispypin.cc/CrispyPin/leko-pona</a><br>
-<img src="/media/leko_tonsi.png" alt="leko pona, a split keyboard with blank keycaps in the trans flag colours" title="leko pona, a split keyboard with blank keycaps in the trans flag colours"></img>
+<img loading="lazy" src="/media/leko_tonsi.png" alt="leko pona, a split keyboard with blank keycaps in the trans flag colours" title="leko pona, a split keyboard with blank keycaps in the trans flag colours"></img>
 </p>
 <h2 id="ch32v003-oled-board">ch32v003 oled board</h2>
 <p>
@@ -29,17 +29,18 @@ project files: <a href="https://git.crispypin.cc/CrispyPin/ch32_oled">git.crispy
 <h3 id="bad-apple">bad apple</h3>
 <p>
 <code>2024-04</code><br>
-<a href="https://git.crispypin.cc/CrispyPin/bad-apple/">git.crispypin.cc/CrispyPin/bad-apple/</a><br>
+source: <a href="https://git.crispypin.cc/CrispyPin/bad-apple/">git.crispypin.cc/CrispyPin/bad-apple/</a><br>
-<a href="https://youtu.be/G0eonL14tCQ">https://youtu.be/G0eonL14tCQ</a><iframe src="https://www.youtube-nocookie.com/embed/G0eonL14tCQ" width="600px" height="340px" allowfullscreen></iframe></p>
+<a href="https://youtu.be/G0eonL14tCQ">https://youtu.be/G0eonL14tCQ</a>
+<iframe loading="lazy" src="https://www.youtube-nocookie.com/embed/G0eonL14tCQ" width="600px" height="340px" allowfullscreen></iframe></p>
 <h3 id="conways-game-of-life">Conways Game of Life</h3>
 <p>
 <code>2024-04</code><br>
-<video src="/media/ch32_gol.mp4" alt="conways game of life on a tiny display" title="conways game of life on a tiny display" controls ></video>
+<video loading="lazy" src="/media/ch32_gol.mp4" alt="conways game of life on a tiny display" title="conways game of life on a tiny display" controls ></video>
 </p>
 <h3 id="runner-game">Runner game</h3>
 <p>
 <code>2024-04</code><br>
-<video src="/media/musi_pi_soweli_tawa.mp4" alt="simple runner game, similar to the chrome dino game" title="simple runner game, similar to the chrome dino game" controls ></video>
+<video loading="lazy" src="/media/musi_pi_soweli_tawa.mp4" alt="simple runner game, similar to the chrome dino game" title="simple runner game, similar to the chrome dino game" controls ></video>
 </p>
 <h2 id="rotary-encoder-keyboard">rotary encoder keyboard</h2>
 <h1 id="jam-games">jam games</h1>
@@ -54,7 +55,7 @@ All the below games except for <code>LD45: Mind the Gap</code> I made together w
 <code>2022-04</code><br>
 <a href="https://crispypin.itch.io/ld-50">crispypin.itch.io/ld-50</a><br>
 <a href="https://github.com/CrispyPin/ld-50">github.com/CrispyPin/ld-50</a><br>
-<img src="/media/pixel_entropy.png" alt="a 2D pixel physics sandbox" title="a 2D pixel physics sandbox"></img>
+<img loading="lazy" src="/media/pixel_entropy.png" alt="a 2D pixel physics sandbox" title="a 2D pixel physics sandbox"></img>
 </p>
 <h3 id="ld49-shork-inc">LD49: Shork Inc</h3>
 <h3 id="ld48-shork">LD48: Shork</h3>
@@ -66,25 +67,91 @@ All the below games except for <code>LD45: Mind the Gap</code> I made together w
 <h3 id="ld42-forklift-simulator">LD42: Forklift Simulator</h3>
 <h1 id="shaders">shaders</h1>
 <h3 id="partial-qr-code">partial QR code</h3>
+<p>
+<code>2024-08</code><br>
+A shader that can display qr codes of any size, though it requires computing the error correction codes beforehand. Partially because it would be slow to do for every pixel every frame, but mostly because I couldn't find a resource explaining how to do it.<br>
+<video loading="lazy" src="/media/qr_shader_bit_order.mp4" alt="" title="" controls ></video>
+</p>
 <h3 id="quine">quine</h3>
+<p>
+<code>2024-08</code><br>
+A <a href="https://en.wikipedia.org/wiki/Self-reproducing_program">quine</a> is a program that outputs its own source code. Since shaders don't have text or file outputs, a shader quine must render its own source code instead. This shader contains the font data required to be readable.<br>
+<img loading="lazy" src="/media/shader_quine_198x99.png" alt="a large square of shader code, being rendered by itself" title="a large square of shader code, being rendered by itself"></img>
+</p>
 <h3 id="golfed-quines">golfed quines</h3>
+<p>
+<code>2024-08</code><br>
+Code golf is the art of shortening a program as much as possible while still producing a required behavior. I made a tiny version of the quine, only 2877 bytes large. At the end it does render some random characters, but I still consider it valid. When code golfing, undefined behaviour is part of the fun.<br>
+<img loading="lazy" src="/media/shader_quine_2877.png" alt="a smaller wall of text, with a low-resolution font that is just barely readable" title="a smaller wall of text, with a low-resolution font that is just barely readable"></img>
+</p>
 <h3 id="sunset">sunset</h3>
+<p>
+<code>2023-02</code><br>
+This is a single fragment shader, which means you can put it on any mesh and it will look the same.<br>
+<img loading="lazy" src="/media/sunset_shader.png" alt="sunset over a calm ocean, with stars visible in the purple sky" title="sunset over a calm ocean, with stars visible in the purple sky"></img>
+</p>
 <h3 id="julia-fractal">julia fractal</h3>
 <h2 id="andriod">andriod</h2>
+<p>
+<code>2024-05</code><br>
+source: <a href="https://git.crispypin.cc/CrispyPin/android-shaders">git.crispypin.cc/CrispyPin/android-shaders</a><br>
+Using the app <a href="https://f-droid.org/en/packages/de.markusfisch.android.shadereditor/">Shader Editor</a>, I made some shaders for my phones' wallpaper.<br>
+</p>
 <h3 id="binary-clock-variants">binary clock variants</h3>
+<p>
+<code>2024-05</code><br>
+The 4x4 version divides the day into 2^16 sections, each one about 1.3s long, and displays the number of sections passed since midnight as a binary number.<br>
+<img loading="lazy" src="/media/binary_clock_square.png" alt="a 4x4 grid of circles, some of which are filled" title="a 4x4 grid of circles, some of which are filled"></img>
+</p>
+<p>
+This 3-row version uses the traditional division of hours, minutes and seconds, just displaying the three numbers in binary.<br>
+<img loading="lazy" src="/media/binary_clock.png" alt="3 rows of 5, 6 and 6 circles" title="3 rows of 5, 6 and 6 circles"></img>
+</p>
 <h2 id="raymarching">raymarching</h2>
 <h3 id="libgarbage">libgarbage</h3>
+<p>
+<code>2023-07</code><br>
+libgarbage is my raymarching shader library, with which all the following shaders are made with. It doesn't have its own repository right now, but can be found in <a href="https://git.crispypin.cc/CrispyPin/cvr-props/src/branch/main/Assets/raymarched/lib">git.crispypin.cc/CrispyPin/cvr-props</a><br>
+</p>
 <h3 id="libgarbage-demo">libgarbage demo</h3>
-<h3 id="spinny-demo">spinny demo</h3>
+<p>
+<code>2023-09</code><br>
+An example scene made for libgarbage, showing most of the primitive shapes available.<br>
+<video loading="lazy" src="/media/rm_demo_scene.mp4" alt="a collection of sdf primitives with a reflective material" title="a collection of sdf primitives with a reflective material" controls ></video>
+</p>
+<h3 id="spinny-thing">spinny thing</h3>
+<p>
+<code>2023-07</code><br>
+<video loading="lazy" src="/media/rm_spinny_thing.mp4" alt="" title="" controls ></video>
+</p>
 <h3 id="flesh-cube">flesh cube</h3>
+<p>
+<code>2023-07</code><br>
+<video loading="lazy" src="/media/rm_flesh_cube.mp4" alt="disgusting pulsating fleshy cube" title="disgusting pulsating fleshy cube" controls ></video>
+</p>
 <h3 id="big-nut">big nut</h3>
+<p>
+<code>2023-09</code><br>
+<video loading="lazy" src="/media/rm_big_nut.mp4" alt="a spinning metallic bolt and nut continually screwing and unscrewing itself" title="a spinning metallic bolt and nut continually screwing and unscrewing itself" controls ></video>
+</p>
 <h3 id="loops">loops</h3>
-<video src="/media/rm_looping_loops.mp4" alt="11 rectangular frames moving through each other smoothly" title="11 rectangular frames moving through each other smoothly" controls loop=true></video>
+<p>
+<code>2024-08</code><br>
+<video loading="lazy" src="/media/rm_looping_loops.mp4" alt="11 rectangular frames moving through each other smoothly" title="11 rectangular frames moving through each other smoothly" controls loop=true></video>
+</p>
 <h3 id="boxes">boxes</h3>
-<video src="/media/rm_boxes.mp4" alt="" title="" controls ></video>
+<p>
+<code>2024-08</code><br>
+<video loading="lazy" src="/media/rm_boxes.mp4" alt="" title="" controls ></video>
+</p>
 <h2 id="cellular-automata">cellular automata</h2>
 <h3 id="game-of-life">game of life</h3>
 <h3 id="rule-110">rule 110</h3>
+<p>
+<code>2023-09</code><br>
+See <a href="https://en.wikipedia.org/wiki/Elementary_cellular_automaton">Elementary cellular automaton (Wikipedia)</a>.<br>
+<img loading="lazy" src="/media/rule_110.png" alt="elementary cellular automata 110" title="elementary cellular automata 110"></img>
+</p>
 <h3 id="wireworld">WireWorld</h3>
 <h3 id="leniasmoothlife">Lenia/smoothlife</h3>
 <h2 id="godot">godot</h2>
@@ -102,9 +169,8 @@ All the below games except for <code>LD45: Mind the Gap</code> I made together w
 <h3 id="ovr-utils">OVR Utils</h3>
 <h3 id="sinpin-vr">sinpin-vr</h3>
 <h3 id="steamvr_status">steamvr_status</h3>
-<h1 id="creative-coding">creative coding</h1>
-<h3 id="snad">snad</h3>
 <h1 id="silly">Silly</h1>
+<h3 id="snad">snad</h3>
 <h3 id="worm-lang">worm lang</h3>
 <h3 id="advent-of-code-2023-day-1-and-4-in-brainfuck">advent of code 2023 day 1 and 4 in brainfuck</h3>
 <h3 id="asetniop-emulator-for-x11">asetniop emulator for x11</h3>

write/lists/portfolio.md

@@ -1,5 +1,5 @@
 # Portfolio
-Hi this is a non-exhaustive list of my personal projects. It appears I like making things with computers.
+Hi, this is a non-exhaustive list of my personal projects. It appears I like making things with computers. The dates listed are the last time any significant change was made, for projects that spanned several months.
 
 # hardware
 ### leko pona
@@ -11,7 +11,7 @@ Hi this is a non-exhaustive list of my personal projects. It appears I like maki
 project files: [git.crispypin.cc/CrispyPin/ch32_oled](https://git.crispypin.cc/CrispyPin/ch32_oled)
 ### bad apple
 `2024-04`
-[git.crispypin.cc/CrispyPin/bad-apple/](https://git.crispypin.cc/CrispyPin/bad-apple/)
+source: [git.crispypin.cc/CrispyPin/bad-apple/](https://git.crispypin.cc/CrispyPin/bad-apple/)
 ==youtube:G0eonL14tCQ
 ### Conways Game of Life
 `2024-04`
@@ -40,26 +40,62 @@ All the below games except for `LD45: Mind the Gap` I made together with [Erikbo
 ### LD42: Forklift Simulator
 # shaders
 ### partial QR code
-
+`2024-08`
+A shader that can display qr codes of any size, though it requires computing the error correction codes beforehand. Partially because it would be slow to do for every pixel every frame, but mostly because I couldn't find a resource explaining how to do it.
+==video:"/media/qr_shader_bit_order.mp4"
 ### quine
+`2024-08`
+A [quine](https://en.wikipedia.org/wiki/Self-reproducing_program) is a program that outputs its own source code. Since shaders don't have text or file outputs, a shader quine must render its own source code instead. This shader contains the font data required to be readable.
+==image:"/media/shader_quine_198x99.png":"a large square of shader code, being rendered by itself"
 ### golfed quines
+`2024-08`
+Code golf is the art of shortening a program as much as possible while still producing a required behavior. I made a tiny version of the quine, only 2877 bytes large. At the end it does render some random characters, but I still consider it valid. When code golfing, undefined behaviour is part of the fun.
+==image:"/media/shader_quine_2877.png":"a smaller wall of text, with a low-resolution font that is just barely readable"
 ### sunset
+`2023-02`
+This is a single fragment shader, which means you can put it on any mesh and it will look the same.
+==image:"/media/sunset_shader.png":"sunset over a calm ocean, with stars visible in the purple sky"
 ### julia fractal
 ## andriod
+`2024-05`
+source: [git.crispypin.cc/CrispyPin/android-shaders](https://git.crispypin.cc/CrispyPin/android-shaders)
+Using the app [Shader Editor](https://f-droid.org/en/packages/de.markusfisch.android.shadereditor/), I made some shaders for my phones' wallpaper.
 ### binary clock variants
+`2024-05`
+The 4x4 version divides the day into 2^16 sections, each one about 1.3s long, and displays the number of sections passed since midnight as a binary number.
+==image:"/media/binary_clock_square.png":"a 4x4 grid of circles, some of which are filled"
+
+This 3-row version uses the traditional division of hours, minutes and seconds, just displaying the three numbers in binary.
+==image:"/media/binary_clock.png":"3 rows of 5, 6 and 6 circles"
 ## raymarching
 ### libgarbage
+`2023-07`
+libgarbage is my raymarching shader library, with which all the following shaders are made with. It doesn't have its own repository right now, but can be found in [git.crispypin.cc/CrispyPin/cvr-props](https://git.crispypin.cc/CrispyPin/cvr-props/src/branch/main/Assets/raymarched/lib)
 ### libgarbage demo
-### spinny demo
+`2023-09`
+An example scene made for libgarbage, showing most of the primitive shapes available.
+==video:"/media/rm_demo_scene.mp4":"a collection of sdf primitives with a reflective material"
+### spinny thing
+`2023-07`
+==video:"/media/rm_spinny_thing.mp4"
 ### flesh cube
+`2023-07`
+==video:"/media/rm_flesh_cube.mp4":"disgusting pulsating fleshy cube"
 ### big nut
+`2023-09`
+==video:"/media/rm_big_nut.mp4":"a spinning metallic bolt and nut continually screwing and unscrewing itself"
 ### loops
+`2024-08`
 ==video:"/media/rm_looping_loops.mp4":"11 rectangular frames moving through each other smoothly":loop=true
 ### boxes
+`2024-08`
 ==video:"/media/rm_boxes.mp4"
 ## cellular automata
 ### game of life
 ### rule 110
+`2023-09`
+See [Elementary cellular automaton (Wikipedia)](https://en.wikipedia.org/wiki/Elementary_cellular_automaton).
+==image:"/media/rule_110.png":"elementary cellular automata 110"
 ### WireWorld
 ### Lenia/smoothlife
 ## godot
@@ -77,9 +113,8 @@ All the below games except for `LD45: Mind the Gap` I made together with [Erikbo
 ### OVR Utils
 ### sinpin-vr
 ### steamvr_status
-# creative coding
-### snad
 # Silly
+### snad
 ### worm lang
 ### advent of code 2023 day 1 and 4 in brainfuck
 ### asetniop emulator for x11