Pixelated me

Leandro Linares

I use code to create human-friendly interfaces, and tools to build nerdy things. I document my coding journey in tweets and blog posts, and my building process in cinematic videos.


Collection of quick experiments and unfinished projects.

  1. CSS-Only 3D Sphere

    The perception of volume is created by stacking 21 different elements separated by equal distances. ()

  2. Spell checker

    After counting words from 20 popular books, it suggests the nearest ones to replace spelling mistakes. ()

  3. Wunderpaint

    Pixel Art editor in vanilla JS and functional progr. A canvas is used *only* to process i/o. The user interacts with a base64 image. ()

  4. Punchy

    WebMIDI and WebAudio let users play a MIDI controller on a synthesizer or sampler directly in the browser. ()

  5. Feeds Aggregator

    Reads RSS feeds using a serverless function and normalizes the output to be displayed in a list. ()

  6. CSS Voxels

    One HTML element per voxel in a matrix. Voxels are arranged on the x/y coordinates and stacked in different layers on the Z-axis. ()

  7. Single Element Cube

    The element and pseudo-elements are the faces. When it rotates, it changes the transform-origin to always display 3 faces. ()

  8. Single Element Logo

    Playing with shapes as borders, backgrounds, and characters as part of the content of the pseudo-elements. ()

  9. CSS Retro Calculator

    A fully working Casio calculator built with Create React App and reducers to update the state. The visuals are all CSS. ()

  10. Human-readable Filters

    Conceptual experiment to minimize the humans' learning curve for filtering lists. ()

  11. Autumn Leaf

    An emoji flattened with the text-shadow technique, overrotating in a couple of axes. ()

  12. Mobile Game Patterns

    Collection of mobile games design patterns for the inspiration of developers, designers, and artists. ()

  13. Circle Progress Bar

    Handling an SVG path from one single variable to show a wheel indicator. ()

  14. Time is Ticking

    Modifying the new CSS property transform-origin to distribute letters around a circle. ()

  15. Doodle Lander

    Playing with artificial gravity on canvas. I used to play Moon Lander and wanted to recreate some of the physics in JavaScript. ()

  16. 70 Seconds of Terror

    Interactive infographic about the landing of Curiosity Mars Rover, in 13 kB including vector graphics. ()

  17. Doodle Car

    My first experiment using canvas. It plays with forces like acceleration, inertia, momentum, etc. ()

  18. Isometric Walker

    DOM-based matrix of tiles rotated in CSS. When clicking on a tile, an algorithm calculates the shortest path (max. 2 directions). ()

  19. SkiFree

    DOM-based recreation of the game for Windows. The DOM elements are destroyed every time they left the viewport. ()

  20. Just Fruits

    My first fully working experiment. It required so much processing to walk that the pace depended on the browser. ()


Objects that combine hardware and software using everyday materials and tools.

  1. Retro Gaming Handheld

    The best electronics for game emulation inside a 3D printed case I designed using the xbox elite controller as a reference. ()

  2. A 3D printed RC car

    Simpsons TV

    Inspired by Brandon Withrow's project, a Raspberry Pi plays (offline) random episodes 24/7 on an old CRT TV. ()

  3. 3D Printed RC Car

    Fully-printed, 4WD, high-performance, 1:8 scale RC car. Even the gears are fully printed in PLA, and they work smoothly. ()

  4. Word Clock

    I found a vintage clock on the street and upcycled it into a word clock using an individually addressable LED strip and Arduino. ()

  5. Tesla Roadster At Scale

    3D printed parts are rough, and I found the perfect project to learn as much as possible about how to post-process them. ()

  6. MIDI Controller

    I built this as a minimum viable product for beginners. It has no knobs, sliders, or faders, and it runs with minimal code. ()

  7. UV Light Box

    This simple box can make cyanotypes, a photographic printing process that produces blueprints using artificial sunlight. ()

  8. Arcade Machine

    I put together an old Raspberry Pi, monitor, and speakers with MDF boards, Sanwa-like joysticks, and HAPP push buttons. ()

Pixel Art

Drawings made out of squares and other self-imposed constraints.

  1. Welt Balloon


  2. Wasserturm am Ostkreuz

    Wasserturm Ostkreuz

  3. Haus Der Statistik

    Haus Der Statistik

  4. Tram of Berlin

    Berliner Strassenbahn

  5. Bell Nexus air taxi

    Bell's Air Taxi

  6. Vespa Helmet

    Vespa Helmet

  7. Guy Hawkes Mask

    Guy Hawkes Mask

  8. Rolleiflex


  9. Toyota e-palette on-road commerce

    Toyota e-Palette

  10. Telephone Kiosk

    Telephone Kiosk

  11. Raspberry Pi

    Raspberry Pi Model 1


Polished thoughts from my endless list of drafts.

Diferencias entre Virtual DOM de Facebook e Incremental DOM de Google.

Características de este patrón de diseño, más alla de su aspecto visual.

Introducción y punto de partida para saber más sobre este patrón de diseño.

De qué se trata el nuevo protocolo de intercambio de datos.