Proyectos ParaBlox
Un SaaS para armar documentos con contenido aprobado.
ParaBlox permite que equipos técnicos, legales y de ventas armen manuales, propuestas y contratos con módulos de texto reutilizables. El cliente llegó con la idea y un prototipo. Nosotros construimos el producto completo.
- Cliente
- ParaBlox, de Labhat Group Pty Ltd, Melbourne
- Rubro
- Software para empresas (SaaS)
- Qué hicimos
- Producto, backend, frontend, diseño, documentación, videos y guías
El contexto
Manuales, guías, propuestas y contratos repiten los mismos párrafos: la cláusula de confidencialidad, las condiciones de pago, la descripción de la empresa. Cuando ese texto vive en copias, cada cambio obliga a abrir archivo por archivo, y tarde o temprano una versión vieja llega a un cliente.
La idea de ParaBlox es de una empresa de Melbourne, Australia, que llegó a Brova por recomendación. Venía con un prototipo trabajado y buscaba un equipo que lo convirtiera en un producto real.
El desafío
Pasar de un prototipo a un producto que muchas empresas usen todos los días. Al planificarlo encontramos cuatro frentes.
- Muchas empresas en un mismo sistema. Cada una con sus espacios de trabajo, departamentos, permisos y planes, y con sus datos separados de los de las demás.
- Un editor que respete la página. Un contrato se piensa en hojas: lo que se ve en pantalla tiene que ser lo que sale en el PDF.
- Partir de lo que ya existe. Los equipos tienen sus documentos en Word y PDF, y nadie quiere reescribirlos a mano.
- Seguridad desde el día uno. Contratos y propuestas son información sensible de cada empresa.
Todo el producto, con un solo equipo
Hicimos el backend, la app, el diseño, el sitio, la documentación, los videos y las guías. También participamos en la creación del nombre de la marca.
¿Cómo se escribe un párrafo aprobado una sola vez para que aparezca, siempre actualizado, en todos los documentos que lo usan?
Las decisiones
Tres reglas ordenan todo el producto.
Módulos con versión
Cada guardado crea una versión. Un documento enlaza el módulo y recibe los cambios, o guarda su propia copia.
La página como unidad
El editor muestra hojas reales, y el PDF sale del mismo diseño, así las páginas cortan donde se vieron.
El alcance decide quién usa qué
Un módulo puede ser local, de un departamento o de todo el workspace, y ampliarlo puede requerir aprobación.
El producto, en menos de dos minutos.
El video narrado que hicimos para el inicio del sitio de ParaBlox.
Qué hicimos, pantalla por pantalla.
Un inicio que dice qué hacer
La pantalla de inicio muestra lo que necesita atención: documentos que esperan aprobación, módulos con una versión nueva y comentarios sin resolver. Debajo aparecen los documentos recientes, cada uno con su estado.
Cada departamento tiene su página, con sus documentos, su biblioteca, sus miembros y su actividad.
Una biblioteca de módulos
Los módulos viven en carpetas dentro de cada departamento. Se buscan por nombre o por el texto que contienen, sin importar los acentos, y se filtran por tipo, carpeta y etiqueta.
Cada módulo muestra su alcance, su versión y cuántos documentos lo usan, para saber qué se toca antes de cambiarlo.
Un editor con páginas reales
El documento se ve como se va a imprimir: hojas, márgenes y módulos que se parten entre páginas en una línea, un ítem o una fila de tabla. A la izquierda está la biblioteca y a la derecha, el inspector del módulo elegido.
Los módulos se insertan con un clic o arrastrándolos, y se reordenan desde el navegador del documento.
Un cambio, todos los documentos
Al guardar un módulo que usan otros documentos, ParaBlox pregunta hasta dónde llega el cambio: actualizar en todos o solo en este documento.
Las variables como {{client_name}} se completan una vez por documento y aparecen en cada módulo que las usa. Así el mismo módulo sirve para cualquier cliente.
Importar Word y PDF
Un archivo .docx o .pdf se divide en módulos donde cambian los títulos y los temas. La división se ajusta con clics, y nada se guarda hasta confirmar.
El archivo se analiza en el navegador, y se conservan el tamaño de página, los márgenes, los encabezados, los pies y los números de página.
Revisiones y aprobaciones
En el plan Enterprise, cada documento puede pasar por un flujo con revisores y aprobadores agrupados por área, de borrador a aprobado. Cada paso queda en el historial.
Al exportar a PDF o Word, el documento puede sumar una página final con quién lo revisó y aprobó, y cuándo. Antes de exportar, ParaBlox avisa si quedan variables vacías o módulos en edición.
Sitio, documentación y videos
Diseñamos y escribimos el sitio en inglés y en español, con producto, soluciones, seguridad y precios. El centro de ayuda tiene 45 artículos en cada idioma, con buscador.
También hicimos el video narrado del producto, que abre el inicio del sitio, y un teaser para inversores. La app está traducida a 12 idiomas.
El stack
ParaBlox es un monorepo en TypeScript con cinco servicios. La API usa Fastify, Prisma, PostgreSQL y Redis. La app está hecha con Next.js y React, y el editor de texto usa Tiptap. Un servicio aparte genera los PDF con Chromium headless, y el sitio se exporta a HTML estático.
Todo corre en contenedores Docker sobre un servidor dedicado privado, con entornos separados de pruebas y de preproducción. Los cambios pasan por integración continua en GitHub Actions antes de publicarse.
- Next.js
- React
- TypeScript
- Tailwind CSS
- Fastify
- Prisma
- PostgreSQL
- Docker
- Tiptap
- dnd-kit
- Redis
- Chromium headless
- GitHub Actions
- Resend
- Sentry
Seguridad en cada capa
El servidor verifica en cada pedido que la persona pertenezca al workspace dueño del contenido, así ninguna empresa puede leer los documentos de otra. Las contraseñas se guardan con bcrypt, y el ingreso, el registro y la recuperación tienen límites de intentos.
El servicio de PDF corre en una red propia, sin acceso a la base de datos. Antes del lanzamiento auditamos todo el código y sumamos más de 30 pruebas automáticas que corren con cada cambio.
Consola para los founders
Un panel interno muestra el uso de cada workspace, administra cuentas y planes, y controla los entornos de pruebas y de preproducción.
Historial y enlaces para compartir
Cada documento guarda quién cambió qué y cuándo, con una vista de antes y después. Un enlace permite compartirlo con personas fuera del workspace.
Resultados
ParaBlox está en fase de pruebas. Cuando se lance, vamos a sumar a este caso los datos de uso.
Lo que aprendimos
- Un buen prototipo acorta el camino. El cliente llegó con la idea y la lógica pensadas, y nuestro trabajo se concentró en construir el producto.
- En un editor de documentos, la página manda. Si lo que se ve no coincide con lo que se exporta, nadie confía en la herramienta.
- Reutilizar contenido necesita reglas. Los alcances, los roles y las aprobaciones evitan que un cambio llegue a documentos donde no corresponde.
- Importar es la puerta de entrada. Nadie empieza de cero, y traer los Word y PDF existentes hace posible empezar el primer día.
- La seguridad se prueba. Auditar el código y escribir una prueba para cada punto revisado antes de lanzar deja una base que se puede verificar con cada cambio.
