1
00:00:04,719 --> 00:00:16,960
Vamos a empezar otro ejemplo en nuestro camino para ser compositores de software o crear software con inteligencia artificial y en este caso vamos a programar un juego, un juego que igual a algunos os sonará.

2
00:00:17,399 --> 00:00:28,079
Vamos a intentar imitar un juego clásico que se llamaba ¿Dónde está Carmen Sandiego? que básicamente consistía en a partir de una serie de pistas identificar ciudades o países mientras perseguías a un ladrón.

3
00:00:28,079 --> 00:00:31,320
es un juego bastante antiguo pero que a mí al menos cuando era niño me encantaba para ello

4
00:00:31,320 --> 00:00:35,640
usaremos una inteligencia artificial como charles gpt o copilot en este caso siempre usamos las

5
00:00:35,640 --> 00:00:41,460
versiones gratuitas y el prompt que vamos a usar ahora va a ser este que la aplicación web para un

6
00:00:41,460 --> 00:00:46,079
juego detectives al estilo de carmen sandiego la aplicación debe presentar un escenario ideal de

7
00:00:46,079 --> 00:00:50,820
un robo en una ciudad famosa aquí voy a explicar un poco lo que quiero que haga pues ofrecer tres

8
00:00:50,820 --> 00:00:55,439
pistas del siguiente destino relacionadas con geografía cultura e historia los que jugasteis

9
00:00:55,439 --> 00:01:00,659
recordaréis que decía he visto una bandera con estos tres colores donde podría estar lo voy a

10
00:01:00,659 --> 00:01:06,420
pedir que permite el jugador elija entre tres posibles destinos basados en las pistas pensado

11
00:01:06,420 --> 00:01:12,239
para un público quizás más infantil donde no puedan todavía saber la respuesta exacta si no

12
00:01:12,239 --> 00:01:16,439
lo podríamos quitar y pedir que el jugador tenga que escribir la respuesta tener al menos cinco

13
00:01:16,439 --> 00:01:21,640
ciudades diferentes para visitar durante la persecución un sistema de puntos y ofrecer

14
00:01:21,640 --> 00:01:26,799
datos pues interesantes sobre cada ciudad tener un final el jugador intenta identificar al ladrón

15
00:01:26,799 --> 00:01:31,180
entre varios sospechosos y tener un diseño atractivo y responsivo y después pondremos

16
00:01:31,180 --> 00:01:35,260
las cosas que siempre ponemos que todo el código esté en un solo archivo que usemos

17
00:01:35,260 --> 00:01:40,719
telwin desde un cdn etcétera etcétera y sin más vamos a ver qué tal lo hace aquí tienes

18
00:01:40,719 --> 00:01:46,579
el archivo html y vamos a ver qué tal mira qué divertido lo ha llamado juego de detectives donde

19
00:01:46,579 --> 00:01:51,920
está el ladrón claro que sí respetando el copyright gpt bien bien perfecto hemos que

20
00:01:51,920 --> 00:01:55,980
acabado de generar el código nos explica las instrucciones que tenemos que seguir que son

21
00:01:55,980 --> 00:01:59,840
las mismas y hemos ido siguiendo y las funcionalidades que tiene voy a copiar el

22
00:01:59,840 --> 00:02:06,079
código voy a crear un nuevo archivo de texto lo pego y pum pasará de blanco a color al detectar

23
00:02:06,079 --> 00:02:15,199
que es html muy bien lo voy a guardar como voy a crear una nueva carpeta juego de detectives y

24
00:02:15,199 --> 00:02:24,960
dentro lo llamaré juego detectives versión 1 perfecto y vamos a verlo aquí lo tenemos dónde

25
00:02:24,960 --> 00:02:30,000
está el ladrón un famoso ladrón roba una joya oh dios mío sigue las pistas para atraparlo se ha

26
00:02:30,000 --> 00:02:35,800
cometido un robo en parís el ladrón ha huido sigue las pistas la ciudad alberga todo pero

