OpenWebinars

Desarrollo Web

Power Apps: Crea interfaces de usuario low-code para herramientas de IA

¿Sabías que el uso de plataformas low-code como Power Apps puede reducir el tiempo de desarrollo de aplicaciones en un 70%? Esta herramienta permite a los usuarios de todos los niveles crear interfaces de usuario potentes para herramientas de IA, democratizando el desarrollo y fomentando la creatividad. Sigue leyendo y descubre cómo aprovechar Power Apps.

Luis López Cuerva

Luis López Cuerva

Lectura 6 minutos

Publicado el 26 de junio de 2024

Compartir

Introducción

¿En cuánto tiempo eres capaz de crear una interfaz de usuario? ¿Cuánto tiempo le cuesta a las grandes empresas crear aplicaciones disponibles para miles de personas? ¿Puedes utilizar la misma tecnología que ellos?

En OpenWebinars te respondemos estas y muchas más preguntas a la vez que te enseñamos a usar dicha tecnología.

Hoy nos centraremos en Power Apps, la tecnología low-code de Microsoft para la creación de aplicaciones, servicios y conectores.

Dos grandes empresas que han utilizado esta tecnología son Adif y Volkswagen AG.

Adif, la empresa pública española responsable del diseño, construcción, mantenimiento y gestión de la red ferroviaria española y su tráfico, usó Power Apps para crear en menos de una semana un entorno digital de trabajo en el contexto del COVID-19.

Volkswagen AG utilizó Power Apps para crear una base de conocimiento que le permite a sus más de 600000 trabajadores a lo largo de 97 países resolver de manera rápida sus dudas acerca de la empresa.

Nosotros, al igual que estas dos grandes empresas, podemos aprovechar toda la potencia ofrecida por Microsoft en el entorno Power Platform, especialmente con la herramienta Power Apps. Con ella podremos crear nuestros proyectos de manera rápida, eficiente y barata.

¡Pongámonos manos a Power Apps!

Qué es Power Apps

La tecnología low-code está formada por un conjunto de herramientas que permiten diseñar y crear aplicaciones personalizadas de manera rápida, sencilla y sin la necesidad de disponer de grandes conocimientos técnicos.

Estas características, junto con el soporte ofrecido por Microsoft Copilot permiten acelerar en gran medida los procesos de creación de aplicaciones y servicios, de manera que podemos crear aplicaciones de gran alcance en pocos días.

Dentro de las plataformas low-code existen muchas alternativas como pueden ser Appian, Salesforce, Blueprism o Power Apps. Entre todas ellas Power Apps destaca por su facilidad de uso, la gran cantidad de plantillas predefinidas disponibles, la alta capacidad de reutilización de componentes y su fácil integración con otros servicios proporcionados por Microsoft.

Aprende a desarrollar webs optimizadas
Comienza 15 días gratis en OpenWebinars y accede cursos, talleres y laboratorios prácticos de JavaScript, React, Angular, HTML, CSS y más.
Registrarme ahora

Capacidades avanzadas de Power Apps para interfaces de IA

Power Apps es una herramienta que permite potenciar nuestros desarrollos de Inteligencia Artificial gracias a que las aplicaciones creadas con esta tecnología ofrecen una lógica completa de negocio y de flujos de trabajo.

Permitiendo dotar de manera rápida a nuestros servicios de IA de una interfaz que permita a los usuarios interactuar de manera ágil con nuestro servicio. Además, el diseño dinámico intrínseco a Power Apps permite que las aplicaciones desarrolladas se presenten de forma dinámica tanto en un explorador web como en dispositivos móviles ya sean teléfonos o tablets.

Características avanzadas que facilitan la integración con la IA

Microsoft Power Apps dispone de funciones y utilidades que facilitan en gran medida la integración con sistemas de IA. Existen tres características predefinidas que ayudan en gran medida a esta integración:

  • Conectores predefinidos: Dentro del ecosistema de Microsoft un conector es una herramienta que nos permite conectar APIs de terceros con aplicaciones de Microsoft. Actualmente existe una gran variedad de conectores predefinidos que nos permiten utilizar orígenes de datos y servicios de terceros. Estas herramientas son especialmente útiles a la hora de desplegar aplicaciones de IA porque nos permiten usar tanto herramientas propias como herramientas provenientes de la comunidad open-source o de las empresas de IA más vanguardistas.
  • Flujos de trabajo automatizados: Un flujo es un proceso automatizado especialmente diseñado para llevar a cabo tareas repetitivas aumentando la eficiencia de estas y reduciendo los posibles errores humanos que pueden cometerse durante el proceso. Las aplicaciones de Inteligencia Artificial generalmente tienen tareas repetitivas como pueden ser la preparación de los datos o el cálculo de métricas. Estas tareas son candidatas estrella a automatizarse mediante flujos de trabajo. A la hora de crear un flujo de trabajo automatizado se deben tener en cuenta los siguientes puntos:
    • Frecuencia de la tarea a automatizar: Es importante tener en cuenta cuándo y con qué frecuencia se debe lanzar el proceso automatizado.
    • Definir si el flujo debe usar conectores con servicios de terceros: Debemos tener en cuenta que es posible que uno de los flujos que diseñemos llame a un servicio de terceros mediante un conector. Es recomendable estudiar previamente a qué servicios nos queremos conectar y en qué orden.
  • Componentes reutilizables: Los componentes de aplicaciones son contenedores de código que facilitan la reutilización de componentes a lo largo de muchas aplicaciones. De esta manera cuando creemos nuestra primera aplicación de Power Apps podemos crear un componente con una característica clave como puede ser la creación de un sistema de filtrado de datos en base a un conjunto personalizado de parámetros y reutilizar este componente personalizado a lo largo de todos nuestros futuros proyectos.

Integración con plataformas de IA populares

En función de la aplicación que estemos desarrollando usaremos una, dos o todas las características de Power Apps comentadas previamente. Cuando nos conectemos a servicios de terceros o servicios de Microsoft usaremos los conectores predefinidos de Power Apps. Algunos ejemplos de estos conectores son los siguientes:

  • Azure Blob Storage: Es el servicio de Microsoft para el almacenamiento seguro y escalable de archivos y datos. Es uno de los servicios de almacenamiento de datos más utilizados en proyectos de Machine Learning.
  • Anthropic: Una de las grandes empresas capaces de crear LLMs (large language models) capaces de competir en calidad y rendimiento con OpenAI.
  • Amazon S3: El servicio de almacenamiento seguro y escalable ofrecido por Amazon.
  • ArcGIS: Conector que permite utilizar datos georeferenciados enriquecidos con información demográfica e información local.
  • OpenAI GPT: Conector que permite el uso de los modelos LLMs creados por OpenAI, considerados actualmente la vanguardia en Inteligencia Artificial Generativa.
  • Hugging Face: Conector que permite el uso de los modelos open source disponibles en Hugging Face, la mayor librería online de modelos open source que destaca por su gran número de datasets abiertos al público.
  • Otros conectores: Además de los conectores orientados a la inteligencia artificial existen un gran número de conectores que pueden ser de utilidad en función de la aplicación desarrollada. Por ejemplo existen conectores para las siguientes tecnologías y herramientas: Twitter, Excel, Sharepoint, SQL Server, Dynamics 365, etc.

Además de los conectores predefinidos disponemos de diversas herramientas de Microsoft para implementar procesos de Inteligencia Artificial. Las dos herramientas de Microsoft más populares e interesantes son Microsoft Copilot Studio y AI Builder.

Microsoft Copilot Studio es una herramienta gráfica low-code para crear y mantener agentes conversacionales impulsados mediante IA, concretamente grandes modelos de lenguaje (LLMs). Estos agentes conversacionales pueden interactuar con los usuarios de la aplicación para tareas muy diversas como pueden ser la ayuda a resolución de problemas, la respuesta a preguntas comunes o la divulgación de información.

AI Builder es la herramienta de Microsoft Power Platform creada para facilitar el uso de modelos de IA que optimicen procesos. Una de las características más potentes de AI Builder es que permite utilizar modelos de Inteligencia Artificial sin programar, democratizando así el uso de la IA y reduciendo los tiempos de desarrollo.

