Programming as a Lifestyle

Pong

A crude implementation of the classic game Pong, with a second player that automatically follows the ball.

Fractal tree

A fractal tree generated using a recursive function that enables the user to set depth, angle and length freely.

Circle animation

Part of a study of trigonometric functions and polar coordinates, this animation generates a regular polygon by joining a single dot's projection accross several evenly-separated lines.

Javascript Calculator

Basic calculator emulated with Javascript and React.

Conway's Game of Life

Zero-player game (meaning it's development is determined by its initial state) dominated by a set of rules that can be boiled down to three: any cell with two or three neighbours survives, any dead cell with three live neighbours becomes a live cell and any other cells die or stay dead in the next generation.

Product landing page

Product landing page that features cards, pricing and about info.

Exercise tracker

Small full-stack exercise tracker, complete with a server and DB for storing users and logs.

Fractal plant

A fractal plant made using a Lindermayer System algorithm. It's a system that iterates on string replacement based on a set of rules and an initial state. It's translated into an illustration with turtle graphics.

Letter counter

An app created out of curiosity as to the frequency distribution of letters in English versus Spanish. It takes input text and generates a histogram.

Sine and Cosine

Part of a study on trigonometric functions and polar coordinates, this animation shows how the Sine and Cosine functions relate to the projections of a dot following a circumference.

Pomodoro-like clock

A clock that allows you to keep track of work versus rest sessions in accordance to the Pomodoro method proposed by Francesco Cirillo.

Pendulum wave

Visual effect obtained by simulating simple pendular motion with the Cosine function.

Mandelbrot set

It's a set of complex numbers c for which a recursive function does not diverge, i.e., remains bounded in absolute value (2). The visualization assigns a color per pixel based on the amount of iterations it took to get to a value bigger than 2.

Markdown previewer

A simple previewer that allows you to parse Github-flavored markdown in real time.

Rotating squares

A visual effect obtained by rotating increasingly big squares. Each square gets a slightly different speed of rotation to obtain the effect.

Gravity

A very simplistic parametric simulation of gravity towards a center point using particles and vectors.

Trying to sleep

A simple project in itself: a line that grows to a randomly selected point in the screen each frame. Still, it's one of my favorites because it encapsulates my insomnia experience quite well. Thus, its name.

Geometric pattern

Parametric straight lines that produce the illusion of curvature with their intersections.

Technical documentation page

A mockup of a technical documentation page, with placeholder information obtained from the ReactJS docs.

Heat Map

A map that showcases magnitude as a third dimension by using color steps, with the other two being different time steps.

Snake

A rendition of the classic game 'Snake' together with a little incursion into pixel art for creating the little mouse.

Random dots

Visual effect obtained by overlaying two identical plains of randomly placed dots, and then rotating and translating one of them.

Bar Chart

Part of an incursion into D3.js. Simple bar chart.

Random quotes

A random quotes app that allows you to tweet. Created as a coding bootcamp project.

Polar rose

A flower animation produced with an increasing value in the polar rose equation. It produces the effect using polar coordinates and the Cosine function.

Weather app

A simple app that gets the user's location and fetches and displays weather data from the Dark Sky API.

Collatz Conjecture

A visualization of the Collatz Conjecture for all numbers between 2 and 10,000.

Tribute page

One of my very first coding projects: a simple tribute page dedicated to Fernando del Paso. Created as a project for a coding bootcamp.

Fireworks (particle study)

Fireworks simulated using particles, vectors, and applying forces.

Particle connections

Random moving particles that connect to each other based on proximity.

Wikipedia viewer

One of my earlier projects for a coding bootcamp. It interacts with the Wikipedia API and displays a series of responses to the user, and then offers links to the articles. It can also lead to a random article.

Choropleth Map

Part of an incursion into D3.js. A chart that maps data into geographical polygons and displays magnitude with color.

Geometric flower

Symmetric geometric pattern that resembles a flower, produced with straight lines.

Sierpinski triangle

Procedurally generates the famous Sierpinski triangle fractal by using a Lidenmayer system (string replacement and turtle graphics).

Scatter Plot

Part of an incursion into D3.js. Simple scatter plot with a third dimension added by using colors.

Purple rain

An animation of purple rain, in honor of Prince's song. It served as a test in the concept of a simulated third dimension in 2D animation.

Survey form

Sample survey form with a wide selection of entry-types and form control.

Drum machine

Basic drum machine with keyboard functionality.

Dragon curve

A dragon curve fractal created using a Lindenmayer System algorithm. It's a system that iterates on string replacement based on a set of rules and an initial state. It's translated into an illustration with turtle graphics.

Shy particles

Particles simulated using vectors and applying forces. They are repelled by mouse (or touch) movement over the canvas.

Quadratic Koch Island

Quadratic Koch Island generated using a Lindenmayer system.

How I use programming

All