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
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.
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.
Navegação navigation
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.
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
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.
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
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
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.
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:readfile_metadata:readlibrary_assets:readlibrary_content:readteam_library_content:readfile_dev_resources:readprojects: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.