TUI Studio – herramienta de diseño de UI para terminal

• Herramienta con un editor similar a Figma para diseñar visualmente la UI de aplicaciones basadas en terminal, con una interfaz de arrastrar y soltar
• Compatible con más de 20 componentes TUI y un motor de layout similar a CSS, lo que permite colocar en una vista previa ANSI en tiempo real distintos elementos como Box, Button y Table
• Ofrece 8 temas de color y funciones para guardar y cargar proyectos, que se pueden compartir entre equipos como archivos JSON .tui
• Más adelante ofrecerá compatibilidad con la exportación de código a 6 frameworks como Ink, BubbleTea, Blessed, Textual, OpenTUI y Tview (por ahora no funciona, ya que está en fase alfa)
• Puede ejecutarse en macOS, Windows y Docker, y está publicado como open source

---

Descripción general

• TUIStudio es una herramienta para diseñar visualmente interfaces de usuario basadas en texto (TUI) para aplicaciones de terminal
  • Los usuarios pueden colocar componentes en un lienzo visual y ajustar propiedades en tiempo real sin escribir código
  • Ofrece un entorno de edición similar a Figma

Funciones principales

• Visual Canvas: permite colocar componentes con arrastrar y soltar, y revisar el resultado mediante una vista previa ANSI en tiempo real
• Más de 20 componentes: incluye Screen, Box, Button, TextInput, Table, List, Tree, Tabs, Modal, Spinner, ProgressBar y más
• Motor de layout: admite modos Absolute, Flexbox y Grid, con control de propiedades similar a CSS
• 8 temas de color: incluye Dracula, Nord, Solarized, Monokai, Gruvbox, Tokyo Night, Nightfox y Sonokai
• Guardar/cargar proyectos: se guardan como archivos JSON .tui, lo que facilita la portabilidad y la colaboración

Exportación de código

• Compatibilidad planeada con 6 frameworks: Ink (TypeScript), BubbleTea (Go), Blessed (JavaScript), Textual (Python), OpenTUI (TypeScript) y Tview (Go)
• Una UI diseñada una vez podrá convertirse en código para varios frameworks
• Actualmente está en fase alfa, por lo que la función de exportación de código todavía no funciona

Plataformas compatibles

• Puede ejecutarse en macOS, Windows y Docker
• En macOS, si la ejecución es bloqueada por la advertencia de seguridad de Gatekeeper, hay que seguir el proceso “clic derecho → abrir → Open Anyway”
• En Windows aparece una advertencia de SmartScreen, y puede ejecutarse con “More info → Run anyway”
• En Linux puede instalarse sin restricciones especiales (dpkg -i o doble clic en el archivo)

Licencia y acceso

• Actualmente está en etapa de early access, y las funciones principales de edición son gratuitas
• Más adelante, la versión Pro agregará funciones de pago como herramientas para equipos, sincronización en la nube y soporte prioritario
• Es posible guardar localmente y compartir mediante commits de Git sin necesidad de cuenta ni conexión a la nube

Cómo empezar

• Hay una app nativa para macOS basada en Apple Silicon (M1~M4)
• Puede descargarse y ejecutarse de inmediato sin proceso de instalación
• También se ofrecen versiones para Windows y Docker

[GN⁺]

Opiniones en Hacker News

• Me gustaría que el video demo de la página principal tuviera reproducir/pausar y una barra de controles
  para poder saltar directamente a la parte que uno quiera
  El video real está aquí
  También me pregunto si hay una opción para fijar los elementos a la izquierda/derecha al cambiar el tamaño de la terminal, o si al angostar la ventana el texto se parte en varias líneas o se sale de la pantalla

  • En Firefox puedes mostrar la barra de controles haciendo clic derecho y eligiendo “Show controls”

