Console de Modernização da experiência console-reference

Guia de referência para a interface e os recursos do Console de modernização de experiência

NOTE
Se você estiver interessado em usar o Console de modernização de experiência, poderá solicitar acesso para garantir uma experiência de integração tranquila.

Visão geral overview

O Console de Modernização da Experiência é um ambiente de desenvolvimento hospedado e assistido por IA para o Edge Delivery Services, exposto como uma interface da Web em aemcoder.adobe.io. Depois de se conectar ao projeto GitHub, você pode iniciar imediatamente a solicitação de alterações na linguagem natural sem precisar de mais configuração ou configuração de ambiente local.

TIP
Se você estiver interessado em começar imediatamente a usar o console, confira o documento Introdução ao Agente de Modernização de Experiência.

Recursos capabilities

Principais recursos do console:

  • Painel de bate-papo interativo com o agente e suas habilidades
  • Visualização do Live AEM para feedback visual imediato sobre as alterações
  • Navegador de arquivos de conteúdo e visualizador de Markdown
  • Sincronização de conteúdo com Criação de documentos
  • Navegador de código e visualizador de diferenças para revisar as alterações feitas
  • Integração do GitHub com a capacidade de criar solicitações de pull a partir de alterações

Os desenvolvedores mantêm controle total sobre quais envios. Todas as alterações feitas pelo console exigem análise e aprovação antes da implantação, garantindo a governança, a consistência da marca e a segurança.

Depois de entrar no console em aemcoder.adobe.io, você chegará à página inicial do console. Depois de começar a conversar, você acessará diretamente a página de chat em visitas subsequentes ao agente de Modernização de experiência.

Tela inicial do console

Barra de menus menu-bar

A barra do menu superior fornece:

  • Um título Adobe Experience Manager à esquerda, vinculado à Página Inicial quando clicado
  • Um botão Solicitar suporte, no qual você pode enviar detalhes sobre os problemas encontrados
  • Um botão Conta à direita para alternar para o modo escuro e sair do console

Página inicial home-page

A página Página inicial é o seu ponto de partida para usar o console.

  • Na parte superior há uma entrada de prompt para fazer solicitações do console.
  • Abaixo do painel de prompts estão sugestões de prompts para começar a usar seu projeto.
  • Um botão Iniciar conversa que direciona você à página de chat.
  • Um botão Configurações para acessar a página configurações do projeto

Entrada de Solicitação prompt-input

A entrada do prompt fornece controles para interagir com a IA.

  • Planejar / Executar modos (ícones de lâmpada e varinha mágica): alternar entre os modos de planejamento e execução, respectivamente

    • Modo de plano: a IA analisa solicitações e descreve uma abordagem sem fazer alterações, o que é útil para entender a estratégia antes de confirmar.
    • Modo de execução: a IA executa o plano e faz alterações reais no arquivo.
  • Anexar arquivos (ícone de clipe de papel): carregue e anexe arquivos ao prompt para contexto adicional (por exemplo, designs de referência, capturas de tela, especificações)

  • Fila de prompts (ícone de relógio): prompts adicionais podem ser enfileirados para serem executados automaticamente após a conclusão do prompt atual.

Página de bate-papo chat-page

A página Chat é a principal interface para interagir com o agente de Modernização de Experiência. Esta página está dividida em um painel de chat e um painel do espaço de trabalho redimensionáveis.

Painel de bate-papo chat-panel

O painel de chat permite exibir e continuar sua conversa com o agente de Modernização de experiência. O painel de chat inclui o histórico de mensagens de chat e uma entrada de prompt para fazer solicitações adicionais do console.

O cabeçalho do painel de chat inclui links para navegar até a Página Inicial e as Configurações ações de exibição e chat.

  • Ações de chat

    • Limpar chat: redefine a conversa e limpa a janela de contexto da IA. Use esta opção ao iniciar uma nova tarefa não relacionada à conversa anterior.
    • Baixar chat: baixa o histórico da conversa como um arquivo de marcação.

Painel do Workspace workspace-panel

O painel espaço de trabalho exibe todo o conteúdo e código do site. O cabeçalho na parte superior do painel inclui um seletor para selecionar a exibição específica na qual você deseja se concentrar. As ações disponíveis no cabeçalho do espaço de trabalho serão alteradas com base na exibição selecionada no momento.

Visualizações de conteúdo content-view

As Exibições de conteúdo contêm vários modos para exibir o conteúdo da página selecionada. Um navegador de arquivos recolhível exibe todo o conteúdo de página disponível para o site.

  • Visualizar (documento com ícone de lupa) para exibir o conteúdo do HTML renderizado
  • Exibição de documento (ícone de documento) para exibir a estrutura de conteúdo de criação do documento subjacente, respectivamente
  • modo de exibição do HTML (ícone de código) para exibir o html sem formatação
  • Exibição do Markdown (criação no AEM) (ícone de parágrafo) para exibir a estrutura de conteúdo subjacente do Markdown
  • Visualização JCR XML (criação no AEM) (ícone de dados) para exibir a estrutura de conteúdo JCR XML resultante

