Crear y mostrar una llamada de resumen de IA

Este tutorial te guía en la creación de una llamada que muestra un resumen de IA de la información seleccionada por el usuario dentro de una aplicación web. Comprueba la siguiente secuencia de acciones presentada en este tutorial:

1. Comienza iniciando el sitio web Windy.com.
2. Una vez que aparece el logotipo de Windy, mostramos una llamada con instrucciones para el usuario.
3. Cuando aparece la barra de búsqueda del sitio web, otra llamada te pide que busques la ubicación deseada para comprobar el tiempo.
4. Después de realizar la solicitud de búsqueda, los resultados meteorológicos mostrados desde el sitio web sirven como contenido para generar un resumen de IA.

   Este resumen sugiere un día con un clima óptimo para caminar.

5. La llamada se muestra durante 30 segundos, después de lo cual se cierra la llamada y se desactivan todos los desencadenadores.

Requisitos previos

Este ejemplo se creó utilizando estos paquetes de actividades y versiones:

• UiPath.Callout.Activities 25.2.0
• UiPath.IntegrationService.Activities 25.2.1
• UiPath.System.Activities 25.2.1
• UiPath.UIAutomationActivities 25.2.1-preview

Pasos

1. Abre tu proyecto de Studio y ve al flujo de trabajo principal .
   1. Añade una actividad Usar aplicación/navegador e introduce https://www.windy.com/ en el campo URL del navegador .
   2. Añade una actividad Ejecutar desencadenadores locales .

      Esto habilita todos los flujos de trabajo de desencadenador y les permite ejecutarse cuando se produce su evento de desencadenamiento.

2. Crea un archivo uiform para la llamada inicial, que te pedirá que sigas más instrucciones en cuanto aparezca el logotipo de Windy.
   1. En tu proyecto de Studio, en el menú desplegable Nuevo , selecciona Formulario para crear un nuevo formulario.

      El archivo de formulario se utiliza aquí como llamada.

   2. Nombra la llamada como Basic callout.
   3. En el panel Componentes , expande la sección Básico y arrastra tres componentes Etiqueta/Encabezado al archivo de llamada. Edita los componentes de la siguiente manera:
      1. Para el primer componente, introduce el siguiente texto en el campo Contenido : "¡Bienvenido a Windy.com!".
      2. Para el segundo componente, introduce el siguiente mensaje en el campo Contenido : "Sigue las instrucciones en pantalla para saber qué día es el mejor para dar un agradable paseo".
      3. Para el tercer componente, ve a la pestaña Clave de campo y cambia el Nombre de la propiedad a aiSummary.

         Deje el campo Contenido de este componente vacío, ya que se rellenará dinámicamente con el resumen generado por IA en tiempo de ejecución.

   4. Guarda el archivo de llamada.
3. Crea un nuevo flujo de trabajo llamado Mostrar llamada básica y añade una actividad Desencadenador de eventos de aplicación .

   Este flujo de trabajo muestra la llamada que te da la bienvenida a Windy.com y la llamada donde mostraremos el resumen de IA.

   1. Selecciona Indicar destino en pantalla e indica el elemento de la IU para que la automatización comience a supervisar.

      Para este ejemplo, indicamos el logotipo de Windy, que queremos supervisar.

   2. En la lista desplegable Tipo de evento , selecciona Aparecido.
   3. Añade una actividad Mostrar llamada .
      Esta actividad te permite seleccionar un archivo uiform , que puedes mostrar en un determinado elemento de la IU, así como pasar datos al archivo uiform , utilizando un diccionario de Argumentos .
      1. En la lista desplegable Seleccionar formulario , selecciona el archivo de llamada que creaste anteriormente.
         Para este ejemplo, seleccionamos Basic callout.
      2. Para el campo Elemento de IU , introduce el elemento de IU indicado para la actividad Desencadenador de eventos de aplicación , que es el logotipo de Windy, al que queremos vincular la llamada.
         Para acceder a ese elemento de destino, utiliza la expresión TriggerEventArgs.TargetElement . TriggerEventArgs es un argumento aquí, que se genera automáticamente al añadir una actividad de desencadenador a tu flujo de trabajo. En este caso, la actividad Desencadenador de eventos de la aplicación genera el argumento.