• No creo que estas interfaces sean text-based
  Que representen conceptos 1:1 dentro de celdas de caracteres no significa que no sean GUI
  Lo importante es la esencia de la UX, y las TUI fueron hechas para eficiencia y potencia (por ejemplo, lazygit)
  Pero si agregas pestañas, botones y casillas clicables con el mouse, en realidad estás aplicando UX de GUI, así que solo es una TUI que se ve como GUI

  • No estoy nada de acuerdo. Borland TurboVision fue uno de los mejores toolkits de TUI de la era DOS y ya traía soporte para mouse con casillas, radio buttons, menús y más
    Ver el artículo de Turbo Vision en Wikipedia
  • Si usa elementos hechos de texto, entonces es una TUI
    Cualquier interfaz puede ser eficiente o ineficiente
    A la gente le gustan las TUI por su accesibilidad por SSH y su simpleza
  • Las TUI están hechas con texto y funcionan dentro de las limitaciones de la terminal
    Las GUI son gráficas y se controlan a nivel de píxel
    El mouse y las TUI existieron antes que las GUI, y ahora están volviendo por razones prácticas
  • Estas interfaces claramente son TUI porque están compuestas solo de texto
    El hecho de que puedan exportarse a varios frameworks de TUI lo demuestra
  • Si ves ejemplos como Zellij, puedes hacer todo con el teclado, pero de vez en cuando hacer clic en una pestaña con el mouse no implica ninguna pérdida funcional
    No creo que haga falta ponerse tan rígido con una distinción filosófica o lingüística

• Lo interesante es este patrón de que las herramientas llegan 5 a 10 años después del problema
  La complejidad operativa ya existe, pero como está distribuida entre muchos actores pequeños, el mercado para una solución estructurada tarda en formarse
  No es una calle sin salida, sino una señal: cuando aparece la primera herramienta que realmente encaja con el flujo de trabajo, puede tener un gran apalancamiento

• Yo no quiero que una TUI se vea como una GUI de baja resolución
  El atractivo de las TUI está en dejar de lado la complejidad y buscar un diseño simple centrado en texto

  • Pero las TUI de los años 1980 y 1990 sí se veían como GUI de baja resolución
    Si hay mouse, me parece bien usarlo para mejorar la discoverability
  • Por eso no me gustan las TUI
    Es difícil representar información o interacciones complejas, y también cuesta descubrir cómo combinar las cosas

• La idea es interesante, pero por ahora “la función de exportar código no funciona”
  O sea, todavía no está en un estado en el que realmente puedas crear una TUI

  • Aun así, sí permite diseñar layouts
    Solo que todavía no alcanza el nivel al que apuntan

• Incluso dejando de lado las críticas, me parece una gran idea
  Tiene un aire de nostalgia por la era de Borland. Tengo ganas de ver cómo evoluciona

  • Pero tampoco habría que ignorar las críticas con fundamento
    Esa actitud de “enfoquémonos solo en lo positivo” puede terminar siendo contraproducente

• Como dice hasta el Readme, parece ‘vibe-coded trash’
  No entiendo por qué algo así llegó a la portada

  • Ya casi todo el software va a usar algún tipo de asistencia de AI
    Con AI se pueden hacer cosas excelentes y también cosas pésimas
    El rechazo ideológico a la AI es una postura bastante minoritaria de lo que parece

• Se nota que el proyecto es ‘vibe-coded’ con solo ver la primera impresión del sitio web
  Todos estos sitios ahora tienen un estilo visual muy parecido

  • Apenas abrí la página, los ventiladores de mi máquina empezaron a acelerarse
    Tiene demasiadas animaciones, y en los sitios de genAI eso se nota todavía más

• Si la generación de código todavía no funciona, no entiendo por qué usar esto
  ¿No es justamente esa la función principal de esta app?

  • Últimamente hay una verdadera moda por las TUI
    Es una mezcla de estética retro y una especie de ‘cultura de expertos’ alrededor de la soltura en la línea de comandos
  • Parece que el objetivo es simplemente mostrar un sitio web hecho con AI

• Me gustaría que hubiera muchas más capturas de pantalla del resultado en la página principal