1
00:00:10,000 --> 00:00:15,800
Buenas, esto es BIMPRAXIS, el podcast donde el

2
00:00:15,800 --> 00:00:17,920
BIM se encuentra con la inteligencia artificial.

3
00:00:20,519 --> 00:00:23,620
Exploramos la ciencia, la tecnología y el futuro

4
00:00:23,620 --> 00:00:26,559
desde el enfoque de la arquitectura, ingeniería y

5
00:00:26,559 --> 00:00:27,179
construcción.

6
00:00:28,859 --> 00:00:29,519
¡Empezamos!

7
00:00:30,000 --> 00:00:40,439
Buenas, bienvenidos a un nuevo análisis aquí en

8
00:00:40,439 --> 00:00:41,740
BIMPRAXIS.

9
00:00:41,740 --> 00:00:43,759
Hoy traemos un tema fascinante.

10
00:00:43,759 --> 00:00:45,079
La verdad es que sí.

11
00:00:45,140 --> 00:00:47,219
Vamos a ver cómo se documenta la construcción

12
00:00:47,219 --> 00:00:49,780
de una página web completa, desde cero.

13
00:00:50,320 --> 00:00:52,119
Y cuando dices completa, no es solo el

14
00:00:52,119 --> 00:00:53,039
diseño, ¿verdad?

15
00:00:52,539 --> 00:00:53,820
Para nada.

16
00:00:53,820 --> 00:00:56,240
Hablamos de toda la infraestructura, la base de

17
00:00:56,240 --> 00:00:58,560
datos, su publicación y todo, ¿eh?

18
00:00:58,820 --> 00:01:01,000
orquestado a través de una conversación con una

19
00:01:01,000 --> 00:01:02,460
inteligencia artificial.

20
00:01:02,479 --> 00:01:05,060
El material de base es un tutorial muy,

21
00:01:05,060 --> 00:01:06,120
muy detallado.

22
00:01:06,400 --> 00:01:08,000
Y sigue paso a paso la creación de

23
00:01:08,000 --> 00:01:10,500
una landing page real, o sea, algo para

24
00:01:10,500 --> 00:01:11,939
captar clientes.

25
00:01:11,739 --> 00:01:12,420
Cero teoría.

26
00:01:12,939 --> 00:01:13,920
Cero teoría.

27
00:01:13,920 --> 00:01:14,680
Todo práctico.

28
00:01:15,439 --> 00:01:17,920
La herramienta se llama Google Anti-Gravity.

29
00:01:17,980 --> 00:01:19,620
Y lo que me parece más interesante es

30
00:01:19,620 --> 00:01:21,340
la filosofía que hay detrás.

31
00:01:20,840 --> 00:01:22,120
Totalmente.

32
00:01:22,120 --> 00:01:24,219
Hay una analogía que repiten y que creo

33
00:01:24,219 --> 00:01:26,299
que lo resume todo a la perfección.

34
00:01:25,980 --> 00:01:27,120
¿La de las piezas de Lego?

35
00:01:27,180 --> 00:01:28,159
Esa misma.

36
00:01:28,159 --> 00:01:29,560
Es que es tal cual.

37
00:01:29,560 --> 00:01:32,159
Cada instrucción es una pieza simple, pero al

38
00:01:32,159 --> 00:01:36,159
juntarlas todas en el orden correcto… Acabas con

39
00:01:36,159 --> 00:01:39,439
algo complejo, funcional y que, como dicen en

40
00:01:39,439 --> 00:01:41,680
la fuente, simplemente encaja.

41
00:01:42,159 --> 00:01:44,680
Pues venga, vamos a desgranar cómo se montan

42
00:01:44,680 --> 00:01:45,260
esas piezas.

43
00:01:46,000 --> 00:01:47,000
Vale.

44
00:01:47,000 --> 00:01:48,840
El punto de partida es el entorno de

45
00:01:48,840 --> 00:01:49,920
trabajo.

46
00:01:49,920 --> 00:01:52,939
La interfaz de Anti-Gravity se describe como muy

47
00:01:52,939 --> 00:01:54,280
directa, muy limpia.

48
00:01:54,599 --> 00:01:56,840
A la izquierda, un explorador de archivos, lo

49
00:01:56,840 --> 00:01:57,260
típico.

50
00:01:57,500 --> 00:01:58,500
Eso es.

51
00:01:58,500 --> 00:02:01,379
En el centro, el código, los documentos y