4. Crea un archivo uiform para la llamada que aparece cuando la barra de búsqueda del sitio web se vuelve visible y te pide que busques la ubicación deseada.
   1. En tu proyecto de Studio, en el menú desplegable Nuevo , selecciona Formulario para crear un nuevo formulario.

      El archivo de formulario se utiliza aquí como llamada.

   2. Nombra la llamada como Please search for your desired location.
   3. En el panel Componentes , expande la sección Básico y un componente Etiqueta/Encabezado en el archivo de llamada.
   4. Guarde el componente y el archivo.
5. Crea un nuevo flujo de trabajo llamado Busque la ubicación deseada y añada una actividad Desencadenador de eventos de aplicación .

   Este flujo de trabajo muestra la llamada que te solicita que busques su ubicación donde quieren encontrar información meteorológica.

   1. Selecciona Indicar destino en pantalla e indica el elemento de la IU para que la automatización comience a supervisar.

      Para este ejemplo, indicamos la barra de búsqueda de Windy, que queremos supervisar.

   2. En la lista desplegable Tipo de evento , selecciona Aparecido.
   3. Añade una actividad Retraso y establece su Duración en tres segundos, de modo que tengas tiempo suficiente para leer primero la llamada de bienvenida y luego comprobar la que aparece junto a la barra de búsqueda.
   4. Añade una actividad Mostrar llamada .
      Esta actividad te permite seleccionar un archivo uiform , que puedes mostrar en un determinado elemento de la IU, así como pasar datos al archivo uiform , utilizando un diccionario de Argumentos .
      1. En la lista desplegable Seleccionar formulario , selecciona el archivo de llamada que creaste anteriormente.
         Para este ejemplo, seleccionamos Basic callout.
      2. Para el campo Elemento de IU , introduce el elemento de IU indicado para la actividad Desencadenador de eventos de aplicación , que es el logotipo de Windy, al que queremos vincular la llamada.
         Para acceder a ese elemento de destino, utiliza la expresión TriggerEventArgs.TargetElement . TriggerEventArgs es un argumento aquí, que se genera automáticamente al añadir una actividad de desencadenador a tu flujo de trabajo. En este caso, la actividad Desencadenador de eventos de la aplicación genera el argumento.
      3. Abre el diccionario Argumentos y, en el campo Valor de la clave generada, introduce el texto que quieres mostrar.

         Para este ejemplo, mostramos el siguiente texto: "Busque la ubicación deseada y selecciónela de la lista".

