Santiago Bustelo

Los años de la ZX Spectrum

En 1986, me había quedado chica la Timex Sinclair 1000 (16 K de RAM, sin gráficos) con la que había empezado a programar tres años atrás. Como ya me había formado en Sinclair Basic y Assembler Z80, lo lógico era pasarme a una CZ‑Spectrum, clon nacional de la ZX Spectrum: 48 K de RAM, 256 × 192 px de resolución, ¡y color!

En ese entonces conocí un programa para dibujar, “Art Studio”. Ofrecía una interfaz gráfica, ¡y hasta función de deshacer! (el único programa de la Spectrum que lo tenía).

Pasé cientos de horas con este programa dibujando pantallas, así como personajes y escenas para videojuegos que planeaba desarrollar. Art Studio era un clon de MacPaint, pero yo no lo sabía. Tampoco sabía qué era una Mac. Ni siquiera había visto nunca una interfaz gráfica. Pero el sistema de menúes y la función “deshacer” me parecían brillantes, y me preguntaba cómo sería Tasword, el procesador de textos que usaba en la Spectrum, si tuviera menúes y una función de deshacer.

Poco después, en una feria de informática, conocí finalmente una Mac. Ahí vi un sistema donde todo funcionaba como yo quería. Me dije que, cuando fuera grande, me iba a dedicar a hacer que las cosas fueran así.

Dije muchas cosas de chico, pero ésa la cumplí.

Tipografías en 8 × 8 píxeles

La tipografía estándar de la ZX Spectrum era muy poco elegante para textos. Yo quería que mis documentos tuvieran la calidad de un texto impreso, o al menos de una máquina de escribir.

Tasword usaba la tipografía del sistema, que era bastante fea. Entonces me puse a manos a la obra:

• Art Studio tenía un font editor.
• Con un par de POKEs, las tipografías de Art Studio podían funcionar en el procesador de textos.
• Me puse a copiar y a adaptar píxel a píxel, en la grilla de 8 × 8 que ofrecía la Spectrum, distintas tipografías de los catálogos de tipografía que tenía mi madre (que trabajaba en publicidad en ese entonces, cuando los avisos se hacían a mano y con fotomecánica).

Como las tipografías que podía crear con Art Studio eran monoespaciadas, la que terminó funcionando mejor para textos fue una adaptación de la American Typewriter. A eso le sumé rutinas en assembler para generar versiones en negrita e itálica (estilos que se podían combinar entre sí) y algunas utilidades esenciales más, como marcas para cortar el papel continuo de la micro-impresora térmica. El resultado fue bastante aceptable.

Entregué algunos trabajos prácticos de Literatura con mi versión modificada de Tasword. Mientras los demás llevaban hojas de carpeta, yo entregaba papelitos tamaño A5. Estaba bastante orgulloso.

Construir un editor WYSIWYG desde cero

Avanzamos hasta 2005. Para entonces yo ya me había recibido como diseñador gráfico en la FADU‑UBA. Elegí esa carrera porque, para crear productos como Art Studio, me interesaban tanto la programación como el diseño. Como autodidacta sabía que siguiendo ese camino, podía ser un programador regular. Pero para aprender a diseñar, necesitaba mentores. Y la única forma de lograr esa formación, era la experiencia de taller que solo la universidad podía brindar.

En 2005, el Center of Subsurface Modeling de la University of Texas at Austin nos encargó desarrollar lo que hoy se conoce como un CMS. Las opciones de la época eran muy limitadas. Nosotros ya habíamos desarrollado una plataforma que cubría lo que ellos necesitaban.

La innovación que incorporé fue usar la naciente tecnología WYSIWYG en un editor web, en lugar de tags HTML o BBCode. Los editores existentes eran muy complejos, llenos de parches para las distintas versiones de Internet Explorer… navegador que nuestro cliente no usaba. Lo cual me permitió construir de cero el editor HTML WYSIWYG que necesitábamos. Lo más difícil fue atajar las inconsistencias que introducía el copia‑pega desde Word y los tags fantasma de las primeras versiones de Firefox.

Pasé unos tres meses escribiendo expresiones regulares; sé que para muchos eso es lo más cercano a un castigo bíblico. Pero así como hay gente a la que le gustan los rompecabezas, normalizar tags con un /<span\b(?=[^>]*\bbold\b)(?=[^>]*\bitalic\b)[^>]*>(.*?)<\/span>/is, a mí me resultó muy entretenido.

Mi visión era integrar todas las herramientas dentro del editor, algo parecido a lo que hoy vemos con los editores de bloques. Era ambicioso para ese momento. Pero la versión que fue posible construir, llevando al límite las posibilidades de los navegadores de la época, era infinitamente mejor que meter tags a mano.

Reinventar el procesador de textos, 40 años después

Pasaron unos 20 años más. Para cuando escribo estas líneas, ya llevo acumulados más de 1000 proyectos de diseño y desarrollo.

A principios de 2026, harto del trabajo de albañilería que implicaba copiar y pegar texto de generadores Unicode para darle jerarquía a mis publicaciones en LinkedIn, empecé a investigar si existía una forma mejor. Y mientras resolvía ese problema me di cuenta de que me venía preparando hace 40 años para hacerlo.

La solución era tomar la lógica de un procesador de textos real (en donde escribir, formatear y corregir son acciones libres que no te imponen un orden) y aplicarla a los estilos Unicode.

O sea, hacer un clon de MacWrite: eso que soñé hacer allá por los 80, sin saber que existía.

Armé un prototipo rápido que resolvió mi problema. Me pregunté si tenía sentido convertirlo en un side project para que otros pudieran usarlo: la respuesta fue positiva. Construirlo y hacerlo público valía la pena. ¿Será un gran negocio? ¿Al menos pagará las horas invertidas? Quién sabe. Esa nunca fue la pregunta.

Usé mi propia herramienta todos los días y fui afinando cada detalle. El objetivo era detectar cada punto de fricción y eliminarlo. Porque cuando una herramienta te obliga a trabajar en determinado orden (y si te salteás ese orden, perdés el trabajo o tenés que rehacer todo), el modelo de interacción te está condicionando. Mi premisa fue justamente la contraria: que la herramienta se adaptara a cómo escribo, y no al revés.

El primer procesador de textos para estilos Unicode

De todo este proceso surgieron las características diferenciales de FlowStyler:

• Estilos en vivo: el editor infiere el estilo donde apoyás el cursor, para que corregir o seguir escribiendo no rompa el flujo. Te dejás de pelear con la herramienta y podés iterar en paz.
• Estilos combinables: en los casos soportados, podés usar bold, italic, subrayado y también tachado. Todo junto, sin que un estilo pise al otro.
• Ajustar Mayúsculas/minúsculas: cuando estás editando, podés ajustar mayúsculas y minúsculas sin perder los estilos que ya aplicaste.
• Listas avanzadas: bullets, listas numeradas, números romanos, alfabéticas, números en círculos Unicode y letras en cuadrados. Y lo más importante: podés editarlas, ordenarlas y renumerarlas sin salir de la app ni tocar Word o Excel.
• Contador de caracteres en tiempo real, siempre a la vista mientras escribís.

Más que una lista de funcionalidades, son los atributos distintivos de una categoría que no existía: el primer procesador de textos para estilos Unicode.

Hace 40 años pensaba que, cuando fuera grande, me gustaría ser inventor. Creo que si mi yo del pasado se encontrara conmigo ahora, se pondría muy contento.

Hoy soy Director UX en Kambrica, consultor y mentor en UX, estrategia y Producto. Podés encontrarme en bustelo.com.ar o escribirme por LinkedIn.