FlutterFlow: el intento de reconciliar el no-code con el código real
La idea de “crear una app con el ratón” es casi tan antigua como los propios smartphones. Pero hasta hace poco el resultado de esos constructores chocaba siempre con el mismo techo: un prototipo bonito que nunca podía convertirse en un producto serio. En cuanto la lógica de negocio se complicaba, el equipo descubría que la plataforma solo hacía lo que sus creadores habían previsto — y más allá, un callejón sin salida.
FlutterFlow nació en 2020 como respuesta directa a ese problema. Un equipo de Y Combinator (los fundadores Abel Mengistu y Alex Greaves) decidió no inventar otra runtime, sino poner un editor visual sobre Flutter — el framework de código abierto de Google detrás de apps reales en producción como Alibaba, BMW y Google Pay. Las apps no se “renderizan en la nube de FlutterFlow”: debajo siempre hay un proyecto Flutter normal, y el editor visual es solo una capa cómoda encima.
Esa decisión de arquitectura es justo lo que hace interesante a FlutterFlow. No te encierra en su propio ecosistema como hacen los constructores no-code clásicos. Veamos cómo funciona en la práctica, cuánto cuesta y dónde tropieza todavía la plataforma.
Sitio oficial: flutterflow.io
Qué es realmente FlutterFlow
FlutterFlow es un entorno low-code en la nube para crear apps móviles para iOS y Android, además de apps web. Todo ocurre en el navegador: arrastras widgets a una pantalla, configuras sus propiedades en el panel derecho y ves el resultado al instante en un marco de teléfono. Sin entorno local, sin compiladores, sin IDE que instalar.
Elementos clave de la plataforma:
- Editor visual de UI — más de 200 widgets predefinidos, rejillas, listas, formularios, navegación, animaciones de transición.
- Integración con Firebase y Supabase — base de datos, autenticación, almacenamiento de archivos y funciones de nube se conectan en unos pocos clics.
- API Calls — conecta cualquier endpoint REST o GraphQL sin escribir código.
- Custom Code — inserta tu propio código Dart y usa cualquier paquete del ecosistema Flutter.
- State Management — gestiona el estado de la app (App State, Page State y escenarios más complejos).
- Integración con GitHub — sincroniza el código con tu propio repositorio.
- Exportación de código — descarga a disco un proyecto Flutter completo.
Los dos últimos puntos — exportación de código y GitHub — son lo que distingue radicalmente a FlutterFlow de los constructores clásicos tipo “burbuja”, de los que nunca se puede sacar el código.
Pros y contras
Pros:
- Código Flutter real a la salida — sin dependencia del proveedor.
- Buena velocidad de desarrollo para apps simples y medianas: un MVP se arma en días, no en meses.
- Potente integración con Firebase y Supabase — “backend listo para usar”.
- Puedes escribir Dart cuando los bloques visuales no bastan.
- Comunidad activa, marketplace de plantillas, documentación amplia y tutoriales en vídeo.
- Exportación del proyecto y sincronización con GitHub.
- Multiplataforma: una sola base de código para iOS, Android y Web.
Contras:
- La plataforma es de pago y, en la práctica, no hay plan gratuito para trabajo real.
- Las interfaces complejas y muy personalizadas se construyen despacio, de forma “pastosa” — el editor visual estorba en lugar de ayudar.
- El código generado suele ser “ruidoso”: mantener una arquitectura limpia en el proyecto exportado es difícil.
- El enganche a Firebase es cómodo para empezar, pero migrar a otro backend exige trabajo.
- El trabajo en equipo requiere un plan caro.
- Las pantallas pesadas empiezan a ir lentas en el editor.
Funcionalidad: capa por capa
Interfaz y construcción de pantallas
El editor sigue la lógica habitual de “canvas + inspector”. A la izquierda, el árbol de widgets; en el centro, el layout; a la derecha, las propiedades del elemento seleccionado. Los widgets de Flutter se renombran a entidades comprensibles: contenedores, columnas, filas, textos, botones, imágenes. Para tareas típicas (feed, ficha de producto, formulario de registro, página de cuenta) hay plantillas.
El punto más fuerte son los componentes. Si construyes una ficha de producto una vez, puedes convertirla en un componente reutilizable con parámetros y colocarla donde quieras. Esto ya no es una “herramienta de dibujo”, sino un sistema real de construcción de interfaces.
Cabe mencionar la importación desde Figma: un diseño puede transferirse parcialmente a FlutterFlow, ahorrando trabajo de maquetación a los equipos con diseño. No funciona de forma perfecta, pero en diseños típicos acelera notablemente el arranque.
Lógica, datos, integraciones
La lógica se arma con acciones listas: “navegar a pantalla”, “llamar a API”, “actualizar documento en la base”, “mostrar mensaje”, “escribir valor en App State”. Para condiciones complejas hay un editor visual de expresiones y lógica condicional. Cuando eso no basta, entra Custom Code: escribes una función en Dart y queda disponible como un bloque normal.
La integración con Firebase es lo que más se valora de FlutterFlow. Autenticación (correo, Google, Apple, anónima), Cloud Firestore, Realtime Database, Storage, Remote Config — para la mayoría de los MVP todo se conecta en una tarde. Supabase funciona de forma parecida si prefieres un stack abierto sobre PostgreSQL.
Exportación, GitHub y propiedad del código
La posibilidad de descargar el proyecto y sincronizarlo con GitHub es el principal argumento para quien teme el lock-in. Obtienes un proyecto Flutter normal que compila con flutter build y puede seguir editándose en cualquier IDE. Sin embargo, no es Flutter “limpio”: el código se genera automáticamente, con muchas abstracciones de servicio, y mantenerlo a mano en forma exportada es bastante más difícil que escribirlo desde cero. La exportación es un seguro y un punto de entrada, no la transformación gratuita en una base de código ordenada.
Publicar apps
FlutterFlow permite compilar para App Store y Google Play directamente desde la interfaz, pero un lanzamiento real suele requerir un plan adecuado, además de cuentas de desarrollador de Apple (99 $/año) y Google (25 $ único). Son gastos aparte que los principiantes suelen olvidar.
Precios: cuánto cuesta trabajar
FlutterFlow funciona por suscripción. En el momento de la publicación, los planes principales son así (precios aproximados; los exactos, en el sitio):
- Free — plan gratuito para probar, pero con límites importantes de compilación y sin publicación. Para un proyecto real no alcanza.
- Standard — aproximadamente desde ~30 $ al mes (con pago anual). Para un desarrollador, proyectos personales y pequeños.
- Pro — aproximadamente desde ~70 $ al mes. Elimina la mayoría de los límites, abre integraciones de API, exportación de código y más compilaciones.
- Team / Enterprise — planes de equipo y corporativos, facturados por usuario, con permisos ampliados, SSO y soporte.
Matiz importante: además de la suscripción, casi siempre hay costes de backend. Firebase tiene su propio nivel gratuito, pero la factura crece con los usuarios. El coste real de propiedad es FlutterFlow + Firebase + cuentas de desarrollador + posibles paquetes de pago.
A modo de comparación: alquilar un VPS para tu propio backend es más barato y predecible, pero exige a alguien que sepa manejarlo. Si el presupuesto importa, calcula antes.
En la práctica: para quién encaja
Escenario 1. Fundador sin equipo técnico. FlutterFlow es una de las pocas vías para construir un MVP móvil real sin contratar desarrolladores. En un mes puedes llegar de forma realista a una versión que mostrar a inversores y primeros usuarios. El límite es el techo de complejidad: cuanto más inusual la lógica, más a menudo entrarás en Dart.
Escenario 2. Equipo pequeño con un desarrollador propio. Aquí la ganancia está en la velocidad. El diseñador entrega la maqueta, el desarrollador arma las pantallas y conecta Firebase, y escribe la lógica compleja en Dart. FlutterFlow cubre la parte “aburrida”: la maquetación y las integraciones típicas.
Escenario 3. Herramientas internas y paneles de administración. Para apps de servicio (preparación de pedidos, almacén, checklists, reporting) la plataforma encaja casi mejor que cualquier otra cosa: la velocidad importa más que la arquitectura ideal.
Escenario 4. Un producto complejo con altos requisitos de rendimiento. Por ejemplo, apps con animación pesada, procesamiento de vídeo, gestos no estándar o control muy preciso del renderizado. Aquí el editor visual estorba: lucharás contra él y acabarás igualmente en Dart manual.
Ten en cuenta también la ilusión de “ya no dependemos de desarrolladores”. La plataforma baja la barrera de entrada, pero no elimina tareas de ingeniería: arquitectura, seguridad, optimización del backend, monetización, analítica. El low-code cambia la pregunta de “quién lo escribirá” a “quién lo mantendrá”.
Veredicto
FlutterFlow es una de las herramientas más logradas de la categoría low-code para desarrollo móvil. Su diferencia clave es Flutter real a la salida, no una caja cerrada. Eso lo convierte en un trato aceptable para quien teme el lock-in: en el peor caso te queda un código que puedes desarrollar por tu cuenta.
Cuándo usarlo: MVP y prototipos; apps internas; productos simples y de complejidad media con un conjunto típico de funciones (auth, feeds, formularios, catálogos, pedidos); equipos que necesitan validar una hipótesis rápido.
Cuándo no usarlo: si el proyecto exige de entrada una interfaz no estándar y lógica compleja; si es crítica una arquitectura de código perfectamente limpia; si no hay presupuesto para la suscripción y el backend y el plan gratuito no basta.
Un criterio simple: toma la tarea que quieres construir. Si puede describirse como “pantalla → datos → acción → pantalla”, FlutterFlow casi seguro te acelerará. Si la tarea suena a “necesitamos nuestro propio motor”, ve a Flutter puro y ahórrate el combate a ti y al editor.