52
00:02:01,379 --> 00:02:03,400
a la derecha, la pieza clave.

53
00:02:03,260 --> 00:02:05,200
La ventana de chat con el agente de

54
00:02:05,200 --> 00:02:05,299
IA.

55
00:02:05,760 --> 00:02:06,780
Exacto.

56
00:02:06,780 --> 00:02:10,000
Ahí es donde ocurre, bueno, toda la magia.

57
00:02:09,860 --> 00:02:11,780
Y un detalle importante que se menciona es

58
00:02:11,780 --> 00:02:13,740
que no está atado a un solo modelo

59
00:02:13,740 --> 00:02:14,180
de IA.

60
00:02:14,659 --> 00:02:17,159
La fuente dice que se puede usar Gemini

61
00:02:17,159 --> 00:02:19,860
3 Pro, Clue de Sonnet, lo que sugiere

62
00:02:19,860 --> 00:02:22,120
que la plataforma es más un orquestador que

63
00:02:22,120 --> 00:02:23,379
un modelo en sí.

64
00:02:22,900 --> 00:02:24,259
Exacto.

65
00:02:24,259 --> 00:02:27,340
Y para entender cómo funciona ese orquestador, hay

66
00:02:27,340 --> 00:02:29,780
que entender lo que llaman la arquitectura de

67
00:02:29,780 --> 00:02:30,680
tres capas.

68
00:02:30,719 --> 00:02:32,280
Que es el motor de todo, por lo

69
00:02:32,280 --> 00:02:32,979
que veo.

70
00:02:32,879 --> 00:02:34,219
Totalmente.

71
00:02:34,219 --> 00:02:36,580
La primera capa es la directiva.

72
00:02:36,560 --> 00:02:39,340
Que son las instrucciones humanas, el qué quiero

73
00:02:39,340 --> 00:02:40,240
conseguir.

74
00:02:39,780 --> 00:02:41,419
Precisamente.

75
00:02:41,419 --> 00:02:44,560
Luego, la segunda capa, la orquestación.

76
00:02:44,360 --> 00:02:45,159
El estratega.

77
00:02:45,319 --> 00:02:46,500
Ahí lo tienes.

78
00:02:46,500 --> 00:02:49,099
Aquí es donde el agente de IA interpreta

79
00:02:49,099 --> 00:02:52,240
esa directiva, la divide en tareas y planifica

80
00:02:52,240 --> 00:02:53,919
cómo va a hacerlo todo.

81
00:02:53,780 --> 00:02:57,479
Y por último, la ejecución, el resultado tangible,

82
00:02:57,479 --> 00:02:59,900
el código, los scripts, lo que la IA

83
00:02:59,900 --> 00:03:02,259
escribe para que todo se haga realidad.

84
00:03:02,360 --> 00:03:04,180
O sea que no es como decirles, escribe

85
00:03:04,180 --> 00:03:05,300
esta función.

86
00:03:05,300 --> 00:03:07,300
Es más bien como darle el objetivo final

87
00:03:07,300 --> 00:03:08,419
a un jefe de proyecto, ¿no?

88
00:03:08,539 --> 00:03:09,560
Has dado en el clavo.

89
00:03:09,639 --> 00:03:11,759
Necesito esta web para este producto y que

90
00:03:11,759 --> 00:03:13,879
él se encargue de organizar a su equipo.

91
00:03:13,620 --> 00:03:14,620
Es que es eso.

92
00:03:14,620 --> 00:03:16,639
Ese jefe de proyecto es el agente de

93
00:03:16,639 --> 00:03:17,300
IA.

94
00:03:17,419 --> 00:03:19,639
Esta separación es lo que permite manejar una

95
00:03:19,639 --> 00:03:22,340
complejidad enorme sin que el usuario tenga que

96
00:03:22,340 --> 00:03:24,280
entrar en cada detalle técnico.

97
00:03:24,280 --> 00:03:26,400
El valor está en la visión, no en

98
00:03:26,400 --> 00:03:26,979
la sintaxis.

99
00:03:27,300 --> 00:03:28,539
Exacto.

100
00:03:28,500 --> 00:03:29,180
Vale.

101
00:03:29,180 --> 00:03:30,699
Entorno preparado.

102
00:03:30,699 --> 00:03:32,500
Primera gran pieza del ego.

103
00:03:32,500 --> 00:03:34,000
La estética.

104
00:03:34,000 --> 00:03:35,479
El aspecto visual.

