Flostep es una herramienta web orientada a esbozar, recorrer y compartir diagramas de diseño de sistemas de forma interactiva. Funciona como un lienzo en el que el usuario arrastra componentes predefinidos —Frontend, Servicio, Base de datos, Caché, Cola y API externa, además de piezas personalizadas— y los conecta con flechas en el orden en que ocurren las interacciones, etiquetando cada paso con la acción correspondiente (por ejemplo, "POST /login" o "cache miss").
Una vez construido el diagrama, la herramienta permite recorrerlo paso a paso: el paso activo se ilumina y el resto se atenúa, lo que facilita su uso en revisiones de diseño, procesos de onboarding y entrevistas técnicas. Flostep también admite generar el diagrama automáticamente pegando líneas de texto plano con el formato "A -> B: acción" y compartirlo mediante un enlace público de solo lectura —que no requiere cuenta para visualizarlo— o incrustarlo en Notion, Confluence o blogs con un único iframe.
La plataforma integra el Model Context Protocol (MCP), por lo que asistentes como Claude, Cursor, VS Code y Windsurf pueden crear, leer y modificar los diagramas a partir de descripciones en lenguaje natural o del propio código. Dispone de un panel de notas para trade-offs y preguntas abiertas, autoguardado en la nube y un plan gratuito además de una versión Pro de pago. La entrada es gratuita y no exige tarjeta.