Homepage screenshot

This webpage is my landing page, blog and serves as a way for me to write about my personal projects. It is currently work in progress for I am not completely satisfied with some of its aesthetics.

Current architecture

The website was built using Hugo, on a custom version of the PaperMod theme. The webpage is hosted by an auxiliary Caddy server inside a Docker container in my home server. The website is (still) static and is proxied with Cloudflare. The SSL certificate is provided by the Let’s Encrypt certificate authority and it’s managed by my main Caddy server.

To spice up the homepage, I’ve added two features: an interactive audio engine and an interactive 3D renderer. The interactive audio engine was created using the Faust programming language. Faust eases the creation of Digital Signal Processors through a functional block diagram driven typed language. The 3D renderer was created using the Godot game engine. The render resolution of the animation is limited to 200 by 200 pixels for aesthetics (and performance) reasons.

Interacting with the homepage

3D renderer

As it stands, the only interaction the user can perform with the 3D background is to change the color of the cubes and their rotation direction by clicking anywhere in the screen. The 3D engine starts automatically at page load.

Audio engine

My audio engine offers more flexibility than the 3D renderer. The user controls eight aspects of the synthesized sound. By clicking anywhere in the homepage, the user can change the center frequency of the audio oscillators. By dragging the mouse (or swiping in the phone), the engine uses the 2D coordinates of the pointer to control values like filter cutoff frequencies, reverb and envelope decay times, among other modulation variables. To start the audio engine, click on the “🔊 Click me!” button on the home page. To stop the audio engine, press the “🔇” button (this button only shows when the audio engine is enabled).

Blog Entries: