

• El panel de AWS Systems Manager CloudWatch dejará de estar disponible después del 30 de abril de 2026. Los clientes pueden seguir utilizando la consola de Amazon CloudWatch para ver, crear y administrar sus paneles de Amazon CloudWatch, tal y como lo hacen actualmente. Para obtener más información, consulte la [documentación del panel de Amazon CloudWatch](https://docs.aws.amazon.com/AmazonCloudWatch/latest/monitoring/CloudWatch_Dashboards.html). 

# Descripción general de la interfaz de experiencia de diseño visual
<a name="visual-designer-interface-overview"></a>

La experiencia de diseño visual de la automatización de Systems Manager consiste en un diseñador visual de flujos de trabajo low-code que le ayuda a crear manuales de procedimientos de automatización.

Conozca la experiencia de diseño visual con una descripción general de los componentes de la interfaz:

![\[Componentes de la experiencia de diseño visual\]](http://docs.aws.amazon.com/es_es/systems-manager/latest/userguide/images/visual_designer_overview.png)

+ El navegador de **Acciones** contiene las pestañas **Acciones**, **AWSAPI** y **Runbooks**.
+ El *lienzo* es donde usted arrastra y suelta las acciones en el gráfico del flujo de trabajo, se cambia el orden de las acciones y se seleccionan las acciones que se van a configurar o ver.
+ El panel **Formulario** es el lugar donde puede ver y editar las propiedades de cualquier acción que haya seleccionado en el lienzo. Seleccione el botón **Contenido** para ver el formato YAML o JSON de su manual de procedimientos, con la acción actualmente seleccionada resaltada. 

Los enlaces de **Información** abren un panel con información contextual cuando necesita ayuda. Estos paneles también incluyen enlaces a temas relacionados en la documentación de automatización de Systems Manager. 

## Navegador de acciones
<a name="visual-designer-actions"></a>

Desde el navegador de **Acciones**, puede seleccionar acciones para arrastrarlas y soltarlas en su gráfico de flujo de trabajo. Puede buscar todas las acciones mediante el campo de búsqueda situado en la parte superior del navegador de **Acciones**. El navegador de **Acciones** contiene las siguientes pestañas:
+ La pestaña **Acciones** proporciona una lista de acciones de automatización que puede arrastrar y soltar en el gráfico de flujo de trabajo del manual de procedimientos en el lienzo.
+ La pestaña **AWS de APIs** proporciona una lista de AWS APIs que puede arrastrar y soltar en el gráfico de flujo de trabajo de su manual de procedimientos en el lienzo.
+ La pestaña **Runbooks** incluye varios manuales de procedimientos reutilizables y listos para usar como bloques de construcción que puede usar para una variedad de casos de uso. Por ejemplo, puede utilizar los manuales de procedimientos para realizar tareas de corrección habituales en las instancias de Amazon EC2 de su flujo de trabajo sin tener que volver a crear las mismas acciones.

![\[Experiencia de diseño visual: navegador de acciones\]](http://docs.aws.amazon.com/es_es/systems-manager/latest/userguide/images/visual_designer_actions_multi_view.png)


## Canvas
<a name="visual-designer-canvas"></a>

Después de elegir una acción para añadirla a su automatización, arrástrela al lienzo y suéltela en el gráfico de flujo de trabajo. También puede arrastrar y soltar acciones para moverlas a diferentes lugares del flujo de trabajo de su manual de procedimientos. Si su flujo de trabajo es complejo, es posible que no pueda verlo en su totalidad en el panel del lienzo. Use los controles de la parte superior del lienzo para acercar o alejar la imagen. Para ver diferentes partes de un flujo de trabajo, puede arrastrar el gráfico del flujo de trabajo al lienzo. 

Arrastre una acción desde el navegador de **Acciones** y suéltela en el gráfico de flujo de trabajo de su manual de procedimientos. Una línea muestra dónde se colocará en su flujo de trabajo. Para cambiar el orden de una acción, puede arrastrarla a un lugar diferente de su flujo de trabajo. La nueva acción se ha añadido a su flujo de trabajo y su código se genera automáticamente.

![\[Experiencia de diseño visual: lienzo\]](http://docs.aws.amazon.com/es_es/systems-manager/latest/userguide/images/visual_designer_canvas.png)


## Formulario
<a name="visual-designer-form"></a>

Después de añadir una acción a su flujo de trabajo del manual de procedimientos, puede configurarla para que se adapte a su caso de uso. Elija la acción que desee configurar y verá sus parámetros y opciones en el panel **Formulario**. También puedes ver el código YAML o JSON pulsando el botón **Contenido**. El código asociado a la acción que ha seleccionado aparece resaltado.

![\[Experiencia de diseño visual: panel formulario\]](http://docs.aws.amazon.com/es_es/systems-manager/latest/userguide/images/visual_designer_form.png)


![\[Experiencia de diseño visual: panel contenido\]](http://docs.aws.amazon.com/es_es/systems-manager/latest/userguide/images/visual_designer_content.png)


## Métodos abreviados de teclado
<a name="visual-designer-keyboard-shortcuts"></a>

La experiencia de diseño visual es compatible con los atajos de teclado que se muestran en la siguiente tabla.


| Método abreviado de teclado | Función | 
| --- | --- | 
| Ctrl\$1Z | Deshacer la última operación. | 
| Ctrl\$1Mayús\$1Z | Rehacer la última operación. | 
| Alt \$1 C | Centrar el flujo de trabajo en el lienzo. | 
| Retroceso | Eliminar todos los estados seleccionados. | 
| Eliminar | Eliminar todos los estados seleccionados. | 
| Ctrl\$1D | Duplicar el estado seleccionado. | 