105
00:03:35,479 --> 00:03:37,024
Y aquí, E.

106
00:03:37,564 --> 00:03:39,344
Aquí es donde el proceso se pone muy

107
00:03:39,344 --> 00:03:40,404
interesante.

108
00:03:40,264 --> 00:03:41,164
Mucho.

109
00:03:40,964 --> 00:03:42,404
El punto de partida no es una idea

110
00:03:42,404 --> 00:03:42,984
abstracta.

111
00:03:43,584 --> 00:03:45,684
Es el trabajo real de una diseñadora, Nina

112
00:03:45,684 --> 00:03:46,544
Malikina.

113
00:03:46,424 --> 00:03:48,644
Que el autor del tutorial encontró en Behance,

114
00:03:48,644 --> 00:03:48,764
sí.

115
00:03:48,824 --> 00:03:51,664
Le flipó su estilo y dijo, quiero esto.

116
00:03:51,584 --> 00:03:53,104
Y el método para enseñarle eso a la

117
00:03:53,104 --> 00:03:55,424
máquina es de una astucia tremenda.

118
00:03:55,564 --> 00:03:57,684
No se limita a subir unas cuantas fotos.

119
00:03:57,384 --> 00:03:59,244
No, no, va mucho más allá.

120
00:03:59,164 --> 00:04:01,704
A ver, sí, guarda imágenes de referencia, pero

121
00:04:01,704 --> 00:04:03,064
el paso genial es otro.

122
00:04:03,044 --> 00:04:03,324
¿Cuál?

123
00:04:03,564 --> 00:04:05,904
Hace una captura de pantalla de un texto,

124
00:04:05,904 --> 00:04:08,724
donde la propia diseñadora describe sus reglas.

125
00:04:08,884 --> 00:04:11,644
Su paleta de colores, cómo usa las texturas…

126
00:04:11,344 --> 00:04:13,724
Un momento, eso es crucial.

127
00:04:13,724 --> 00:04:14,844
O sea, no le está pidiendo a la

128
00:04:14,844 --> 00:04:16,504
IA que deduzca el estilo a partir de

129
00:04:16,504 --> 00:04:16,904
imágenes.

130
00:04:17,364 --> 00:04:18,404
¿Qué puede ser?

131
00:04:18,404 --> 00:04:19,424
Impreciso.

132
00:04:19,084 --> 00:04:19,544
Claro.

133
00:04:19,484 --> 00:04:22,544
Le está entregando el manual de instrucciones original.

134
00:04:22,544 --> 00:04:24,124
Es un atajo brillante.

135
00:04:23,884 --> 00:04:24,904
Totalmente.

136
00:04:25,204 --> 00:04:26,744
Es la diferencia entre darle a un chef

137
00:04:26,744 --> 00:04:29,024
un plato para que adivine la receta o

138
00:04:29,024 --> 00:04:30,904
darle la receta secreta directamente.

139
00:04:31,464 --> 00:04:31,964
Tal cual.

140
00:04:31,944 --> 00:04:34,164
Y ese texto, extraído de la imagen con

141
00:04:34,164 --> 00:04:36,444
chat GPT o algo similar, lo guarda en

142
00:04:36,444 --> 00:04:37,464
un archivo.

143
00:04:37,644 --> 00:04:40,004
Así la IA no solo ve el estilo,

144
00:04:40,004 --> 00:04:41,184
sino que lee las reglas.

145
00:04:41,724 --> 00:04:42,844
Y esto nos lleva a una de las

146
00:04:42,844 --> 00:04:44,924
funciones más potentes que describe la fuente.

147
00:04:45,644 --> 00:04:46,244
Las skills.

148
00:04:47,024 --> 00:04:48,304
Las habilidades.

149
00:04:47,944 --> 00:04:49,964
Que son como… ¿Plantillas de procesos?

150
00:04:50,204 --> 00:04:50,804
Piénsalo así.

151
00:04:51,524 --> 00:04:53,724
conjuntos de instrucciones y conocimientos que el sistema

152
00:04:53,724 --> 00:04:56,804
puede reutilizar, como si le enseñaras así se

153
00:04:56,804 --> 00:04:59,484
sigan unas directrices de marca y guardaras ese

154
00:04:59,484 --> 00:05:01,544
conocimiento para usarlo cuando quieras.

155
00:05:01,704 --> 00:05:02,824
Exactamente.

156
00:05:03,044 --> 00:05:05,524
El poder de estas skills es que garantizan