Entre los muchos modelos que se encuentran disponibles en AI Builder destacan los modelos relacionados con el procesamiento de imágenes como son los modelos de OCR (Optical Character Recognition) o el modelo de detección de objetos, los modelos relacionados con el procesamiento de documentos como son los modelos de procesamiento de facturas y documentos de identidad y los modelos de procesamiento del lenguaje natural que nos permiten llevar a cabo tareas como el análisis de sentimientos o la extracción de entidades.

Diseño y desarrollo de interfaces con Power Apps

A la hora de diseñar y desarrollar interfaces con Power Apps es importante conocer que existen dos tipos de aplicaciones de Power Apps y las características de cada una. Los dos tipos de aplicaciones son las aplicaciones basadas en modelos y las aplicaciones de lienzo.

Las aplicaciones basadas en modelos son aplicaciones basadas en un origen de datos. Es decir, son aplicaciones centradas en la agregación de componentes como formularios, vistas y gráficos y paneles en tablas. Este tipo de aplicaciones son especialmente adecuadas para crear aplicaciones basadas en datos y facilitan a los usuarios el movimiento entre registros relacionados.

Por el contrario, las aplicaciones lienzo son aplicaciones completamente personalizadas que permiten abordar cualquier caso de uso. Este tipo de aplicaciones permite crear interfaces altamente personalizadas y son adecuadas para todas las tareas.

Es importante recordar que el diseño de los dos tipos de aplicaciones se basa en arrastrar y colocar diversos elementos en un lienzo como si diseñáramos una diapositiva de PowerPoint y dotar a los diversos elementos de lógica mediante expresiones tipo Excel.

Mejores prácticas para garantizar interfaces efectivas y atractivas

A la hora de diseñar y desarrollar interfaces gráficas efectivas mediante Power Apps es altamente recomendable seguir las siguientes prácticas:

  • Solicitar los recursos necesarios para cada componente en su método de iniciación.
  • Evitar hacer llamadas innecesarias a los métodos internos de cada componente.
  • Comprobar la disponibilidad de las APIs que vamos a utilizar antes de hacer peticiones a estas.
  • Minimizar la cantidad de componentes presentes en cada pantalla. Cada componente requiere un tiempo de renderizado, de manera que en el caso de utilizar muchos componentes en una sola pantalla el rendimiento puede verse afectado.
  • Proporcionar alternativas de navegación con teclado a los eventos táctiles / del ratón para aumentar la accesibilidad.
  • Ofrecer textos alternativos en todas las imágenes empleadas con el fin de aumentar la accesibilidad.

Construcción de prototipos y pruebas de usuario

A la hora de crear interfaces para nuestras aplicaciones de Inteligencia Artificial es importante crear prototipos y llevar a cabo pruebas de usuario.

Los prototipos son las versiones preliminares de nuestras interfaces que utilizamos para evaluar si nuestra aplicación se ejecuta de forma correcta. Además, los prototipos nos permiten llevar a cabo pruebas de usuario para comprobar si la aplicación cumple con todos los requisitos planificados previamente y si los usuarios pueden interactuar de manera sencilla e intuitiva con nuestra aplicación.

A la hora de construir prototipos y desarrollar pruebas de usuario es importante seguir las siguientes dos fases:

  • Fase de diseño: Es la fase en la que se especifica qué se va a crear y qué tareas se podrán llevar a cabo en la aplicación. Dentro de esta fase distinguimos entre dos tipos de diseños que deben llevarse a cabo:
    • Diseño conceptual: En este diseño definiremos las tareas que se podrán llevar a cabo en nuestra aplicación, el aspecto de esta y la interacción del usuario.
    • Diseño arquitectónico: En este diseño definiremos que tipo de aplicación de Power Apps vamos a utilizar y qué integraciones con sistemas de terceros es necesario utilizar.
  • Fase de pruebas : En esta fase se llevan a cabo diversos tipos de pruebas para evaluar cómo se interactúa con la aplicación y si esta funciona correctamente.
    • Pruebas unitarias: Pruebas utilizadas para comprobar si una característica de nuestra aplicación funciona correctamente.
    • Pruebas de aceptación de usuario: Pruebas realizadas con usuarios reales para ver si estos pueden utilizar de manera intuitiva nuestra aplicación.

