Consola de modernización de Experience console-reference

Guía de referencia para la interfaz y las funciones de la consola de modernización de Experience

NOTE
Si está interesado en utilizar la consola de modernización de experiencias, puede solicitar acceso para garantizar una experiencia de incorporación sin problemas.

Información general overview

La consola de modernización de la experiencia es un entorno de desarrollo alojado y asistido por IA para Edge Delivery Services, que se expone como interfaz web en aemcoder.adobe.io. Después de conectarse a su proyecto de GitHub, puede empezar a solicitar inmediatamente cambios en lenguaje natural sin tener que realizar más ajustes o configuraciones de entorno local.

TIP
Si está interesado en empezar de inmediato con la consola, consulte el documento Introducción al agente de modernización de experiencias.

Capacidades capabilities

Funciones principales de la consola:

  • Panel de chat interactivo con el agente y sus aptitudes
  • Vista previa de Live AEM para obtener comentarios visuales inmediatos sobre los cambios
  • Explorador de archivos de contenido y visor de markdown
  • Sincronización de contenido con Document Authoring
  • Explorador de códigos y visor de diferencias para revisar los cambios realizados
  • Integración de GitHub con capacidad para crear solicitudes de extracción a partir de cambios

Los desarrolladores conservan el control total sobre lo que se envía. Todos los cambios realizados a través de la consola requieren revisión y aprobación antes de la implementación, lo que garantiza el control, la coherencia de la marca y la seguridad.

Después de iniciar sesión en la consola a las aemcoder.adobe.io,, llegará a la pantalla principal de la consola.

Pantalla principal de la consola

Barra de menús menu-bar

La barra de menús superior proporciona lo siguiente:

  • Un botón Abrir menú a la izquierda para expandir y contraer el detalle del panel lateral izquierdo
  • Un botón Account a la derecha para cambiar al modo oscuro y cerrar sesión en la consola

Barra lateral izquierda sidebar

La barra lateral izquierda permite un acceso rápido a vistas importantes de la consola.

Vista de inicio home-view

La vista Home es el punto de partida para usar la consola.

  • En la parte superior hay una entrada de solicitud para realizar solicitudes de la consola.
  • Debajo del panel de mensajes hay sugerencias para comenzar con el proyecto.

Solicitar entrada prompt-input

La entrada del mensaje proporciona controles para interactuar con la IA.

  • Modos de planificación/ejecución (iconos de bombilla y varita mágica): alternar entre los modos de planificación y ejecución, respectivamente

    • Modo de planificación: la IA analiza las solicitudes y describe un método sin realizar cambios, lo que resulta útil para comprender la estrategia antes de comprometerse.
    • Modo de ejecución: la API lleva a cabo el plan y realiza cambios en el archivo.
  • Adjuntar archivos (icono de clip): cargue y adjunte archivos al mensaje para obtener contexto adicional (por ejemplo, diseños de referencia, capturas de pantalla, especificaciones técnicas)

Vista de contenido content-view

La vista de contenido proporciona herramientas para examinar y obtener una vista previa del contenido. De forma predeterminada, la vista se divide en tres paneles, de izquierda a derecha:

  • Panel Preguntar para interactuar con la consola y el proyecto
  • Explorador de archivos para obtener una descripción general de los archivos de contenido (alternar que muestra este panel con el icono de cheurón)
  • Panel de vista previa para visualizar el contenido seleccionado en el explorador de archivos

Vista de contenido

Panel de chat chat-panel

El panel de chat le permite ver y continuar la conversación con el agente de modernización de experiencias. El panel de chat incluye el historial de mensajes de chat y una entrada de solicitud para realizar solicitudes adicionales de la consola.

  • Acciones de chat

    • Borrar chat: Esto restablece la conversación y borra la ventana de contexto de la IA. Utilice esta opción cuando inicie una nueva tarea que no esté relacionada con la conversación anterior.
    • Descargar chat: Esto descarga el historial de conversaciones como un archivo Markdown.

