Add projects and tutorials
This commit is contained in:
116
index.html
116
index.html
@@ -125,13 +125,13 @@
|
||||
<a class="version-item version-item--link" href="archive/v2/index.html">
|
||||
<div class="v-dot"></div>
|
||||
<div class="v-content">
|
||||
<div class="v-title">Havox V2 <span class="v-link-arrow">↗</span></div>
|
||||
<div class="v-title">Umbra.cyou <span class="v-link-arrow">↗</span></div>
|
||||
<div class="v-year">2019 → 2022</div>
|
||||
<div class="v-desc">Complete redesign using SCSS & Nord theme.</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a class="version-item version-item--link" href="archive/v1/index.php">
|
||||
<a class="version-item version-item--link" href="archive/v1/index.html">
|
||||
<div class="v-dot"></div>
|
||||
<div class="v-content">
|
||||
<div class="v-title">Havox.org <span class="v-link-arrow">↗</span></div>
|
||||
@@ -212,49 +212,6 @@
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<!-- ─── Tutorials ─────────────────────────────────────────────── -->
|
||||
<section id="tutorials">
|
||||
<p class="section-label reveal">tutorials</p>
|
||||
<h2 class="section-heading reveal" style="transition-delay:0.05s">Things I <em>wrote down</em></h2>
|
||||
<p class="section-intro reveal" style="transition-delay:0.1s">
|
||||
Best way to learn is to teach. When I find something interesting I write a short tutorial — mainly to
|
||||
consolidate my own understanding, but if it helps someone else that's a win.
|
||||
</p>
|
||||
|
||||
<div class="card-grid reveal" style="transition-delay:0.15s">
|
||||
<a class="card" href="tutorials/summed_area/summed-area.html">
|
||||
<span class="card-date">3 Jan 2021</span>
|
||||
<span class="card-title">Summed-area tables</span>
|
||||
<span class="card-desc">Integral images — what they are, how they work, and why they're surprisingly
|
||||
useful for image processing.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="terrainGen/index.html">
|
||||
<span class="card-date">3 Feb 2019</span>
|
||||
<span class="card-title">Midpoint displacement terrain generation</span>
|
||||
<span class="card-desc">Generating random, natural-looking 2D terrains using the midpoint displacement
|
||||
algorithm.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="TSP_files/index.php">
|
||||
<span class="card-date">22 Sep 2018</span>
|
||||
<span class="card-title">Travelling salesperson</span>
|
||||
<span class="card-desc">Different implementations of the TSP problem — a classic that never gets
|
||||
old.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="jarvisMarsh/index.php">
|
||||
<span class="card-date">14 Feb 2018</span>
|
||||
<span class="card-title">Convex hull generator</span>
|
||||
<span class="card-desc">Wrapping algorithms — visualising how to find the convex hull of a point
|
||||
set.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<!-- ─── Projects ──────────────────────────────────────────────── -->
|
||||
<section id="projects">
|
||||
<p class="section-label reveal">projects</p>
|
||||
@@ -280,12 +237,6 @@
|
||||
<span class="card-desc">Marching squares in action — click a tile to edit the terrain.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/sorting_vis.html">
|
||||
<span class="card-date">11 Apr 2020</span>
|
||||
<span class="card-title">Bubble sort visualiser</span>
|
||||
<span class="card-desc">Bars sorted by height, one frame per loop. Classic.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/warp_lines.html">
|
||||
<span class="card-date">2 Apr 2020</span>
|
||||
<span class="card-title">Müller-Lyer illusion</span>
|
||||
@@ -298,36 +249,81 @@
|
||||
<span class="card-desc">Building a square wave from nothing but sine waves. Mesmerising.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/ellipse_const.html">
|
||||
<a class="card" href="projects/ellipse_construction.html">
|
||||
<span class="card-date">23 Feb 2019</span>
|
||||
<span class="card-title">Constructing an ellipse</span>
|
||||
<span class="card-desc">How an ellipse can be constructed with a circle and radial lines — inspired by
|
||||
3Blue1Brown.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/gameoflife.php">
|
||||
<a class="card" href="projects/game_of_life.html">
|
||||
<span class="card-date">2 May 2018</span>
|
||||
<span class="card-title">Game of Life</span>
|
||||
<span class="card-desc">A JS implementation of Conway's classic. Still fascinating.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/piApprox.php">
|
||||
<span class="card-date">18 Mar 2018</span>
|
||||
<a class="card" href="projects/pi_approximation.html">
|
||||
<span class="card-date">14 Mar 2018</span>
|
||||
<span class="card-title">Calculating PI</span>
|
||||
<span class="card-desc">Monte Carlo method — ratio of randomly placed dots in a square vs circle.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/oscil.php">
|
||||
<a class="card" href="projects/oscillations_in_3d.html">
|
||||
<span class="card-date">17 Dec 2017</span>
|
||||
<span class="card-title">Oscillations in 3D</span>
|
||||
<span class="card-desc">JS implementation of a Bees and Bombs gif. One of my oldest.</span>
|
||||
<span class="card-desc">JS implementation of a Bees and Bombs gif.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="projects/mazeGen.php">
|
||||
<a class="card" href="projects/maze_generator/index.html">
|
||||
<span class="card-date">13 Nov 2017</span>
|
||||
<span class="card-title">Maze generator</span>
|
||||
<span class="card-desc">A maze generator in JS. The first project that made me think "oh, I like
|
||||
this".</span>
|
||||
<span class="card-desc">A maze generator in p5.js. Using DFS & recursive backtracking.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<!-- ─── Tutorials ─────────────────────────────────────────────── -->
|
||||
<section id="tutorials">
|
||||
<p class="section-label reveal">tutorials</p>
|
||||
<h2 class="section-heading reveal" style="transition-delay:0.05s">Things I <em>wrote down</em></h2>
|
||||
<p class="section-intro reveal" style="transition-delay:0.1s">
|
||||
Best way to learn is to teach. When I find something interesting I write a short tutorial — mainly to
|
||||
consolidate my own understanding, but if it helps someone else that's a win.
|
||||
</p>
|
||||
<p class="section-intro reveal" style="transition-delay:0.1s">
|
||||
Had to really try my best to not touch anything here. Every tutorial here is exacty how it was when I wrote
|
||||
it in sixth form.
|
||||
</p>
|
||||
|
||||
<div class="card-grid reveal" style="transition-delay:0.15s">
|
||||
<a class="card" href="tutorials/summed_area/index.html">
|
||||
<span class="card-date">3 Jan 2021</span>
|
||||
<span class="card-title">Summed-area tables</span>
|
||||
<span class="card-desc">Counting cells in a summed-area table, investigating how they work and why
|
||||
they're efficient.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="tutorials/midpoint_displacement/index.html">
|
||||
<span class="card-date">3 Feb 2019</span>
|
||||
<span class="card-title">Midpoint displacement terrain generation</span>
|
||||
<span class="card-desc">Generating random, natural-looking 2D terrains using the midpoint displacement
|
||||
algorithm.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="tutorials/convex_hull/index.html">
|
||||
<span class="card-date">22 Sept 2018</span>
|
||||
<span class="card-title">Convex hull generator</span>
|
||||
<span class="card-desc">Wrapping algorithms — visualising how to find the convex hull of a point
|
||||
set.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
<a class="card" href="tutorials/tsp/index.html">
|
||||
<span class="card-date">14 Feb 2018</span>
|
||||
<span class="card-title">Travelling Salesperson Problem</span>
|
||||
<span class="card-desc">Different implementations of the TSP problem — a classic.</span>
|
||||
<span class="card-arrow">→</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user