Exibição de conteúdo

As seguintes ações estão disponíveis nas visualizações de conteúdo:

  • Ícone Atualizar para atualizar a renderização do painel de visualização.
  • Modo responsivo para exibir o conteúdo renderizado do HTML em uma exibição de desktop, tablet ou móvel
  • Modo de inspeção (selecione o ícone ) para adicionar elementos da página ao seu prompt para contexto adicional
  • Nova janela (ícone de abrir) para abrir a URL de visualização em uma nova guia (para uma visualização completa da área de trabalho)
  • Excluir remove a página selecionada do espaço de trabalho. O conteúdo visualizado ou publicado não será excluído.
  • O botão Erros (criação do AEM) abre uma janela modal para exibir os erros na página selecionada.
  • O botão Carregar conteúdo abre uma janela modal para carregar arquivos para o AEM.

Carregar conteúdo

Visualizações de código code-view

As Exibições de código fornecem ferramentas para navegar nos arquivos de projeto e gerenciar alterações de código. A exibição inclui um navegador de arquivos para obter uma visão geral dos arquivos de código ou alterações como diferenças, e uma área de visualização para exibir o arquivo ou as alterações selecionadas.

  • Arquivos para procurar os arquivos de código no espaço de trabalho atual
  • Alterações para exibir as diferenças dos arquivos, alterações criadas pelo seu trabalho no projeto

Modo de exibição de código

Ações do arquivo file-actions

  • Adicionar ao chat adiciona o arquivo selecionado (ou linhas selecionadas do arquivo) ao painel de chat para contexto.
  • Baixar o arquivo selecionado para o sistema de arquivos local

Muda Ações changes-actions

  • Adicionar (+ ícone) para preparar o arquivo alterado
  • Descartar (ícone de seta) para descartar o arquivo alterado
  • Excluir (ícone da lixeira) para excluir o arquivo não preparado
  • Atualizar (ícone de atualização) para atualizar a lista de alterações
  • Alternar ramificação: alterna ramificações dentro do mesmo repositório
  • Sincronização: obtém as alterações mais recentes da origem remota
  • Push: abre um modal para enviar alterações do espaço de trabalho para o GitHub

Ao enviar alterações, você deve ter as primeiras alterações preparadas para incluí-las no push. Ao enviar, você pode optar por criar uma nova PR ou enviar diretamente para a ramificação atual

Enviar alterações

Ações adicionais de projetos do GitHub podem ser executadas na página de configurações.

Página Configurações settings-page

A página Configurações permite gerenciar configurações básicas do console e está dividida nas seções a seguir.

Modo de exibição de configurações

Se você fizer uma alteração em qualquer valor em qualquer seção, clique em Salvar para salvar essas alterações na seção individual. Clique no ícone Voltar para retornar à visualização anterior.

  • O Project permite que você exiba e edite configurações do projeto, como gerenciar sua conexão com o GitHub e personalizar a URL da biblioteca.

    • Conectar/Reconectar: inicia a autenticação do GitHub
    • Alternar Repositório: substitui o espaço de trabalho por um repositório diferente. Qualquer trabalho não comprometido será perdido.
    • Logout: desconecta-se do GitHub
    • URL da biblioteca - Esta URL aponta para um arquivo library.json que define os blocos disponíveis, suas variações e o conteúdo do exemplo.
    • URL base do site - A URL de origem do site que está sendo migrado
  • Permissões do agente - Permitem que o agente acesse as opções de configuração

    • Permitir que o LLM acesse admin.hlx.page em meu nome - Quando habilitado, o assistente de IA pode buscar configurações de site e metadados da Adobe Experience Manager usando suas credenciais IMS.
    • Token IMS personalizado - Você pode fornecer um token IMS personalizado para usar em vez do token de sessão padrão.
  • Credenciais permite que você especifique um token de acesso pessoal para o Figma, para que o console ​ possa acessar blocos de design para o seu projeto.

    • O token requer os seguintes escopos somente leitura:

      • file_content:read
      • file_metadata:read
      • library_assets:read
      • library_content:read
      • team_library_content:read
      • file_dev_resources:read
      • projects:read
    • Consulte a documentação do Figma para obter mais informações sobre como configurar tokens de acesso pessoal.

  • O Suporte resume informações compartilhadas com a equipe de suporte da Adobe quando você faz uma solicitação de suporte.

    • Solicitar suporte - Clique para iniciar uma solicitação de suporte da Adobe sem sair do console.
  • A zona de perigo contém configurações que podem reverter seu espaço de trabalho.

    • Redefinir espaço de trabalho - Clique para redefinir o espaço de trabalho para seu estado inicial. Essa operação não pode ser desfeita.
recommendation-more-help
experience-manager-cloud-service-help-main-toc