Previsualizar panel preview-panel

El panel de vista previa ofrece hasta cuatro modos:

  • Vista previa (documento con lupa) para ver el contenido de HTML procesado

    • Vista interactiva para ver el contenido de HTML procesado en una vista de escritorio, tableta o móvil
    • Modo de diseño (icono de pincel) para agregar elementos de la página al mensaje para obtener contexto adicional
  • Vista de documento (icono de documento) para ver la estructura de contenido de creación de documentos subyacente, respectivamente

  • Vista de marcado (creación de AEM) (icono de código) para ver la estructura de contenido de marcado subyacente

  • Vista XML JCR (creación de AEM) (icono de datos) para ver la estructura de contenido XML JCR resultante

Siempre puede hacer clic en el icono Actualizar vista previa para actualizar el panel de vista previa.

El botón Eliminar quita la página seleccionada del área de trabajo. El contenido visualizado previamente o publicado no se eliminará.

El botón Errores (Creación en AEM) abre una ventana modal para ver los errores de la página seleccionada.

El botón Cargar contenido abre una ventana modal para cargar archivos en AEM.

  • El campo Organización y Repositorio se han rellenado previamente si el proyecto tiene un archivo de fstab.yaml
  • La selección de archivos proporciona rutas de destino editables
  • No se admite la carga en JCR (para el editor universal)

Cargar contenido

Vista de código code-view

La vista Código proporciona herramientas para examinar el código y administrar los cambios en el código. La vista se divide en tres paneles, de izquierda a derecha:

  • Panel de chat para interactuar con la consola y el proyecto
  • Explorador de archivos para obtener una descripción general de los archivos de código o cambios como diferencias
  • Panel de vista previa para ver un archivo de código o los cambios seleccionados en el explorador de archivos

Vista de código

El panel de vista previa ofrece dos modos diferentes:

  • Archivos de Workspace para examinar los archivos de código del área de trabajo actual

    • Use el botón Agregar al chat para agregar el archivo al panel de chat para obtener contexto.
  • Cambios de Git para ver las diferencias de los cambios de archivos creados por su trabajo en el proyecto

    • Haga clic en el icono + para almacenar en zona intermedia el archivo modificado
    • Haga clic en el icono de flecha para descartar el archivo modificado

El icono Información enumera tu cuenta y proyecto de GitHub conectado actualmente.

El menú Acciones de GitHub (parte superior derecha) proporciona operaciones del repositorio.

  • Conectar/Volver a conectar: inicia OAuth en GitHub
  • Repositorio de cambios: reemplaza el área de trabajo por un repositorio diferente. Se perderá cualquier trabajo no comprometido.
  • Cambiar rama: cambia ramas dentro del mismo repositorio
  • Sincronizar: extrae los cambios más recientes del origen remoto
  • Push: abre un modal para insertar los cambios del espacio de trabajo en GitHub
  • Cerrar sesión: se desconecta de GitHub

Al insertar cambios, primero debe tener cambios clasificados para incluirlos en la notificación push. Al insertar, puede elegir crear una nueva PR o insertar directamente en la rama actual

Cambios push

Vista de configuración settings-view

La vista de configuración permite administrar la configuración básica de la consola.

Vista de configuración

  • Proyecto le permite ver y editar la configuración del proyecto, como personalizar la dirección URL de la biblioteca.

  • Asistencia le permite solicitar ayuda al equipo de asistencia de AEM.

  • Credenciales le permite especificar un token de acceso personal para Figma de modo que la consola pueda acceder a los bloques de diseño de su proyecto.

    • El token requiere los siguientes ámbitos de solo lectura:

      • file_content:read
      • file_metadata:read
      • library_assets:read
      • library_content:read
      • team_library_content:read
      • file_dev_resources:read
      • projects:read
    • Consulte la documentación de Figma para obtener más información sobre la configuración de tokens de acceso personal.

  • Restablecer espacio de trabajo revierte la consola a su estado inicial y se perderán todos los cambios no insertados o no cargados.

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab