La mayoría de las herramientas de diseño piden llegar con la idea terminada. typos empieza antes: en el momento en que una palabra deja de ser solo texto y empieza a parecer materia, algo que se puede estirar, ondular, repetir o proyectar en el espacio.
Es un estudio de tipografía en el navegador que convierte palabras en sistemas tipográficos editables y los exporta como SVG vectorial.
La portada es ya la herramienta: una plantilla en directo con la palabra que quieras.
El reto
Experimentar con tipografía expresiva suele exigir un programa de escritorio y bastante oficio. typos quería acortar esa distancia: que cualquiera pudiera probar una idea en segundos y, si le gusta el resultado, tener un archivo de calidad profesional, no una captura.
Cómo funciona
Se elige una plantilla, se cambia el texto y se ajustan sus parámetros: movimiento, distorsión, proyección, espaciado y color. El diseño se guarda editable y se exporta en SVG vectorial o en PNG de alta resolución.
El editor: la obra en el centro y, a la derecha, plantilla, texto, fuente, parámetros y exportación.
Cada diseño publicado puede formar parte de un perfil público, aparecer en la galería, mezclarse con otras obras o prepararse para convertirse en un producto físico.
La galería convierte los experimentos en un cuerpo de trabajo público que otros pueden remezclar.
Decisiones técnicas
Contornos reales, no capturas. Con opentype.js se leen los contornos de la fuente elegida y cada palabra se convierte en trazados SVG. Las operaciones geométricas se hacen con Paper.js, así que el resultado sigue nítido a tamaño póster o en una camiseta.
SVG siempre que se pueda. Solo las plantillas que necesitan un render 3D real (con Three.js) se exportan como imagen de alta resolución. El resto se queda en vectorial, que es lo que se puede imprimir, editar y reutilizar en otro flujo de diseño.
Legible también para agentes. typos publica una página de datos del producto y un llms.txt para que buscadores y asistentes de IA entiendan qué es y qué hace. Es la misma idea que he aplicado a esta web.
Estado
typos está publicado y es pequeño a propósito: lo construyo yo solo, con la paciencia y los límites que eso implica. Es el proyecto más personal del estudio, y el que mejor resume una obsesión: que las herramientas digitales sean precisas, útiles y un poco más humanas.