157
00:05:05,524 --> 00:05:07,864
resultados consistentes.

158
00:05:07,464 --> 00:05:08,864
Predecibles.

159
00:05:08,484 --> 00:05:10,544
En lugar de que la IA intente adivinar

160
00:05:10,544 --> 00:05:11,584
cada vez.

161
00:05:11,284 --> 00:05:13,984
Le das un manual de operaciones claro.

162
00:05:13,124 --> 00:05:16,604
Y esto, claro, ahorra tiempo, ciclos de prueba

163
00:05:16,604 --> 00:05:19,544
y error y sobre todo costes computacionales, que

164
00:05:19,544 --> 00:05:20,784
no es ninguna tontería.

165
00:05:20,804 --> 00:05:23,024
La instrucción final de esta fase lo une

166
00:05:23,024 --> 00:05:25,104
todo de una forma muy elegante.

167
00:05:25,084 --> 00:05:25,484
A ver.

168
00:05:25,564 --> 00:05:27,124
Le pide a la gente que analice las

169
00:05:27,124 --> 00:05:29,284
imágenes y el texto de la diseñadora y

170
00:05:29,284 --> 00:05:31,824
que con todo eso genere unas nuevas directrices

171
00:05:31,824 --> 00:05:33,744
de marca para este proyecto.

172
00:05:33,404 --> 00:05:34,724
Y la IA no se pone a escribir

173
00:05:34,724 --> 00:05:35,904
código a lo loco, ¿no?

174
00:05:37,024 --> 00:05:39,044
Responde con un plan de implementación.

175
00:05:39,744 --> 00:05:41,684
Básicamente un resumen de lo que ha entendido

176
00:05:41,684 --> 00:05:42,904
y lo que va a hacer, para que

177
00:05:42,904 --> 00:05:44,584
el usuario le dé el visto bueno.

178
00:05:44,484 --> 00:05:45,704
Es un diálogo.

179
00:05:45,844 --> 00:05:48,364
Una negociación antes de empezar a construir.

180
00:05:48,224 --> 00:05:48,924
Vale.

181
00:05:49,044 --> 00:05:50,784
Aspecto visual definido.

182
00:05:50,824 --> 00:05:52,424
Pero una cara bonita no sirve sin un

183
00:05:52,424 --> 00:05:53,484
esqueleto sólido.

184
00:05:53,544 --> 00:05:54,164
La siguiente pieza.

185
00:05:54,724 --> 00:05:56,244
¿Era la estructura?

186
00:05:56,404 --> 00:05:59,324
Y para eso se apoya en otro experto,

187
00:05:59,324 --> 00:06:01,224
siguiendo el mismo patrón que con el diseño,

188
00:06:01,244 --> 00:06:03,284
lo que es muy revelador del método.

189
00:06:03,304 --> 00:06:04,364
Así es.

190
00:06:04,624 --> 00:06:07,064
El recurso es una publicación de LinkedIn de

191
00:06:07,064 --> 00:06:10,144
un tal James Dickerson, que detalla lo que

192
00:06:10,144 --> 00:06:12,804
él llama la arquitectura de una landing page

193
00:06:12,804 --> 00:06:14,464
de alto rendimiento.

194
00:06:14,744 --> 00:06:17,704
Una fórmula probada sobre qué secciones incluir, en

195
00:06:17,704 --> 00:06:18,584
qué orden.

196
00:06:18,584 --> 00:06:19,504
Para vender.

197
00:06:19,244 --> 00:06:21,624
Es que el rol del desarrollador aquí es

198
00:06:21,624 --> 00:06:24,644
más bien de comisario de conocimiento, ¿no?

199
00:06:24,644 --> 00:06:27,384
Su habilidad no es inventar la estructura, sino

200
00:06:27,384 --> 00:06:30,124
identificar al experto y traducir su conocimiento en

201
00:06:30,124 --> 00:06:31,204
una instrucción.

202
00:06:31,644 --> 00:06:33,904
Y el proceso es un calco del anterior.

203
00:06:33,904 --> 00:06:36,824
Captura de pantalla del post, extracción del texto

204
00:06:36,824 --> 00:06:38,724
y esta vez se lo pasa a un

205
00:06:38,724 --> 00:06:41,944
agente especializado, el skill creator.

206
00:06:41,704 --> 00:06:43,284
Para que lo convierta en una habilidad.

207
00:06:43,284 --> 00:06:44,464
Exacto.

