Buenas, esto es BIMPRAXIS, el podcast donde el
Download transcript (.srt)
0:10
0:15
0:20
0:23
0:26
0:28
0:30
0:40
0:41
0:43
0:45
0:47
0:50
0:52
0:52
0:53
0:56
0:58
1:01
1:02
1:05
1:06
1:08
1:10
1:11
1:12
1:13
1:15
1:17
1:19
1:20
1:22
1:24
1:25
1:27
1:28
1:29
1:32
1:36
1:39
1:42
1:44
1:46
1:47
1:48
1:49
1:52
1:54
1:56
1:57
1:58
2:01
2:03
2:05
2:05
2:06
2:09
2:11
2:13
2:14
2:17
2:19
2:22
2:22
2:24
2:27
2:29
2:30
2:32
2:32
2:34
2:36
2:39
2:39
2:41
2:44
2:45
2:46
2:49
2:52
2:53
2:57
2:59
3:02
3:04
3:05
3:07
3:08
3:09
3:11
3:13
3:14
3:16
3:17
3:19
3:22
3:24
3:26
3:27
3:28
3:29
3:30
3:32
3:34
3:35
3:37
3:39
3:40
3:40
3:42
3:43
3:45
3:46
3:48
3:48
3:51
3:53
3:55
3:57
3:59
4:01
4:03
4:03
4:05
4:08
4:11
4:13
4:14
4:16
4:17
4:18
4:19
4:19
4:22
4:23
4:25
4:26
4:29
4:31
4:31
4:34
4:36
4:37
4:40
4:41
4:42
4:45
4:47
4:47
4:50
4:51
4:53
4:56
4:59
5:01
5:03
5:05
5:07
5:08
5:10
5:11
5:13
5:16
5:19
5:20
5:23
5:25
5:25
5:27
5:29
5:31
5:33
5:34
5:37
5:39
5:41
5:42
5:44
5:45
5:48
5:49
5:50
5:52
5:53
5:54
5:56
5:59
6:01
6:03
6:04
6:07
6:10
6:12
6:14
6:17
6:18
6:19
6:21
6:24
6:27
6:30
6:31
6:33
6:36
6:38
6:41
6:43
6:44
6:46
6:48
6:51
6:54
6:56
6:58
6:59
7:02
7:03
7:06
7:08
7:09
7:12
7:15
7:17
7:18
7:20
7:22
7:24
7:26
7:28
7:29
7:30
7:33
7:36
7:39
7:41
7:45
7:48
7:51
7:54
7:58
8:00
8:03
8:05
8:07
8:08
8:11
8:12
8:14
8:17
8:21
8:21
8:24
8:24
8:28
8:31
8:34
8:34
8:37
8:39
8:40
8:43
8:45
8:48
8:51
8:54
8:56
8:58
9:02
9:03
9:04
9:08
9:10
9:12
9:14
9:16
9:17
9:18
9:20
9:22
9:22
9:24
9:27
9:28
9:31
9:33
9:34
9:37
9:37
9:40
9:43
9:45
9:48
9:48
9:50
9:51
9:53
9:56
9:58
10:00
10:03
10:04
10:07
10:07
10:08
10:10
10:11
10:14
10:16
10:18
10:20
10:24
10:26
10:29
10:31
10:32
10:36
10:38
10:40
10:43
10:45
10:48
10:50
10:52
10:54
10:57
10:57
10:59
11:00
11:03
11:06
11:08
11:09
11:10
11:13
11:15
11:18
11:19
11:22
11:23
11:25
11:28
11:30
11:32
11:35
11:38
11:38
11:40
11:42
11:44
11:45
11:46
11:49
11:52
11:54
11:55
11:57
11:58
11:59
12:02
12:04
12:06
12:09
12:10
12:12
12:15
12:17
12:18
12:20
12:22
12:25
12:27
12:29
12:30
12:31
12:33
12:34
12:36
12:39
12:40
12:41
12:43
12:44
12:45
12:48
12:51
12:53
12:54
12:57
12:58
13:00
13:01
13:03
13:06
13:07
13:11
13:14
13:17
13:20
13:22
13:23
13:26
13:29
13:30
13:43
13:45
13:57
14:00
BIM se encuentra con la inteligencia artificial.
Exploramos la ciencia, la tecnología y el futuro
desde el enfoque de la arquitectura, ingeniería y
construcción.
¡Empezamos!
Buenas, bienvenidos a un nuevo análisis aquí en
BIMPRAXIS.
Hoy traemos un tema fascinante.
La verdad es que sí.
Vamos a ver cómo se documenta la construcción
de una página web completa, desde cero.
Y cuando dices completa, no es solo el
diseño, ¿verdad?
Para nada.
Hablamos de toda la infraestructura, la base de
datos, su publicación y todo, ¿eh?
orquestado a través de una conversación con una
inteligencia artificial.
El material de base es un tutorial muy,
muy detallado.
Y sigue paso a paso la creación de
una landing page real, o sea, algo para
captar clientes.
Cero teoría.
Cero teoría.
Todo práctico.
La herramienta se llama Google Anti-Gravity.
Y lo que me parece más interesante es
la filosofía que hay detrás.
Totalmente.
Hay una analogía que repiten y que creo
que lo resume todo a la perfección.
¿La de las piezas de Lego?
Esa misma.
Es que es tal cual.
Cada instrucción es una pieza simple, pero al
juntarlas todas en el orden correcto… Acabas con
algo complejo, funcional y que, como dicen en
la fuente, simplemente encaja.
Pues venga, vamos a desgranar cómo se montan
esas piezas.
Vale.
El punto de partida es el entorno de
trabajo.
La interfaz de Anti-Gravity se describe como muy
directa, muy limpia.
A la izquierda, un explorador de archivos, lo
típico.
Eso es.
En el centro, el código, los documentos y
a la derecha, la pieza clave.
La ventana de chat con el agente de
IA.
Exacto.
Ahí es donde ocurre, bueno, toda la magia.
Y un detalle importante que se menciona es
que no está atado a un solo modelo
de IA.
La fuente dice que se puede usar Gemini
3 Pro, Clue de Sonnet, lo que sugiere
que la plataforma es más un orquestador que
un modelo en sí.
Exacto.
Y para entender cómo funciona ese orquestador, hay
que entender lo que llaman la arquitectura de
tres capas.
Que es el motor de todo, por lo
que veo.
Totalmente.
La primera capa es la directiva.
Que son las instrucciones humanas, el qué quiero
conseguir.
Precisamente.
Luego, la segunda capa, la orquestación.
El estratega.
Ahí lo tienes.
Aquí es donde el agente de IA interpreta
esa directiva, la divide en tareas y planifica
cómo va a hacerlo todo.
Y por último, la ejecución, el resultado tangible,
el código, los scripts, lo que la IA
escribe para que todo se haga realidad.
O sea que no es como decirles, escribe
esta función.
Es más bien como darle el objetivo final
a un jefe de proyecto, ¿no?
Has dado en el clavo.
Necesito esta web para este producto y que
él se encargue de organizar a su equipo.
Es que es eso.
Ese jefe de proyecto es el agente de
IA.
Esta separación es lo que permite manejar una
complejidad enorme sin que el usuario tenga que
entrar en cada detalle técnico.
El valor está en la visión, no en
la sintaxis.
Exacto.
Vale.
Entorno preparado.
Primera gran pieza del ego.
La estética.
El aspecto visual.
Y aquí, E.
Aquí es donde el proceso se pone muy
interesante.
Mucho.
El punto de partida no es una idea
abstracta.
Es el trabajo real de una diseñadora, Nina
Malikina.
Que el autor del tutorial encontró en Behance,
sí.
Le flipó su estilo y dijo, quiero esto.
Y el método para enseñarle eso a la
máquina es de una astucia tremenda.
No se limita a subir unas cuantas fotos.
No, no, va mucho más allá.
A ver, sí, guarda imágenes de referencia, pero
el paso genial es otro.
¿Cuál?
Hace una captura de pantalla de un texto,
donde la propia diseñadora describe sus reglas.
Su paleta de colores, cómo usa las texturas…
Un momento, eso es crucial.
O sea, no le está pidiendo a la
IA que deduzca el estilo a partir de
imágenes.
¿Qué puede ser?
Impreciso.
Claro.
Le está entregando el manual de instrucciones original.
Es un atajo brillante.
Totalmente.
Es la diferencia entre darle a un chef
un plato para que adivine la receta o
darle la receta secreta directamente.
Tal cual.
Y ese texto, extraído de la imagen con
chat GPT o algo similar, lo guarda en
un archivo.
Así la IA no solo ve el estilo,
sino que lee las reglas.
Y esto nos lleva a una de las
funciones más potentes que describe la fuente.
Las skills.
Las habilidades.
Que son como… ¿Plantillas de procesos?
Piénsalo así.
conjuntos de instrucciones y conocimientos que el sistema
puede reutilizar, como si le enseñaras así se
sigan unas directrices de marca y guardaras ese
conocimiento para usarlo cuando quieras.
Exactamente.
El poder de estas skills es que garantizan
resultados consistentes.
Predecibles.
En lugar de que la IA intente adivinar
cada vez.
Le das un manual de operaciones claro.
Y esto, claro, ahorra tiempo, ciclos de prueba
y error y sobre todo costes computacionales, que
no es ninguna tontería.
La instrucción final de esta fase lo une
todo de una forma muy elegante.
A ver.
Le pide a la gente que analice las
imágenes y el texto de la diseñadora y
que con todo eso genere unas nuevas directrices
de marca para este proyecto.
Y la IA no se pone a escribir
código a lo loco, ¿no?
Responde con un plan de implementación.
Básicamente un resumen de lo que ha entendido
y lo que va a hacer, para que
el usuario le dé el visto bueno.
Es un diálogo.
Una negociación antes de empezar a construir.
Vale.
Aspecto visual definido.
Pero una cara bonita no sirve sin un
esqueleto sólido.
La siguiente pieza.
¿Era la estructura?
Y para eso se apoya en otro experto,
siguiendo el mismo patrón que con el diseño,
lo que es muy revelador del método.
Así es.
El recurso es una publicación de LinkedIn de
un tal James Dickerson, que detalla lo que
él llama la arquitectura de una landing page
de alto rendimiento.
Una fórmula probada sobre qué secciones incluir, en
qué orden.
Para vender.
Es que el rol del desarrollador aquí es
más bien de comisario de conocimiento, ¿no?
Su habilidad no es inventar la estructura, sino
identificar al experto y traducir su conocimiento en
una instrucción.
Y el proceso es un calco del anterior.
Captura de pantalla del post, extracción del texto
y esta vez se lo pasa a un
agente especializado, el skill creator.
Para que lo convierta en una habilidad.
Exacto.
La orden es, convierte esta fórmula en una
nueva skill reutilizable.
Y en minutos, el sistema tiene una habilidad
nueva, creador de landing pages de alta conversión.
Es que esto redefine por completo la naturaleza
del desarrollo.
El trabajo se desplaza.
De la microgestión del código… A la macrogestión
de la estrategia.
La pregunta ya no es, ¿sé programar esto?
Sino, ¿he encontrado el mejor marco de referencia
para resolver este problema?
Y para completar el puzle faltaba el contenido,
el lead magnet, en este caso un documento
de texto con una investigación.
También lo sube a la herramienta.
Con lo cual la IA ya tiene las
reglas de diseño, las de estructura y la
materia prima, el contenido.
Tiene todas las piezas sobre la mesa.
Y la orden final es una sinfonía que
lo conecta todo.
A ver esa orden.
Le dice textualmente.
Primero, lee y entiende a fondo el documento
para escribir el texto de la web Segundo,
usa la skill de landing pages de alto
rendimiento La que acaban de crear Tercero, aplica
estrictamente las directrices de marca de Nina Malikina
Y como guinda, crea una web elegante, moderna
y con efectos visuales como el parallax al
hacer scroll Una directiva completísima No deja lugar
a la ambigüedad, pero le da toda la
autonomía para la ejecución Y entonces llega el
momento de la verdad.
La IA procesa todo y genera la primera
versión.
Y aquí el creador del tutorial es muy
honesto.
El resultado no es perfecto.
La página funciona, el contenido está, la estructura
es correcta, pero le falta vida, le falta
alma.
Carece de las texturas, los patrones.
Exacto.
Esos detallitos que hacían especial el diseño original.
Este es un punto crucial y desmitificador.
Estas herramientas no son varitas mágicas.
No.
El humano aquí asume un rol que la
fuente define perfectamente.
Director de arte.
La habilidad clave es analizar el resultado, ver
qué falla y dar un feedback preciso.
La IA es una ejecutora rapidísima, pero el
criterio… El buen gusto, la visión… ¿eso sigue
siendo, por ahora, humano?
Me recuerda a cuando intenté usar un generador
de imágenes para un logo.
Me daba cosas técnicamente perfectas, pero… ¿Planas?
Sin alma.
Sin alma.
Tuve que darle 20 instrucciones del tipo, no,
más imperfecto, como si estuviera dibujado a mano,
para acercarme a lo que buscaba.
Es exactamente eso.
El valor está en la calidad de la
dirección que das.
Y el feedback que le dan en el
tutorial es súper específico.
No es un, hazlo más bonito.
Claro.
Es.
Añade más textura usando patrones como en la
imagen A.
Implementa más elementos de parallax con los puntos
del diseño original y dale una estética más
divertida.
Y el autor añade una nota importante, ¿verdad?
Sí.
Que el resultado mejora muchísimo si le proporcionas
tus propios recursos gráficos, como un PNG de
una pegatina que hayas diseñado tú.
Y aquí la fuente introduce otra observación muy
interesante.
Sobre los modelos de IA.
Exacto.
Sugiere que para este tipo de tareas creativas,
de código y diseño, el modelo Cloud parece
funcional mejor que Gemini.
O sea, que no solo hay que saber
dar buenas instrucciones… …sino también conocer las sutilezas
de cada herramienta.
No todos los martillos sirven para todos los
clavos.
Perfecto.
Tras un par de vueltas, la web ya
tiene el aspecto deseado.
Pero, ¿cómo sale de ahí al mundo real?
¿Cómo pasa de ser un proyecto local a
una URL pública?
Entramos en el terreno del backend y el
despliegue, tareas que tradicionalmente han sido un cuello
de botella técnico para mucha gente.
Para ello, la fuente usa tres plataformas externas.
Primero, GitHub, para el código.
El estándar.
Segundo, Supabase, que funcionará como base de datos
para recoger los emails y los nombres.
Y tercero, Vercel, para alojar la web.
Y la pregunta es, ¿cómo habla la IA
de Antigravity con estos servicios?
La respuesta está en algo que llaman MCPs,
Protocolo de Contexto del Modelo.
Que, en cristiano, es el sistema que le
permite a la IA conectarse y dar órdenes
a servicios como GitHub o Supabase de forma
segura.
Le das las llaves, básicamente.
Tal cual.
Instalas el MCP de GitHub, el de Supabase,
los autorizas una vez y la IA ya
tiene permiso para operar en tu nombre o
para conectar el formulario a la base de
datos.
Todo ese trabajo complejo se abstrae por completo.
Se reduce a una conversación.
El usuario le pide en lenguaje natural.
Crea una base de datos en mi cuenta
de Supabase para guardar los contactos.
Llámala a Leads.
Necesito campos para nombre y mail.
Luego, implementa un formulario emergente en la web.
Y por último, conéctalo todo para que los
datos se guarden automáticamente.
Es que la barrera de entrada para crear
aplicaciones web completas se desploma de una manera
espectacular.
Y el proceso final que muestra la fuente
es casi vertiginoso.
La IA confirma que ha creado la tabla
en Supabase.
Con las columnas correctas.
Se prueba el formualio, se introduce un nombre,
un correo, se pulsa el botón e inmediatamente
esos datos aparecen en la tabla de Supabase.
Funciona.
El sistema está vivo.
Exacto.
Siguiente paso.
Sube todo el proyecto al repositorio de GitHub.
La IA lo empaqueta y lo envía.
Y el último paso es en Vercell.
Importar el proyecto desde GitHub y desplegar.
Un par de clics.
Y el resultado final es una URL pública
con la web funcional, conectada a la base
de datos y accesible desde cualquier parte del
mundo.
Un viaje completo.
Desde una idea inspirada en el trabajo de
una diseñadora hasta un producto digital desplegado.
Entonces, si damos un paso atrás, ¿qué nos
llevamos de todo esto?
El recorrido es increíble.
Desde luego.
Se parte de unas imágenes de Behance y
un texto de Linkering.
y se llega a una página web completa
con diseño, contenido, base de datos, todo publicado.
¿Tor?
¿Un programador?
El humano ha sido todo eso y nada
de eso a la vez.
Exacto.
El valor de su trabajo se ha desplazado
de la ejecución manual a la estrategia, a
la curación de fuentes, a la dirección de
arte.
Se trata menos de hacer y más de
dirigir.
Y para terminar, una idea que se exprende
de todo esto.
El proceso que hemos visto es brillante para
ejecutar una visión humana ya definida.
Pero la pregunta que queda en el aire
es, ¿qué pasará cuando estas herramientas no solo
ejecuten, sino que empiecen a proponer?
Cuando la IA, después de analizar el contenido,
sugiera una estrategia de marketing diferente o un
concepto de diseño original que no se base
en nada.
¿Seguiremos siendo directores de arte o nos convertiremos
inevitablemente en sus colaboradores creativos?
Ahí lo dejamos.
Buena pregunta para reflexionar.
Y hasta aquí el episodio de hoy.
Muchas gracias por tu atención.
Esto es BIMPRAXIS Nos escuchamos en el próximo
episodio