27
00:02:35,800 --> 00:02:41,039
si me está diciendo dónde ha sido dónde está el ladrón pues entiendo que estará en parís si no

28
00:02:41,039 --> 00:02:54,340
Muy bien, nos ha llegado un punto. Igual le tenemos que decir, se ha cometido un robo en Tokio, ¿os dais cuenta que me está poniendo la ciudad? Puede ser, puede ser que se haya equivocado la IA, con lo cual, ¿qué tal si se lo comentamos? Funciona a medias.

29
00:02:54,340 --> 00:02:56,159
y le he pedido lo siguiente

30
00:02:56,159 --> 00:02:58,219
en primer lugar, y se lo he puesto en mayúsculas

31
00:02:58,219 --> 00:03:00,159
estamos diciendo qué ciudad es en el enunciado

32
00:03:00,159 --> 00:03:02,439
es absurdo dar la respuesta, arréglalo por favor

33
00:03:02,439 --> 00:03:04,699
al final le estoy destacando

34
00:03:04,699 --> 00:03:06,580
que igual ha hecho algo que no tiene mucho sentido

35
00:03:06,580 --> 00:03:08,400
el juego debería ser más visual

36
00:03:08,400 --> 00:03:10,879
añade emojis en las opciones, pone emojis gigantes

37
00:03:10,879 --> 00:03:12,099
por ejemplo del ladrón o detective

38
00:03:12,099 --> 00:03:14,300
y le he pedido hacer la interfaz más bonita

39
00:03:14,300 --> 00:03:16,659
con colores degradados y fuentes más chulas

40
00:03:16,659 --> 00:03:17,439
vamos a ver qué hace

41
00:03:17,439 --> 00:03:20,639
ya lo está generando y fijaros que ha pasado

42
00:03:20,639 --> 00:03:22,680
algo que tarde o temprano nos tenía que suceder

43
00:03:22,680 --> 00:03:27,840
que es que no ha podido generar todo el código fijaros que es mucho en una sola generación sin

44
00:03:27,840 --> 00:03:33,919
embargo nos tenemos que fijar siempre que al acabar de generarlo cierre con lo típico que

45
00:03:33,919 --> 00:03:39,240
hemos visto antes de explicar que siempre acaba igual cerrando body que es el cuerpo de la página

46
00:03:39,240 --> 00:03:45,800
web y html pues aquí vemos que aquí vemos que lo está generando pero se ha quedado a medias sin

47
00:03:45,800 --> 00:03:50,520
embargo chat gpt nos pone un botón de continuar generando si no le podríamos escribir literalmente

48
00:03:50,520 --> 00:03:55,900
continúa y lo haría pero si pulso el botón tiene una ventaja que es que continúa generando lo

49
00:03:55,900 --> 00:04:01,919
dentro de la ventana de código con lo cual sólo lo voy a copiar una vez si yo le escribiera que

50
00:04:01,919 --> 00:04:06,840
continuará seguramente generaría otro mensaje de copiar primero el primero y después el segundo

51
00:04:06,840 --> 00:04:11,699
pero usando el botón que nos ponen nos lo genera en el mismo lugar ya los que estaba a puntito ya

52
00:04:11,699 --> 00:04:18,480
de acabar pero bueno copiar código antes importante voy a guardar como la llamaré

53
00:04:18,480 --> 00:04:23,079
versión 2 antes de pegarlo para que no me lo sustituya automáticamente y pasamos de un código

54
00:04:23,079 --> 00:04:29,699
de 170 líneas a 184 bien parece que es poco pero vamos a ver si ha mejorado algo y ha mejorado para

55
00:04:29,699 --> 00:04:35,660
verlo antes esto es lo que veíamos al principio y ahora ya ha mejorado juego detectives encuentra

56
00:04:35,660 --> 00:04:39,860
al ladrón alerta se ha cometido un robo en una ciudad famosa sigue las pistas la ciudad alberga

