Saltar navegación

IA_3

Ajuste de pantalla

El ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:

Subido el 13 de enero de 2025 por Francisco Javier M.

1 visualizaciones

Descargar la transcripción

Vamos a ver ahora cómo podríamos componer una aplicación de temporizador Pomodoro. 00:00:00
Es una aplicación para poder ser más productivos en nuestro trabajo utilizando la técnica Pomodoro, 00:00:04
que básicamente alterna entre 25 minutos de trabajo y 5 minutos de descanso. 00:00:09
Para ello vamos a usar diferentes herramientas, nuestra inteligencia artificial en su versión gratuita para crear todo el código 00:00:11
y, como siempre, un editor de texto, que en este caso usamos Visual Studio Code en su versión web para no tener que instalar nada. 00:00:16
El prompt que vamos a usar para crear esta herramienta tipo Pomodoro es este. 00:00:21
Le diremos a AIA, crea una aplicación web de temporizador Pomodoro. 00:00:25
La aplicación debe tener un temporizador que alterne entre 25 minutos de trabajo y 5 de descanso 00:00:27
Permitir iniciar, pausar y reiniciar el temporizador 00:00:30
Fijaos que le vamos explicando las características que queremos que tenga de forma precisa 00:00:32
Le pedimos también que muestre una notificación visual 00:00:35
Y incluso que reproduzca un sonido cuando el tiempo se agote 00:00:37
Que lleve una cuenta de cuántos pomodoros o ciclos hemos completado 00:00:39
Y que tenga un diseño atractivo y responsivo con Telo y CSS 00:00:42
Aquí podríamos ponerle, por ejemplo, que tenga un diseño atractivo, colorido 00:00:44
Y que use emojis de gran tamaño 00:00:47
Por ejemplo, si nos gustan, pues los podemos usar 00:00:50
Tenemos que, y a partir de aquí, que incluya una breve explicación de la técnica pomodoro 00:00:52
y lo que siempre ponemos en este caso para que nos haga todo el código en un solo archivo, 00:00:54
que cargue las librerías que necesite, en este caso Telwin porque permite poner muchas cosas en poca extensión de código 00:00:58
y en este caso lo cargue desde un CD, es decir, desde una URL que esté pública online 00:01:02
para que no tengamos que preocuparnos de compilar al menos en estas primeras versiones que estamos creando 00:01:06
y finalmente que nos dé instrucciones y que genere todo el código completo 00:01:09
y se asegure que lo podamos ejecutar haciendo un siguiente doble clic con un navegador. 00:01:11
Vamos a ver que crea y ya está empezando a trabajar en lo que nosotros estamos componiendo. 00:01:14
Ya ha acabado de generar el código, ahora nos está explicando las instrucciones que debemos seguir, 00:01:19
como siempre, copiaremos, nos iremos 00:01:22
a nuestro editor, crearemos un nuevo archivo de texto, pegaremos 00:01:24
y se va a poner colorido y ya está, al cabo de un par de segundos 00:01:26
vamos a guardarlo, archivo, guardar como 00:01:28
y vamos a crear una carpeta 00:01:30
que se llame Pomodoro App 00:01:32
y aquí dentro pondremos Pomodoro 00:01:34
versión 1, fijaos que siempre pongo los nombres 00:01:35
en acentos, es manías de alguien 00:01:38
que ya lleva algunos años haciendo esto, los sistemas de archivos de hace años 00:01:40
tenían problemas con nombres de archivos que ponían 00:01:42
carácteres especiales, hoy en día podemos ponerle acentos y escribir todo perfecto 00:01:43
vamos a ver que tal lo ha hecho, perfecto 00:01:46
voy a abrir y aquí lo tenemos 00:01:48
Pomodoro Timer, nos dice la técnica Pomodoro, altera 25 minutos de trabajo 00:01:49
con 5 minutos de descanso, completa 4 pomodoros 00:01:52
y toma un descanso más largo, vamos a ver que tal 00:01:54
lo inicio y automáticamente empieza a contar 00:01:56
entiendo que lo puedo reiniciar y que de momento no hemos completado 00:01:57
ningún ciclo, para ver como sería 00:02:00
podemos intentar editar el código para poder ver como funcionaría 00:02:02
pero al final si no, diréis, bueno, no quiero esperar 25 minutos para ver que hace 00:02:04
pues fijaros que mirando el código 00:02:06
buscando aquí arriba pone 25 minutos en segundos 00:02:08
y 5 minutos en segundos, pues algo me dice que 00:02:10
si quitamos este por 60 00:02:12
automáticamente pues será mucho menos tiempo 00:02:14
de hecho si ponemos 10, asumimos que 00:02:16
los 25 minutos pasarán a ser solamente 00:02:18
10 segundos. Vamos a ver si es así. 10 segundos, efectivamente, 00:02:20
con lo cual vamos a ver qué pasará si 00:02:22
llegamos al final. 00:02:24
Aquí habríamos completado los 25 minutos y 00:02:26
empezaría los 5 minutos de periodo 00:02:28
de descanso. Voy a editar también esto y pondremos que 00:02:30
el pomodoro dure 10 segundos, 00:02:32
tenemos 7 segundos en el ciclo largo y 3 00:02:34
en lo que serían los 5 minutos de descanso. 00:02:36
Vamos a verlo. Lo he recargado, lo voy a iniciar. 00:02:38
Estamos trabajando 25 minutos 00:02:41
muy intensos y automáticamente 00:02:42
vienen esos 3 y 00:02:43
ahora ya ha vuelto a 00:02:46
empezar el siguiente ciclo pomodoro. Fijaros que no está haciendo 00:02:48
un ruido, un sonido, si miramos el código 00:02:50
esto lo voy a dejar como estaba, significa que funciona 00:02:52
porque hemos visto, hemos validado que después de el ciclo 00:02:54
de las dos cosas sumadas, pues pasa algo 00:02:56
es que se cuenta el ciclo como hecho, vamos a ver 00:02:58
el tema del sonido, normalmente 00:03:00
si hubiera algo relacionado con sonido 00:03:01
aquí está, debería tener algo de play 00:03:04
fijaros que pone alarmSound.play y 00:03:06
seguramente si buscamos 00:03:08
¿dónde está? fijaros que dice 00:03:10
aquí que esta variable de alarmSound 00:03:12
está intentando buscar algo en el código y aquí está, fijaros 00:03:14
al final lo encontramos, hemos visto que hay un audio 00:03:16
que ha puesto, que está en internet, podríamos abrirlo 00:03:18
para ver si funciona, que era un audio, pero 00:03:20
no se tenía el acceso. Esto se solucionaría buscando 00:03:22
un audio alternativo, un sonido de 00:03:24
alarma que encontremos por internet o que tengamos colocado en algún sitio 00:03:26
para incluirlo, cambiar la dirección y ver si funciona. 00:03:28
Obviamente, una última alternativa sería pedírselo 00:03:30
a la IA. Le podríamos decir, genera una variante del 00:03:32
código o cambia el código para que 00:03:34
los 25 minutos duren solo 10 segundos y los 00:03:36
5 minutos duren 3 segundos para ver que funciona. Y como ya 00:03:38
sabemos que el audio no funciona porque lo hemos validado, le diríamos, cambia el audio 00:03:40
por esta dirección que ha encontrado un audio 00:03:42
que funciona y que funciona mejor. Y nos generaría la nueva versión del código. 00:03:44
Y con esto, podremos crear aplicaciones 00:03:46
de productividad sencillitas, pero que funcionan, no tenemos que pagar 00:03:48
no hay anuncios y la podemos compartir con quien queramos 00:03:50
y con esto me voy a activar un pomodoro para hacer la siguiente 00:03:52
clase sobre algo que honestamente creo que es 00:03:54
muy interesante y más útil de lo que nos pensamos a veces 00:03:56
Etiquetas:
TIC
Autor/es:
Curso Copilot
Subido por:
Francisco Javier M.
Licencia:
Reconocimiento
Visualizaciones:
1
Fecha:
13 de enero de 2025 - 20:13
Visibilidad:
Clave
Centro:
C.TER.INN.Y FORM CTIF MADRID-SUR
Duración:
04′
Relación de aspecto:
16:9 Es el estándar usado por la televisión de alta definición y en varias pantallas, es ancho y normalmente se le suele llamar panorámico o widescreen, aunque todas las relaciones (a excepción de la 1:1) son widescreen. El ángulo de la diagonal es de 29,36°.
Resolución:
1360x768 píxeles
Tamaño:
15.49 MBytes

Del mismo autor…

Ver más del mismo autor


EducaMadrid, Plataforma Educativa de la Comunidad de Madrid

Plataforma Educativa EducaMadrid