208
00:06:44,464 --> 00:06:46,864
La orden es, convierte esta fórmula en una

209
00:06:46,864 --> 00:06:48,924
nueva skill reutilizable.

210
00:06:48,924 --> 00:06:51,004
Y en minutos, el sistema tiene una habilidad

211
00:06:51,004 --> 00:06:54,144
nueva, creador de landing pages de alta conversión.

212
00:06:54,484 --> 00:06:56,924
Es que esto redefine por completo la naturaleza

213
00:06:56,924 --> 00:06:58,124
del desarrollo.

214
00:06:58,124 --> 00:06:59,484
El trabajo se desplaza.

215
00:06:59,884 --> 00:07:02,324
De la microgestión del código… A la macrogestión

216
00:07:02,324 --> 00:07:03,504
de la estrategia.

217
00:07:03,504 --> 00:07:06,284
La pregunta ya no es, ¿sé programar esto?

218
00:07:06,284 --> 00:07:08,544
Sino, ¿he encontrado el mejor marco de referencia

219
00:07:08,544 --> 00:07:10,064
para resolver este problema?

220
00:07:09,744 --> 00:07:12,788
Y para completar el puzle faltaba el contenido,

221
00:07:12,788 --> 00:07:15,288
el lead magnet, en este caso un documento

222
00:07:15,288 --> 00:07:16,508
de texto con una investigación.

223
00:07:17,228 --> 00:07:18,488
También lo sube a la herramienta.

224
00:07:18,628 --> 00:07:20,288
Con lo cual la IA ya tiene las

225
00:07:20,288 --> 00:07:22,668
reglas de diseño, las de estructura y la

226
00:07:22,668 --> 00:07:24,648
materia prima, el contenido.

227
00:07:24,568 --> 00:07:26,768
Tiene todas las piezas sobre la mesa.

228
00:07:26,988 --> 00:07:28,768
Y la orden final es una sinfonía que

229
00:07:28,768 --> 00:07:30,048
lo conecta todo.

230
00:07:29,868 --> 00:07:30,688
A ver esa orden.

231
00:07:30,668 --> 00:07:33,028
Le dice textualmente.

232
00:07:33,068 --> 00:07:36,368
Primero, lee y entiende a fondo el documento

233
00:07:36,368 --> 00:07:39,328
para escribir el texto de la web Segundo,

234
00:07:39,328 --> 00:07:41,928
usa la skill de landing pages de alto

235
00:07:41,928 --> 00:07:45,408
rendimiento La que acaban de crear Tercero, aplica

236
00:07:45,408 --> 00:07:48,168
estrictamente las directrices de marca de Nina Malikina

237
00:07:48,768 --> 00:07:51,928
Y como guinda, crea una web elegante, moderna

238
00:07:51,928 --> 00:07:54,588
y con efectos visuales como el parallax al

239
00:07:54,588 --> 00:07:58,708
hacer scroll Una directiva completísima No deja lugar

240
00:07:58,708 --> 00:08:00,488
a la ambigüedad, pero le da toda la

241
00:08:00,488 --> 00:08:03,468
autonomía para la ejecución Y entonces llega el

242
00:08:03,468 --> 00:08:05,008
momento de la verdad.

243
00:08:05,008 --> 00:08:07,028
La IA procesa todo y genera la primera

244
00:08:07,028 --> 00:08:07,928
versión.

245
00:08:08,008 --> 00:08:11,088
Y aquí el creador del tutorial es muy

246
00:08:11,088 --> 00:08:12,168
honesto.

247
00:08:12,168 --> 00:08:14,608
El resultado no es perfecto.

248
00:08:14,868 --> 00:08:17,528
La página funciona, el contenido está, la estructura

249
00:08:17,528 --> 00:08:21,128
es correcta, pero le falta vida, le falta

250
00:08:21,128 --> 00:08:21,948
alma.

251
00:08:21,828 --> 00:08:24,388
Carece de las texturas, los patrones.

252
00:08:24,568 --> 00:08:24,928
Exacto.

253
00:08:24,928 --> 00:08:28,528
Esos detallitos que hacían especial el diseño original.

254
00:08:28,328 --> 00:08:31,528
Este es un punto crucial y desmitificador.

255
00:08:31,528 --> 00:08:34,128
Estas herramientas no son varitas mágicas.

256
00:08:34,048 --> 00:08:34,508
No.

257
00:08:34,508 --> 00:08:37,088
El humano aquí asume un rol que la

