10 entradas etiquetadas con #técnicas.
De niño esperaba con ganas los títulos de crédito del principio de las películas, porque la gente salía alargada y flaca y a mí me hacía gracia. Tardé décadas en entender por qué pasaba aquello, y por qué solo pasaba al empezar.
Leer Cuando los actores salían estirados al empezar la película →Un niño en la calle no supo leer un papel manuscrito. Lo que empezó como una escena cotidiana se convirtió en una pregunta que no sé muy bien cómo responder: ¿sigue siendo necesario escribir a mano en plena era digital?
Leer Escribir a mano: ¿necesidad o nostalgia? →Un tutorial paso a paso para construir el clásico Tetris en una sola página web. Es la pieza más completa de la serie hasta ahora: rotación de matrices, gravedad por turnos, y la lógica de eliminación de líneas, que es el corazón del juego y sigue siendo, cuarenta años después, una de las invenciones más limpias de la historia de los videojuegos.
Leer Cómo programar el juego de Tetris desde cero →Un tutorial paso a paso para construir un clásico juego de ladrillos —de la familia de Breakout y Arkanoid— en una sola página web. Es el juego más completo de la serie hasta ahora: combina la física de Pong con la gestión de muchos objetos a la vez y una lógica de niveles que da mucho juego.
Leer Cómo programar el juego de ladrillos desde cero →El círculo cromático lleva siglos explicando por qué ciertos colores funcionan juntos. Te cuento cómo convertir esa teoría en una pequeña utilidad web que calcule paletas armónicas a partir de cualquier color.
Leer Cómo construir una herramienta de armonías de color con JavaScript →Un tutorial paso a paso para construir el clásico Snake en una sola página web, sin frameworks, sin dependencias y sin más de doscientas líneas de código. Al final del artículo te dejo el prototipo funcional para que juegues.
Leer Cómo programar el juego de la serpiente desde cero →Cuando compartes un enlace en redes sociales, lo primero que ves es una imagen. Crear esas imágenes a mano para cada post es tedioso, y conectar un servicio externo es sobredimensionar el problema. La solución está en el propio build: un generador TypeScript produce un SVG por post, y resvg-wasm los convierte a PNG durante la compilación. Sin servicios externos, sin imágenes que mantener a mano.
Leer Imágenes Open Graph automáticas con Lume →El problema clásico: el texto va a 65 caracteres, pero las imágenes quieren ancho completo y las citas se quedan más estrechas. La solución habitual acumula divs wrapper sin semántica. Con un grid de columnas nombradas basta con una clase en el elemento hijo para que decida su propio ancho — sin wrappers, sin media queries, sin max-width repetidos por todo el CSS.
Leer Un sistema de layout con CSS Grid y columnas nombradas →Un tutorial paso a paso para construir el clásico Pong en una sola página web. Es probablemente el videojuego más sencillo jamás concebido y, precisamente por eso, una de las mejores formas de entender cómo funciona la física de los juegos.
Leer Cómo programar Pong desde cero →Después de recuperar el listado de mi juego de 1989, una pregunta loca: ¿se podría hacer correr en un navegador? Con los píxeles originales, sin emulador. Spoiler: sí, juega bastante decente y al final está aquí abajo para que lo pruebes.
Leer Volver a programar el juego que programé a los dieciséis →