57
00:04:39,860 --> 00:04:45,899
un monumento famoso fue construido pues cuál sería las capitales más visitadas y cocina queso y vino

58
00:04:45,899 --> 00:04:50,459
pues igual es parís y en correcto el ladrón está en parís ha ganado un puntos y fijaros que aquí

59
00:04:50,459 --> 00:04:55,379
le podemos pedir que si sólo es uno lo diga en singular siguiente está la ciudad más poblada

60
00:04:55,379 --> 00:05:00,959
del mundo está en asia aquí estará un evento olímpico perfecto en 2021 los juegos olímpicos

61
00:05:00,959 --> 00:05:06,480
de 2021 que tendrían que haber sido en 2020 fueron en tokio duda es la ciudad más poblada del mundo

62
00:05:06,480 --> 00:05:11,939
igual resulta que se ha equivocado en este dato y es otra lo podríamos comprobar y si está mal pues

63
00:05:11,939 --> 00:05:16,079
pedirlo que lo arregle de hecho lo podemos ir pidiendo o lo podemos arreglar nosotros mismos

64
00:05:16,079 --> 00:05:20,759
y poco a poco vamos viendo el código vemos que es bastante fácil de entender fijaros que es la

65
00:05:20,759 --> 00:05:26,819
ciudad más poblada del mundo y está en asia pues podríamos cambiar esto por es la ciudad o es la

66
00:05:26,819 --> 00:05:31,500
capital del país donde nació el anime podríamos tocarlo aquí sin embargo si editamos el código

67
00:05:31,500 --> 00:05:37,839
directamente es muy importante después en la que estamos usando pues arrastrar el archivo html con

68
00:05:37,839 --> 00:05:41,920
los cambios que hemos puesto si no lo hemos tocado directamente pues le pedimos los cambios aquí pero

69
00:05:41,920 --> 00:05:45,800
si lo hemos tocado pues obviamente la ya no sabe los cambios que hemos hecho si lo tenemos que

70
00:05:45,800 --> 00:05:52,779
arrastrar y soltar vamos a seguir viéndolo entiendo que está en tokio perfecto se ha cometido un robo

71
00:05:52,779 --> 00:05:56,860
en la ciudad famosa es la ciudad conocida por su enorme parque en medio central park bien tengo

72
00:05:56,860 --> 00:06:01,160
dudas qué pasaría si lo pongo mal sé que es nueva york pero qué pasa si pongo a mira el ladrón está

73
00:06:01,160 --> 00:06:06,579
los ángeles nueva york si bien un punto podríamos pedirle que pues que si lo haces mal terrestre

74
00:06:06,579 --> 00:06:12,879
puntos y demás bien la ciudad por sus playas de copacabana e ipanema pues el mundo moderno

75
00:06:12,879 --> 00:06:19,199
maravilla son los carnavales más grandes vamos a probar si el río de janeiro perfecto y la última

76
00:06:19,199 --> 00:06:26,620
se llama santa de áfrica cual podría ser estambul atenas el cairo vamos a ver bien pasado dos puntos

77
00:06:26,620 --> 00:06:31,240
quién crees que es el ladrón pues aquí les podríamos pedir un poco de información no igual

78
00:06:31,240 --> 00:06:36,439
es suficiente o no para saberlo pues yo creo que es carlos pues toma efectivamente tu nación es

79
00:06:36,439 --> 00:06:42,120
seis puntos evidentemente es un juego muy sencillo pero lo podríamos usar como base para ir cambiando

80
00:06:42,120 --> 00:06:47,839
con hemos es lo que va pasando con escenas lo que quisiéramos es un muy buen ejemplo sobre cómo

81
00:06:47,839 --> 00:06:52,339
podemos crear cosas visuales divertidas usando la inteligencia artificial y hasta aquí este

82
00:06:52,339 --> 00:06:58,339
ejemplo vamos a ver otros distintos y yo creo que incluso alguno más complejo que éste sigamos