Introducción a los widgets

Windows Widgets son contenedores de interfaz de usuario pequeños que muestran texto y gráficos, asociados a una aplicación instalada en el dispositivo. Los widgets instalados se muestran en una cuadrícula del Panel de widgets: un plano flotante que superpone el Windows escritorio cuando el usuario hace clic en el icono Widgets de la barra de tareas, usa el acceso directo Windows+W o desliza el dedo desde el borde izquierdo de la pantalla. Los widgets ayudan a los usuarios a mantenerse al tanto de lo que es importante para ellos al agregar contenido personalizado y acciones rápidas de las aplicaciones que usan. Son rápidamente consumibles y fáciles de poner en práctica. Los widgets no están diseñados para reemplazar a las aplicaciones y sitios web, sino que proporcionan acceso sin problemas a la información más necesaria que los usuarios pueden leer o a las funcionalidades usadas con más frecuencia que pueden desencadenar inmediatamente. Al diseñar el widget, tenga en cuenta el tipo de valor que llevará a los consumidores. 

Terminología de widgets

Término	Definición
Host de widgets	Una aplicación que muestra y administra Windows widgets. El panel de widgets integrado en Windows 11 es un host de widgets.
Panel de widgets	El Panel de widgets es un componente del sistema de Windows 11 que se muestra sobre el escritorio cuando el usuario hace clic en el icono Widgets de la barra de tareas, usa el acceso directo Windows+W o desliza el dedo desde el borde izquierdo de la pantalla. El Panel de widgets muestra widgets y administra su diseño en el panel.
Widget	Un pequeño contenedor de interfaz de usuario que presenta contenido o acciones de una aplicación. Puede definir su contenido con una tarjeta adaptable o mostrar HTML desde una dirección URL con un proveedor de widgets web. Los widgets proporcionan información y acciones de un vistazo, con vínculos a la aplicación para tareas más detalladas.
Proveedor de widgets	Un proveedor de widgets es una aplicación Windows que proporciona contenido que se va a mostrar en el widget. El proveedor de widgets posee el contenido, el diseño y los elementos interactivos del widget.

Important

Los widgets web solo están disponibles para los usuarios del Espacio Económico Europeo (EEE). Compruebe los requisitos del widget web antes de seleccionar el contenido HTML.

Guía de diseño de widgets

Para un widget de Adaptive Card, defina los elementos visuales e interactivos en una plantilla JSON de Tarjetas adaptables. Use el Diseñador de Tarjetas adaptables para editar la tarjeta y, a continuación, valide las propiedades del host, los tamaños, los temas y las acciones específicos de Windows en Panel de widgets. El motor de renderizado y las opciones de host del diseñador no son un sustituto de las pruebas en Windows. Para un widget web, diseñe el contenido HTML para los requisitos de tamaño, tema e interacción del widget; el diseñador de Tarjetas adaptables no edita ese CÓDIGO HTML.

Ambos enfoques de representación deben seguir los principios de diseño del widget a continuación. Para la configuración del contenido web, las solicitudes de recursos y la mensajería, consulte Proveedores del widget web.

Para ver un tutorial de nivel superior de los elementos visuales de un widget, consulte Estados del widget y componentes integrados de la interfaz de usuario.

Principios del widget

Para crear widgets de Windows excelentes, tenga en cuenta los siguientes principios a medida que diseña y desarrolla los widgets:

Se debe comprender con un vistazo

Un widget debe entregar inmediatamente su valor principal al usuario.

Centrado y útil

Un widget debe servir un propósito claro y principal.

Predecible y tranquilo

Los comportamientos y patrones de un widget ayudan a los usuarios a completar tareas de forma predecible.

Anclado al usuario

Un widget debe reflejar las necesidades, las preferencias y las intenciones del usuario. El contenido debe basarse en los propios datos del usuario o en los intereses declarados explícitamente.

Oportuna

Un widget debe exponer información relevante en el momento adecuado y en el contexto correcto.

Planeación de la experiencia del widget de la aplicación

1. En función de su comprensión de los clientes, identifique el contenido más importante o las acciones más útiles a las que los usuarios les gustaría tener acceso rápido sin abrir la aplicación o el sitio web. Tenga en cuenta los principios enumerados en la sección Principios del widget y piense en cómo se pueden aplicar a la aplicación.
2. La aplicación puede admitir varios widgets individuales. Determine el número de widgets independientes que quiere admitir para que cada widget se centre en un propósito específico.
3. Determine el contenido que quiere incluir para cada widget. Un único widget puede admitir tres tamaños diferentes; pequeño, mediano y grande. Para cada widget, piense en el contenido que aportaría más valor a los usuarios y sus necesidades empresariales. Para cada tamaño de pequeño a grande, el propósito del widget debe permanecer igual, pero la cantidad de información mostrada debe expandirse en los tamaños mayores. Se recomienda que los proveedores de widgets implementen todos los tamaños de widget para ofrecer flexibilidad a los usuarios al personalizar el diseño del widget.
4. Piense en las interacciones del usuario que admitirá el widget. Los usuarios pueden hacer clic en el título del widget o en cualquier destino de clic que haya definido en el widget. Estas interacciones pueden activar accesos directos de vínculos profundos en la aplicación o sitio web que llevan a los usuarios directamente a lo que les interesa, de modo que no tengan que navegar desde la raíz de la aplicación. Tenga en cuenta los diferentes modelos de navegación ofrecidos.
5. Elija la implementación del proveedor y el formato de contenido. Una aplicación de escritorio Win32 empaquetada puede proporcionar contenido de tarjeta adaptable o usar las API web-widget para mostrar HTML. Una aplicación web progresiva (PWA) usa definiciones de widgets en su manifiesto de aplicación web y controla eventos en un service worker. Consulte Proveedores de widgets, Proveedores de widgets web o Creación de widgets controlados por PWA para obtener la ruta de acceso de implementación correspondiente.

En esta sección

Estados de widget e interfaz de usuario

Aspectos básicos del diseño de widgets

Diseño de la interacción de los widgets

Crear una plantilla de widget con Tarjetas adaptables Designer

Integración con el selector de widgets

Consulte también

• Desarrollo de widgets de Windows