🔝To translate this blog post to your language, select it in the top left
Google box.
Mis grados de parentesco
He creado este artículo a partir de una duda que me surgió sobre si se puede
tener permiso laboral por hospitalización de un sobrino.
Es el cuarto artículo creado gracias a la Programación Asistida por
la IA, pues yo solo no hubiera sabido programar el
código HTML, CSS y JavaScript con el que he diseñado este
árbol animado con Grados de parentesco familiar, que se puede ver a
la derecha de estas líneas.
Encima y debajo del árbol, hay un botón que cambia su texto:
Mostrar grados de parentesco
Ocultar grados de parentesco
Todo lo que le solicité a la IA, y toda su asistencia para conseguir
programar esta página Web, está resumido en el siguiente enlace:
Como le hice muchas preguntas a la IA,
si necesitas una respuesta concreta, pídemela en un comentario.
También puedes pedirme el código HTML, CSS y JavaScript.
CONCLUSIÓN:He llegado a la conclusión de que, si eres funcionario, tienes
permiso por hospitalización de un sobrino, pero si en tu convenio
colectivo no se menciona al sobrino, no tendrás ese derecho. ¡Por
mucho que sea de segundo grado de parentesco familiar!
Mi parentesco familiar
🟦 COMPORTAMIENTO DEL BOTÓN
✔ Al pulsar Ocultar grados de parentesco:
Se ocultan filas y grados
Solo las filas vuelven a aparecer gradualmente
✔ Al pulsar Mostrar grados de parentesco:
Las filas NO se ocultan
Solo los grados aparecen gradualmente
ATENCIÓN:Pasa el ratón por encima de cualquier familiar y lo verás resaltado.
Mis grados animados de parentesco
¿Alguna vez has visto un árbol familiar tan animado como
éste?
¡Yo no!
Grado de parentesco familiar
3er GRADO
Bisabuelos paternos
Bisabuelos maternos
Bisabuelos paternos
Bisabuelos maternos
2º GRADO
Abuelos paternos
Abuelos maternos
Abuelos paternos
Abuelos maternos
1er GRADO
Padre
Madre
Suegro
Suegra
YO
Pareja / Esposo(a)
Yerno
Hija
Hijo
Nuera
2º GRADO
Nieto/a
Nieto/a
Nieto/a
Nieto/a
3er GRADO
Bisnieto/a
Bisnieto/a
Bisnieto/a
Bisnieto/a
2º GRADO
Cuñado
Hermana
Hermano
Cuñada
Sobrino/a
Sobrino/a
Sobrino/a
Sobrino/a
3er GRADO
Sobrino/a nieto
Sobrino/a nieto
Sobrino/a nieto
Sobrino/a nieto
2º GRADO
Tío
Tía
Tío político
Tía política
4º GRADO
Primo/a
Primo/a político/a
¿Has pensado en cuántos antepasados fueron necesarios para que
nacieras?
¿Y qué ocurrirá si no dejas descendencia?
¡Que tu árbol familiar se truncará y no tendrás futuro!
Mis artículos sobre Programación Asistida
Sigue todo lo que escribo sobre
Programación Asistida para mejorar el Mapamundi con relojes desde
aquí:
🔝To translate this blog post to your language, select it in the top left
Google box.
Mi comparativa animada
En este artículo explicaré lo que he aprendido en dos días para conseguir
programar una comparativa animada, gracias a la
Programación Asistida por IA, que te animo a que la uses para mejorar
como programador.
En este artículo puedes probar la Comparativa animada y los botones
de Repetir animación:
Por supuesto que publicaré las PROMPTS (SOLICITUDES en español) con
las que he guiado a la IA de
Microsoft Copilot
para obtener este aspecto de la comparativa animada.
Vídeo de la comparativa animada
En este vídeo verás la comparativa animada.
Cómo programé la comparativa animada
Hace dos semanas le hice varias preguntas a la IA, y la contestación de
Microsoft Copilot está en estos enlaces:
Con estas cinco preguntas, la IA me ofreció una explicación bastante clara
sobre la Programación por Pares y la Programación Asistida, además de
proporcionarme una imagen comparativa que se muestra a la derecha de este
texto.
El problema es que se colaron bastantes errores en el texto de la imagen:
"Dos deansolladores humans", "Entorno comparrido", "Ejecución y y
depuración en cónjusitó", "Sugerencias y correcciónes", "Transferencia de
conveinnento".
Aquí no voy a poner las preguntas que le hice a la IA para que corrigiera
los textos de la imagen, cosa imposible, o para que generara los textos
correctos en archivos tipo .docx o .xlsx o .pptx. Me indicaba los pasos
manuales a seguir, que eran muchos, pero no generaba automáticamente los
archivos Word ni Excel ni PowerPoint, lo que era muy frustrante...
Como son gratuitas, le hice unas cuantas preguntas más a la IA:
La imagen resultante está a la derecha, y no se parece a la imagen generada
previamente por la IA, aunque se puede integrar en el blog porque está
diseñada con HTML + CSS.
Le falta añadir los iconos y que también sean animadas la cabecera y el pie
de la comparativa y la última fila que es estática.
En los siguientes enlaces comienza la Programación Asistida por la IA
para mejorar el
código HTML + CSS + JavaScript de la comparativa animada.
Le hice varias preguntas sobre esta versión animada a la IA, pues yo no he
usado prácticamente CSS y necesitaba aprender a programar si quería
incrustar la comparativa animada en mi blog:
Como no sabía nada de la cantidad de animaciones que se pueden generar en
CSS, estuvo platicando con la IA sobre algunas de ellas, pero es tan extenso
el tema que aquí no voy a enlazar la animada charla que tuve con la IA y las
pruebas que hice con algunos de los tipos de animación que ofrece CSS.
Destaco aquí las animaciones que decidí usar:
Para la cabecera: animation: bounceWave 3s ease-out forwards;
Para las filas: animation: fadeIn 0.8s ease forwards;
Para el pie animation: bounceWave 5s ease-out forwards;
Y con todas esas SOLICITUDES (PROMPTS en inglés) conseguí respuesta a
todas mis preguntas y conseguí resolver algo que no sabía programar hasta
hace unos días:
una comparativa animada con código HTML + CSS + JavaScript, que
puedes probar aquí:
Si necesitas ayuda en algún paso concreto de cómo programé la
comparativa animada, puedes consultarme a mí y te contestaré en modo
Programación Remota por Pares o en Pareja.
¡¡¡ O mejor aún, puedes preguntar directamente a la IA en modo
Programación Asistida !!!
Mis métodos de programación
Le he pedido a la IA una tabla con los métodos de programación usados en la
comparativa animada:
En el siguiente enlace está la respuesta de la
IA de Microsoft Copilot en formato tabla HTML + CSS, y un poco
más abajo la tabla creada con algunos ajustes adicionales:
Uso de CSS para definir estilos, animaciones y estados sin
indicar pasos imperativos. (Ej.: @keyframes, animation,
flexbox).
Programación Imperativa
JavaScript ejecutando instrucciones paso a paso para reiniciar
animaciones y manipular elementos.
Manipulación del DOM
Selección y modificación de elementos HTML mediante
querySelectorAll y style.
Programación Basada en Eventos
El botón “Repetir animación” usa un evento onclick para
ejecutar código cuando el usuario interactúa.
Reflow Forzado
Técnica avanzada usando offsetWidth para reiniciar animaciones
CSS sin recargar la página.
Diseño Modular
Separación clara entre HTML, CSS y JavaScript para mantener el
código limpio, escalable y fácil de mantener.
Cómo programé el índice automático desplegable
Al principio de este artículo aparece un
índice automático desplegable, que conseguí programar asistido por la
IA, mediante las siguientes SOLICITUDES:
Con esto consigo crear un índice automático desplegable en cualquier
artículo de mi blog y usarlo tanto en el escritorio de Windows como en el
teléfono con Android.
El índice se puede plegar y desplegar manualmente, y reconoce
automáticamente las etiquetas h4 con class="indice" como partes
integrantes del índice automático.
Al pulsar los botones: Volver al índice se hace scroll hacia arriba
hasta llegar al índice.
¿Quieres que este índice automático desplegable aparezca en los
próximos artículos?
Mis artículos sobre Programación Asistida
Sigue todo lo que escribo sobre
Programación Asistida para mejorar el Mapamundi con relojes desde
aquí:
Passing 3D arrays to Excel with Python and pyxll
-
The previous post looked at options for displaying 1D or 2D arrays in
Excel. This post will look at passing 3D arrays from Python to Excel as a
cache objec...
PA4 - Grados de parentesco familiar
-
🔝*To translate this blog post to your language, select it in the top left
Google box. *
Índice automático desplegable
Mis grados de parentesco...
Coeficientes trinomiales
-
Los coeficientes trinomiales son una extensión de los binomiales, definidos
estos como
Y que son los coeficientes del binomio de Newton:
De forma análog...
Build a Daily Events Calendar in Excel
-
Use my Excel events calendar to track meetings and events inside a
workbook. Add your upcoming events to a list, set a start date, and then
see those items...
Cómo hacer gráficos en Excel
-
Excel es una de las herramientas más potentes y versátiles para el análisis
y la presentación de datos. Los gráficos en Excel no solo ayudan a
visualizar...
Análisis DAFO (FODA, DOFA) las decisiones con Excel
-
Para conocer la situación de una empresa, proyecto o persona, recurrimos al
análisis DAFO (FODA, DOFA) en la toma de decisiones con Excel. El los años
sese...
How To Predict Bearing Life With Excel
-
When you work in mechanical engineering, understanding the reliability and
performance of bearings under various conditions is crucial. Bearings are
the co...
TikTok’s search evolution
-
2 in 5 Americans use TikTok as a search engine. Nearly 1 in 10 Gen Zers are
more likely to rely on TikTok than Google as a search engine. More than
half of...
Unblocking and Enabling Macros
-
When Windows detects that a file has come from a computer other than the
one you're using, it marks the file as coming from the web, and blocks the
file....
La importancia de saber mecanografía en 2022
-
[image: Resultado de imagen de mecanografía viñeta escribiendo a máquina]
Según la RAE, la mecanografía es el arte de escribir a máquina. Hace unos
cuantos...
London Excel Meetup Workbooks
-
The workbooks used in my presentation on “Analytical and Interactive
Dashboards in Excel” at the London Excel Meetup, September 3, 2020
International Keyboard Shortcut Day 2019
-
The first Wednesday of every November is International Keyboard Shortcut
Day. This Wednesday, people from all over the world will become far less
efficient...
Welcome, Prashanth!
-
Last March, I shared that we were starting to look for a new CEO for Stack
Overflow. We were looking for that rare combination of someone who… Read
more "W...
Salvador Sostres, analfabeto profesional
-
Los nuevos tiempos traen nuevas profesiones. Internet, además, ha
revolucionado el mundo del periodismo y la palabra escrita. Adaptarse o
morir, ese es el ...
Planificación de compras
-
Realizar una lista con los productos que necesitamos y que formarán parte
de nuestra cesta de la compra nos ayuda a *encontrar la combinación de
bienes p...
Mis metas son seguir superando nuevos retos en Excel y compartirlos en mi blog, para sacarle todo el poder a esta excelente herramienta multiusos, tan usada y a la vez tan incomprendida, para así poder mejorar nuestros conocimientos de Excel.