6. Crea un nuevo flujo de trabajo llamado Obtener y entregar Resumen meteorológico de IA.

   Este flujo de trabajo comienza a generar un resumen de IA del mejor día para dar un paseo al aire libre, en función de los resultados meteorológicos que aparecen para la ubicación que buscaste anteriormente.

   1. Añade una actividad Desencadenador de eventos de aplicación .
      1. Selecciona Indicar destino en pantalla e indica el elemento de la IU para que la automatización comience a supervisar.

         Para este ejemplo, indicamos los resultados del tiempo ventoso que queremos supervisar.

      2. En la lista desplegable Tipo de evento , selecciona Aparecido.
   2. Añade una actividad Cerrar formulario para cerrar la llamada que te solicitaba buscar una ubicación deseada.
   3. En la lista desplegable Seleccionar formulario , selecciona la llamada Busque la ubicación deseada .
   4. Añade una actividad Establecer valores de formulario para actualizar la llamada básica original con información sobre el proceso de generación del resumen de IA.
   5. Añade una actividad Usar aplicación/navegador para adjuntar a la ventana del navegador Windy y extraer la información meteorológica. En el campo URL del navegador , introduce https://www.windy.com.
   6. En el bloque Hacer , realiza las siguientes acciones:
      1. Añade una actividad Extraer datos de tabla .
         1. Selecciona Indicar destino en pantalla y selecciona los resultados meteorológicos.
         2. Crea una variable de salida para el campo Extraer a .
            En este ejemplo, lo llamamos extractedWeatherDetails.
      2. Añade una actividad Tabla de datos de salida .
         1. Introduce la variable creada anteriormente (extractedWeatherDetails), que contiene los datos meteorológicos, en el campo Tabla de datos .
         2. Crea una variable de salida para el campo Texto . En este ejemplo, lo llamamos weatherData.
      3. Añade una actividad Establecer valores de formulario para mostrar información que debería actualizarte sobre el estado del proceso de análisis.
         1. En la lista desplegable Seleccionar formulario , selecciona el formulario Basic callout
         2. En el diccionario Argumentos , introduce el siguiente valor para el argumento aiSummary : "...analyzing weather data...".
      4. Añade una actividad de Generación de contenido para generar el resumen de IA.
         1. Dentro del cuerpo de la actividad, selecciona Añadir nueva conexión para crear una conexión a las actividades de UiPath GenAI, que permite la ejecución de la actividad.
         2. En la lista desplegable Nombre del modelo , elige el modelo de IA deseado.
         3. En el campo Solicitud , introduce la variable de resultado de la actividad Tabla de datos de salida . En este ejemplo, introduce weatherData.
         4. En el campo Solicitud del sistema , introduce las instrucciones que utilizará el modelo de IA para generar un resumen basado en los datos meteorológicos proporcionados. En este ejemplo, hemos utilizado la siguiente solicitud:

            "Se te proporcionará un conjunto de datos en el siguiente formato: día, hora, icono faltante para el clima, temperatura, lluvia, viento, ráfagas de viento, el último puede ignorarse. Indique qué día tendrá el mejor clima para un agradable paseo. En su salida, apéguese a la breve recomendación y una razón, sin ningún detalle de su análisis específico".

         5. Crea una variable de salida para el campo Texto generado superior . En este ejemplo, lo llamamos topGeneratedText.
      5. Añade otra actividad Establecer valores de formulario para mostrar el resumen generado por IA.
         1. En la lista desplegable Seleccionar formulario , selecciona el formulario Basic callout .
         2. En el diccionario Argumentos , introduce la siguiente expresión, que contiene el resultado de la actividad Generación de contenido e información sobre el estado de la llamada: "topGeneratedText + Environment.NewLine + "This callout will close in 30 seconds.".
      6. Añade una actividad de Retraso y establécela en 30 segundos.
      7. Añade una actividad Cerrar formulario y, en la lista desplegable Seleccionar formulario , elige Basic callout.
      8. Añade una actividad Detener desencadenadores locales para detener la ejecución de todos los flujos de trabajo de desencadenadores.

         Esta actividad es especialmente importante si tu proyecto consiste únicamente en flujos de trabajo de desencadenador. Sin incorporar esta actividad, los desencadenadores se ejecutarán de forma persistente en un bucle continuo sin detenerse.

Resultado

La automatización abre el sitio web de Windy y activa el flujo de trabajo Mostrar llamada básica una vez que aparece el logotipo. Cuando se muestra la barra de búsqueda, el flujo de trabajo Busque su ubicación comienza a ejecutarse, solicitándole que busque la ubicación deseada para la que desean encontrar información sobre el clima. Cuando se muestran los resultados meteorológicos, el flujo de trabajo Obtener y entregar resumen meteorológico de IA comienza a ejecutarse, recuperando los resultados meteorológicos y enviándolos como parte de una solicitud a un modelo de IA, que luego se mostrará de nuevo en el mismo formulario. Una vez que se muestra el resumen de IA, el formulario se cierra después de 30 segundos. Esta descripción del proceso de tiempo de ejecución se visualiza en la siguiente imagen animada:

Figura 1. Llamada que muestra un resumen generado por IA

Ejemplo de flujo de trabajo

Para comprobar cómo se implementan los pasos de este tutorial, descarga el siguiente proyecto de ejemplo: Mostrar llamada de resumen de IA para Windy.