Implementación de IA en Power Apps

A la hora de implementar nuestras soluciones de IA en Power Apps disponemos de múltiples herramientas muy potentes que nos permiten tanto usar APIs externas con conectores, ya sean predefinidos o personalizados, como los servicios de Microsoft mediante flujos de trabajo o incluso automatizar procesos mediante los flujos de automatización de Microsoft.

Integración de servicios como Azure Cognitive Services

Azure Cognitive Services es un conjunto de APIs basadas en la nube que se pueden utilizar en aplicaciones de Inteligencia Artificial y flujos de datos. Este servicio proporciona modelos preentrenados listos para usar en nuestras aplicaciones sin necesidad de disponer de datos ni de reentrenar el modelo.

Ya que la conexión con Azure Cognitive Services se realiza mediante APIs HTTP para integrar sus servicios debemos utilizar conectores, concretamente conectores personalizados. Debemos utilizar conectores personalizados en lugar de conectores predefinidos ya que cuando creamos un servicio de Azure Cognitive Services creamos un endpoint propio.

Para poder integrar un servicio de Azure Cognitive Services necesitamos una clave API para el servicio que deseemos utilizar. Una vez disponemos de dicha clave seguiremos los siguientes pasos:

  • Inicialización del conector personalizado: Dentro del editor de Power Apps seleccionaremos Datos > Conectores personalizados en el panel de navegación izquierdo. A continuación seleccionaremos Nuevo conector personalizado > Crear desde cero, le daremos un nombre a nuestro conector y seleccionaremos Conectar.
  • Configuración del conector: En la pestaña General actualizaremos el campo Host con el valor de nuestra clave API y en la pestña Seguridad seleccionaremos Clave de API como Tipo de autenticación. A continuación seleccionaremos Crear conector.
  • Definición del conector: Después definiremos la lógica del conector. En la página Definición seleccionaremos Nueva acción. A continuación, en el área Solicitud seleccionaremos Importar desde ejemplo y especificaremos el cuerpo de nuestra solicitud HTTP. El cuerpo de la solicitud varía en función de la API utilizada y se puede encontrar en la documentación de cada API. Por ejemplo, si estuviéramos utilizando la API de Text Analytics podríamos encontrar los datos aquí. Una vez terminado este paso en el área Respuesta agregaremos una Respuesta predeterminada, la cual podemos encontrar en la documentación de la API que estemos utilizando. Finalmente seleccionaremos Importar y en el área de Validación seleccionaremos Actualizar conector.

Con estos pasos habremos creado un conector que podremos utilizar desde Power Apps para utilizar Azure Cognitive Services.

Automatización de tareas en las apps creadas

Para la automatización de tareas dentro de las aplicaciones de Power Apps empleamos los flujos de trabajo automatizados. Estos flujos aprovechan todo el potencial de Power Automate y se pueden crear directamente desde Power Apps Studio.

Para crear un flujo nuevo de automatización seguiremos los siguientes pasos:

  • Seleccionaremos Power Automate dentro del menú de autoría que se encuentra en la página de Power Apps y a continuación pulsaremos en Crear nuevo flujo.
  • Para facilitar el proceso de automatización de tareas Power Automate proporciona un conjunto de plantillas que se pueden personalizar. Para esta explicación usaremos la plantilla Haga clic en un botón en Power Apps para enviar un correo electrónico.. Una vez que se selecciona una plantilla se nos mostrará información general sobre el flujo. A continuación pulsaremos Seleccionar > Crear y habremos creado el flujo con éxito.
  • Finalmente debemos agregar el flujo creado a un componente de nuestra aplicación. En nuestra aplicación añadiremos un botón y añadiremos a la propiedad OnSelect el siguiente código:
    PowerAppsbutton.Run()
    
    De esta manera tendremos un botón que ejecutará la tarea.

Ejemplo práctico