258
00:08:37,088 --> 00:08:39,108
fuente define perfectamente.

259
00:08:39,108 --> 00:08:40,468
Director de arte.

260
00:08:40,468 --> 00:08:43,228
La habilidad clave es analizar el resultado, ver

261
00:08:43,228 --> 00:08:45,708
qué falla y dar un feedback preciso.

262
00:08:45,528 --> 00:08:48,188
La IA es una ejecutora rapidísima, pero el

263
00:08:48,188 --> 00:08:51,988
criterio… El buen gusto, la visión… ¿eso sigue

264
00:08:51,988 --> 00:08:53,748
siendo, por ahora, humano?

265
00:08:54,028 --> 00:08:56,528
Me recuerda a cuando intenté usar un generador

266
00:08:56,528 --> 00:08:58,828
de imágenes para un logo.

267
00:08:58,828 --> 00:09:02,608
Me daba cosas técnicamente perfectas, pero… ¿Planas?

268
00:09:02,888 --> 00:09:03,588
Sin alma.

269
00:09:03,608 --> 00:09:04,028
Sin alma.

270
00:09:04,748 --> 00:09:08,228
Tuve que darle 20 instrucciones del tipo, no,

271
00:09:08,228 --> 00:09:10,668
más imperfecto, como si estuviera dibujado a mano,

272
00:09:10,668 --> 00:09:12,868
para acercarme a lo que buscaba.

273
00:09:12,788 --> 00:09:14,708
Es exactamente eso.

274
00:09:14,708 --> 00:09:16,288
El valor está en la calidad de la

275
00:09:16,288 --> 00:09:17,788
dirección que das.

276
00:09:17,468 --> 00:09:18,868
Y el feedback que le dan en el

277
00:09:18,868 --> 00:09:20,668
tutorial es súper específico.

278
00:09:20,668 --> 00:09:22,808
No es un, hazlo más bonito.

279
00:09:22,448 --> 00:09:23,208
Claro.

280
00:09:22,968 --> 00:09:24,328
Es.

281
00:09:24,328 --> 00:09:27,208
Añade más textura usando patrones como en la

282
00:09:27,208 --> 00:09:28,528
imagen A.

283
00:09:28,528 --> 00:09:31,028
Implementa más elementos de parallax con los puntos

284
00:09:31,028 --> 00:09:33,528
del diseño original y dale una estética más

285
00:09:33,528 --> 00:09:34,308
divertida.

286
00:09:34,328 --> 00:09:37,068
Y el autor añade una nota importante, ¿verdad?

287
00:09:37,108 --> 00:09:37,368
Sí.

288
00:09:37,368 --> 00:09:40,508
Que el resultado mejora muchísimo si le proporcionas

289
00:09:40,508 --> 00:09:43,788
tus propios recursos gráficos, como un PNG de

290
00:09:43,788 --> 00:09:45,988
una pegatina que hayas diseñado tú.

291
00:09:45,688 --> 00:09:48,208
Y aquí la fuente introduce otra observación muy

292
00:09:48,208 --> 00:09:49,248
interesante.

293
00:09:48,968 --> 00:09:50,568
Sobre los modelos de IA.

294
00:09:50,368 --> 00:09:51,328
Exacto.

295
00:09:51,328 --> 00:09:53,808
Sugiere que para este tipo de tareas creativas,

296
00:09:53,808 --> 00:09:56,868
de código y diseño, el modelo Cloud parece

297
00:09:56,868 --> 00:09:58,408
funcional mejor que Gemini.

298
00:09:58,548 --> 00:10:00,528
O sea, que no solo hay que saber

299
00:10:00,528 --> 00:10:03,968
dar buenas instrucciones… …sino también conocer las sutilezas

300
00:10:03,968 --> 00:10:04,908
de cada herramienta.

301
00:10:04,908 --> 00:10:07,328
No todos los martillos sirven para todos los

302
00:10:07,328 --> 00:10:08,148
clavos.

303
00:10:07,888 --> 00:10:08,808
Perfecto.

304
00:10:08,808 --> 00:10:10,268
Tras un par de vueltas, la web ya

305
00:10:10,268 --> 00:10:11,468
tiene el aspecto deseado.

306
00:10:11,468 --> 00:10:14,728
Pero, ¿cómo sale de ahí al mundo real?

307
00:10:14,728 --> 00:10:16,988
¿Cómo pasa de ser un proyecto local a

