Friday, June 26, 2015

Tools used: d3, <canvas>, hard gay

June 26ths across my out/conscious lifetime:

Lawrence v. Texas (2003): same-sex intercourse becomes legal across the United States

United States v. Windsor (2013): the federal government begins fully recognizing same-sex marriages

Obergefell v. Hodges (2015): same-sex marriage becomes legal everywhere in the United States

Angry-13-year-old me would never have believed it.

Sunday, June 14, 2015

Things practiced: math, graphics programming

Tools used: WebGL, benvanik’s WebGL Inspector for Chrome, glMatrix for matrix math in Javascript

For whatever we lose(like a you or a me)
it's always ourselves we find in the sea
(from an e.e. cummings poem that autoplays in my head every time I picture the ocean, i.e. ~10,000× while coding this)

Despite being terrible at it, I find graphics programming pretty fun. Building realistic 3D environments in real time blends physics and computer science—graphics programmers have to satisfy two conflicting objectives: to simulate reality as accurately as possible, while using fewer than 16 or 33 milliseconds to process each frame.

Modeling the ocean is a good example of a situation where tradeoffs are required. Fluid dynamics is based around the Navier-Stokes equations, which are a set of nonlinear partial differential equations that describe the flow of viscous fluids. Fully solving these equations numerically provides an exact model of the ocean, but is computationally infeasible.

Instead, I tried to simulate an ocean scene using this approach:

1. Generate realistic water surface height fields to model waves, using empirical knowledge of ocean phenomena.

2. Account for optical processes acting on ocean water: reflection and refraction from a water surface, the color filtering behavior of ocean water, and maybe more-complex effects like caustics and godrays.

3. Render a realistic sky gradient using known properties of atmospheric scattering.

4. Think about computational-resource cost versus quality gained and simplify where possible.

Results so far (underwhelming but workable) (click):

The code is on GitHub; the simulation is running here.

Tuesday, June 9, 2015

Tools used: a crop-sensor DSLR, Lightroom, Premiere

Monday, June 1, 2015

Thing practiced: drawing rainbows

Tools used: the JS Web Audio API, three.js instead of actual WebGL, Safari mobile web inspector

Jamie xx’s new album In Colour is finally out, and it’s so good.

Do you ever get that feeling, when you’re up at 2 am and almost alone, of being enveloped in something with maybe someone, of melancholy becoming euphoric? This album feels like that. It’s dense and fleshed out, not downbeat and cryptic like the xx past — but still lonely, and lovely. Listen with good headphones.


Because I loved this album and its cover so much, I built a totally unsanctioned album-themed beat-detecting visualizer here:

(If the presets are unsatisfactory, drag and drop your own audio file onto the page.)