A continuación crearemos una aplicación sencilla que integre un servicio de Inteligencia Artificial. Concretamente crearemos una aplicación que analizará el texto introduciendo, indicándonos si este es positivo o negativo. Para ello en primer lugar crearemos un conector personalizado del servicio de Texto Analytics de Cognitive Services tal y como hemos hecho antes. Una vez tengamos dicho conector crearemos la aplicación siguiendo los siguientes pasos:

ClearCollect(sentimentCollection, nombreDelCOnector.DetectSentiment(
 {id:"1", language:"en", text:TextInput1.Text}).documents.score)
"The sentiment score is " & Round(First(sentimentCollection).score, 3) * 100 & "%"

La fórmula definida para el botón llama al método “DetectSentiment” y recupera la puntuación del análisis de sentimiento calculada por el servicio de Texto Analytics de Cognitive Services. Mientras tanto la fórmula definida en el campo Texto de la etiqueta recoge la última puntuación de análisis de sentimiento obtenida y la muestra.

  • En el editor de Power Apps elegiremos Iniciar desde cero > Aplicación para teléfono > Crear esta aplicación. y en lienzo de la aplicación seleccionaremos el nombre del conector creado previamente.
  • A continuación crearemos la interfaz de usuario.
    • Agregaremos un icono de rectángulo como barra de título y añadiremos una etiqueta con el texto “Análisis de sentimiento”.
    • Agregaremos un control de entrada de texto en el que los usuarios podrán escribir.
    • Añadiremos un botón con el texto “Analizar texto”.
    • Agregaremos una etiqueta con el texto “La puntuación del análisis de sentimiento es”.
  • El siguiente paso será definir el comportamiento de cada componente.
    • En el botón creado configuraremos la propiedad OnSelect con la siguiente fórmula:
    • Definiremos la propiedad Texto de la etiqueta que hemos creado para mostrar la puntuación del análisis de sentimiento con la siguiente fórmula:
  • Finalmente probaremos la aplicación pulsando el icono Play que aparece en la esquina superior derecha de la aplicación.
Construye interfaces de usuarios personalizadas y atractivas
Lleva la formación de tu equipo al siguiente nivel con cursos, talleres y laboratorios prácticos de JavaScript, React, Angular, HTML, CSS y más.
Solicitar más información

Conclusiones

Las tecnologías low-code han irrumpido en el mundo empresarial gracias a su capacidad de agilizar y acelerar procesos de desarrollo de software, pero su uso no se limita únicamente a este ámbito. Poco a poco estamos viendo cómo este tipo de herramientas es más común y su uso se empieza a ver tanto en entornos empresariales como en proyectos personales. Es un conjunto de tecnologías que han venido para cambiar la manera que tenemos de desarrollar.

Y dentro de esta revolución Microsoft ha puesto a nuestro alcance una de las plataformas low-code más potentes de todo el mercado. La capacidad de crear rápidamente una interfaz gráfica con Power Apps, automatizar sus procesos con Power Automate y de dotarle de capacidades IA utilizando servicios de terceros hace que esta tecnología tenga un brillante futuro tanto a corto como a largo plazo.

¡Definitivamente tenemos Power Apps para rato!

Bombilla

Lo que deberías recordar de Power Apps

  • Power Apps es la plataforma low-code de Microsoft.
  • En Power Apps se pueden integrar fácilmente servicios de IA.
  • Podemos combinar Power Apps con todo el potencial del entorno de Microsoft para conseguir desarrollar aplicaciones complejas de manera simple.
  • Siempre que creemos una interfaz para servicios de IA debemos recordar realizar pruebas de usuario sobre nuestros prototipos.
  • Power Apps pone a nuestro alcance conectores y flujos de automatización predefinidos extremadamente potentes que podemos usar para agilizar nuestros desarrollos.
Compartir este post

También te puede interesar

Curso

Power Apps: Developer

Intermedio
2 h. y 25 min.

Esta formación veremos técnicas complejas, como la personalización del diseño, manejo de variables y colecciones, integración con múltiples...

Tony Trujillo Dávila
4.5
Curso

Power Apps: Fundamentos

Principiante
2 h. y 33 min.

Aprenderás a usar Power Apps, un entorno de desarrollo y capa de datos creado por Microsoft para crear...

Tony Trujillo Dávila
4.5