308
00:10:16,988 --> 00:10:18,188
una URL pública?

309
00:10:18,388 --> 00:10:20,768
Entramos en el terreno del backend y el

310
00:10:20,768 --> 00:10:24,328
despliegue, tareas que tradicionalmente han sido un cuello

311
00:10:24,328 --> 00:10:26,088
de botella técnico para mucha gente.

312
00:10:26,128 --> 00:10:29,448
Para ello, la fuente usa tres plataformas externas.

313
00:10:29,448 --> 00:10:31,908
Primero, GitHub, para el código.

314
00:10:31,548 --> 00:10:32,208
El estándar.

315
00:10:32,508 --> 00:10:36,068
Segundo, Supabase, que funcionará como base de datos

316
00:10:36,068 --> 00:10:38,448
para recoger los emails y los nombres.

317
00:10:38,228 --> 00:10:41,168
Y tercero, Vercel, para alojar la web.

318
00:10:40,968 --> 00:10:43,628
Y la pregunta es, ¿cómo habla la IA

319
00:10:43,628 --> 00:10:45,708
de Antigravity con estos servicios?

320
00:10:45,668 --> 00:10:48,292
La respuesta está en algo que llaman MCPs,

321
00:10:48,492 --> 00:10:50,212
Protocolo de Contexto del Modelo.

322
00:10:50,132 --> 00:10:52,552
Que, en cristiano, es el sistema que le

323
00:10:52,552 --> 00:10:54,952
permite a la IA conectarse y dar órdenes

324
00:10:54,952 --> 00:10:57,332
a servicios como GitHub o Supabase de forma

325
00:10:57,332 --> 00:10:57,932
segura.

326
00:10:57,952 --> 00:10:59,892
Le das las llaves, básicamente.

327
00:10:59,812 --> 00:11:00,692
Tal cual.

328
00:11:00,952 --> 00:11:03,992
Instalas el MCP de GitHub, el de Supabase,

329
00:11:03,952 --> 00:11:06,252
los autorizas una vez y la IA ya

330
00:11:06,252 --> 00:11:08,192
tiene permiso para operar en tu nombre o

331
00:11:08,192 --> 00:11:09,892
para conectar el formulario a la base de

332
00:11:09,892 --> 00:11:10,732
datos.

333
00:11:10,572 --> 00:11:13,512
Todo ese trabajo complejo se abstrae por completo.

334
00:11:13,552 --> 00:11:15,432
Se reduce a una conversación.

335
00:11:15,632 --> 00:11:18,012
El usuario le pide en lenguaje natural.

336
00:11:18,132 --> 00:11:19,812
Crea una base de datos en mi cuenta

337
00:11:19,812 --> 00:11:22,252
de Supabase para guardar los contactos.

338
00:11:22,272 --> 00:11:22,892
Llámala a Leads.

339
00:11:23,232 --> 00:11:25,932
Necesito campos para nombre y mail.

340
00:11:25,632 --> 00:11:28,612
Luego, implementa un formulario emergente en la web.

341
00:11:28,712 --> 00:11:30,852
Y por último, conéctalo todo para que los

342
00:11:30,852 --> 00:11:32,912
datos se guarden automáticamente.

343
00:11:32,612 --> 00:11:35,032
Es que la barrera de entrada para crear

344
00:11:35,032 --> 00:11:38,032
aplicaciones web completas se desploma de una manera

345
00:11:38,032 --> 00:11:39,372
espectacular.

346
00:11:38,892 --> 00:11:40,952
Y el proceso final que muestra la fuente

347
00:11:40,952 --> 00:11:42,572
es casi vertiginoso.

348
00:11:42,572 --> 00:11:44,432
La IA confirma que ha creado la tabla

349
00:11:44,432 --> 00:11:45,052
en Supabase.

350
00:11:45,352 --> 00:11:46,892
Con las columnas correctas.

351
00:11:46,932 --> 00:11:49,352
Se prueba el formualio, se introduce un nombre,

352
00:11:49,352 --> 00:11:52,092
un correo, se pulsa el botón e inmediatamente

353
00:11:52,092 --> 00:11:54,912
esos datos aparecen en la tabla de Supabase.

354
00:11:54,912 --> 00:11:55,872
Funciona.

355
00:11:55,812 --> 00:11:57,352
El sistema está vivo.

356
00:11:57,412 --> 00:11:58,512
Exacto.

357
00:11:58,512 --> 00:11:59,672
Siguiente paso.

358
00:11:59,672 --> 00:12:02,312
Sube todo el proyecto al repositorio de GitHub.

359
00:12:02,312 --> 00:12:04,532
La IA lo empaqueta y lo envía.

360
00:12:04,532 --> 00:12:05,952
Y el último paso es en Vercell.

361
00:12:06,472 --> 00:12:09,652
Importar el proyecto desde GitHub y desplegar.

362
00:12:09,552 --> 00:12:10,712
Un par de clics.

363
00:12:10,812 --> 00:12:12,952
Y el resultado final es una URL pública

364
00:12:12,952 --> 00:12:15,232
con la web funcional, conectada a la base

365
00:12:15,232 --> 00:12:17,872
de datos y accesible desde cualquier parte del

366
00:12:17,872 --> 00:12:18,612
mundo.

367
00:12:18,512 --> 00:12:20,312
Un viaje completo.

368
00:12:20,492 --> 00:12:22,352
Desde una idea inspirada en el trabajo de

369
00:12:22,352 --> 00:12:26,032
una diseñadora hasta un producto digital desplegado.

370
00:12:25,892 --> 00:12:27,712
Entonces, si damos un paso atrás, ¿qué nos

371
00:12:27,712 --> 00:12:29,052
llevamos de todo esto?

372
00:12:29,092 --> 00:12:30,652
El recorrido es increíble.

373
00:12:30,692 --> 00:12:31,712
Desde luego.

374
00:12:31,472 --> 00:12:33,392
Se parte de unas imágenes de Behance y

375
00:12:33,392 --> 00:12:34,812
un texto de Linkering.

376
00:12:34,752 --> 00:12:36,352
y se llega a una página web completa

377
00:12:36,352 --> 00:12:39,932
con diseño, contenido, base de datos, todo publicado.

378
00:12:39,972 --> 00:12:40,392
¿Tor?

379
00:12:40,392 --> 00:12:41,492
¿Un programador?

380
00:12:41,592 --> 00:12:43,872
El humano ha sido todo eso y nada

381
00:12:43,872 --> 00:12:44,692
de eso a la vez.

382
00:12:44,712 --> 00:12:45,292
Exacto.

383
00:12:45,292 --> 00:12:48,272
El valor de su trabajo se ha desplazado

384
00:12:48,272 --> 00:12:51,512
de la ejecución manual a la estrategia, a

385
00:12:51,512 --> 00:12:53,912
la curación de fuentes, a la dirección de

386
00:12:53,912 --> 00:12:54,612
arte.

387
00:12:54,712 --> 00:12:57,272
Se trata menos de hacer y más de

388
00:12:57,272 --> 00:12:58,292
dirigir.

389
00:12:58,112 --> 00:13:00,192
Y para terminar, una idea que se exprende

390
00:13:00,192 --> 00:13:01,312
de todo esto.

391
00:13:01,592 --> 00:13:03,732
El proceso que hemos visto es brillante para

392
00:13:03,732 --> 00:13:06,392
ejecutar una visión humana ya definida.

393
00:13:06,392 --> 00:13:07,832
Pero la pregunta que queda en el aire

394
00:13:07,832 --> 00:13:11,192
es, ¿qué pasará cuando estas herramientas no solo

395
00:13:11,192 --> 00:13:14,152
ejecuten, sino que empiecen a proponer?

396
00:13:14,512 --> 00:13:17,292
Cuando la IA, después de analizar el contenido,

397
00:13:17,292 --> 00:13:20,292
sugiera una estrategia de marketing diferente o un

398
00:13:20,292 --> 00:13:22,752
concepto de diseño original que no se base

399
00:13:22,752 --> 00:13:23,672
en nada.

400
00:13:23,592 --> 00:13:26,492
¿Seguiremos siendo directores de arte o nos convertiremos

401
00:13:26,492 --> 00:13:29,692
inevitablemente en sus colaboradores creativos?

402
00:13:29,692 --> 00:13:30,812
Ahí lo dejamos.

403
00:13:30,632 --> 00:13:32,832
Buena pregunta para reflexionar.

404
00:13:43,632 --> 00:13:45,852
Y hasta aquí el episodio de hoy.

405
00:13:45,852 --> 00:13:47,432
Muchas gracias por tu atención.

406
00:13:57,292 --> 00:14:00,972
Esto es BIMPRAXIS Nos escuchamos en el próximo

407
00:14:00,972 --> 00:14:01,572
episodio