> For the complete documentation index, see [llms.txt](https://docs.decentraland.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.decentraland.org/creator/content-creator-pt/scenes-sdk7/primeiros-passos/preview-scene.md). # Faça Preview da Sua Scene O que você pode ver no preview de uma scene Depois de ter [criado uma nova scene](#create-your-first-scene) ou baixado um [exemplo de scene](https://studios.decentraland.org/resources?sdk_version=SDK7) você pode pré-visualizá-la localmente. ## Usando o Scene Editor no Creator Hub Certifique-se de que você tenha [instalado o Creator Hub](https://github.com/decentraland/docs/tree/main/creator/sdk7/get-started/editor-installation.md). 1. Abra o projeto da sua scene. 2. Clique no **Preview** botão no canto superior direito. Isso abrirá uma nova janela com o Decentraland Desktop Explorer, executando apenas a sua scene. Lá você pode se mover pela scene e interagir com itens interativos. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-30317b50bc4b4e646a1b28effe1ff76939ab0f28%2Fpreview-button.png?alt=media) Configure diferentes opções de pré-visualização no menu suspenso ao lado do **Preview** botão: * **Pré-visualizar com**: Escolha entre **Desktop Client** (o Decentraland Explorer padrão) e **Bevy (Web)**, que abre a pré-visualização no seu navegador usando o cliente Bevy Web. A opção Bevy Web é equivalente ao sinalizador `--web` da CLI. * **Abrir janela do console durante a pré-visualização**: Abre uma nova janela com a saída do console da scene. Isso é útil para depurar erros na scene. * **Pular tela de autenticação**: Pula a tela de seleção de conta e faz login automaticamente com a conta em que você já está conectado. Isso vem desativado por padrão; ative-o se quiser testar várias contas. * **Terreno paisagístico ativado**: Alterna a paisagem ao redor da scene. Isso vem ativado por padrão; desative-o para reduzir a memória usada pela scene. * **Ativar servidor MCP**: Inicia o Explorer com o servidor de automação MCP ativado, para que agentes de IA possam ver e controlar a pré-visualização em execução. Só fica visível quando a versão do SDK do seu projeto oferece suporte a isso. Veja [Vibe Coding com IA](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/vibe-coding.md#let-the-ai-see-your-scene-in-world) para o fluxo de trabalho completo. * **Otimizar assets**: Pré-visualiza a scene com asset bundles gerados localmente, correspondendo à forma como ela é renderizada em produção após [a conversão de asset bundles](/creator/content-creator-pt/scenes-sdk7/otimizacao/performance-optimization.md#asset-bundle-conversion). A primeira execução converte todos os assets, o que pode levar vários minutos em scenes grandes. Disponível apenas com o Desktop Client (não com Bevy Web). Veja [Pré-visualizar com assets otimizados](#preview-with-optimized-assets). * **Mostrar código QR para mobile**: Exibe um código QR que abre a pré-visualização da sua scene no [aplicativo móvel da Decentraland](/creator/content-creator-pt/criar-para-dispositivos-moveis/mobile-client/overview.md). Escaneie o código com um telefone na mesma rede Wi-Fi que o seu computador. Veja [Pré-visualizar no mobile](/creator/content-creator-pt/criar-para-dispositivos-moveis/desenvolver/preview-on-mobile.md) para mais detalhes. {% hint style="info" %} **Dica:** Você também pode pré-visualizar sua scene diretamente no aplicativo móvel da Decentraland. Use a **Mostrar código QR para mobile** opção no Creator Hub, ou execute `npm run start -- --mobile` pela CLI. Veja [Pré-visualizar no mobile](/creator/content-creator-pt/criar-para-dispositivos-moveis/desenvolver/preview-on-mobile.md) para mais detalhes. {% endhint %} ## Usando a CLI Para pré-visualizar uma scene, execute o seguinte comando na pasta principal da scene: ```bash npm run start ``` Quaisquer dependências ausentes são instaladas e então a CLI cria um servidor web local no seu sistema e inicia a scene no Decentraland Desktop Client por meio de um `decentraland://` deeplink. O Desktop Client é o destino padrão da pré-visualização. Para pré-visualizar em uma aba do navegador, em vez disso, adicione `-- --web` (ou `-- --bevy-web`) para abrir a scene no cliente Bevy Web em `decentraland.org/bevy-web/`. Sempre que você fizer alterações na scene, a pré-visualização recarrega e atualiza automaticamente, então não há necessidade de executar o comando novamente. {% hint style="warning" %} **📔 Nota**: Algumas scenes dependem de se comunicar com um servidor externo para executar lógica personalizada ou armazenar e recuperar dados. Ao pré-visualizar uma dessas scenes, provavelmente você também terá que executar o servidor localmente em outra porta. Verifique o readme da scene para instruções sobre como iniciar o servidor, bem como a scene. {% endhint %} ### Parâmetros do comando de pré-visualização Você pode adicionar os seguintes flags ao `npm run start` comando para alterar seu comportamento: * `-- --web` (alias `-- --bevy-web`) Abre a pré-visualização no cliente de navegador Bevy Web em `decentraland.org/bevy-web/` em vez do Desktop Explorer. Navegadores baseados em Chromium (Chrome 142+) exigem a permissão Local Network Access para que a página hospedada alcance o seu servidor local de pré-visualização — quando o navegador pedir para acessar apps no seu dispositivo, clique em "Allow". * `-- --mobile` (alias `-- -m`) Mostra um código QR no terminal que abre sua scene no [aplicativo móvel da Decentraland](/creator/content-creator-pt/criar-para-dispositivos-moveis/mobile-client/overview.md) em um telefone conectado à mesma rede Wi-Fi. Veja [Pré-visualizar no mobile](/creator/content-creator-pt/criar-para-dispositivos-moveis/desenvolver/preview-on-mobile.md). * `-- --skip-build` Pule a compilação e sirva apenas os arquivos no modo de pré-visualização. * `-- --port` (alias `-- -p`) para atribuir uma porta específica para executar a scene. Caso contrário, será usada qualquer porta disponível. * `-- --no-browser` (alias `-- -b`) para impedir que a pré-visualização abra uma nova aba do navegador. * `-- -w` ou `-- --no-watch` para não monitorar alterações no sistema de arquivos e evitar hot-reload sempre que o código da scene mudar. * `-- --ci` Para executar o previewer de parcel em um servidor Unix remoto. * `-- --multi-instance` Permite executar várias instâncias do Explorer simultaneamente. * `-- --local-ab` Pré-visualize com asset bundles otimizados. O Desktop Explorer converte os assets da scene em asset bundles por conta própria durante a pré-visualização, correspondendo à forma como a scene é renderizada em produção. Equivalente à **Otimizar assets** opção no Creator Hub. Disponível apenas com o Desktop Client (não com Bevy Web). Veja [Pré-visualizar com assets otimizados](#preview-with-optimized-assets). * `-- --no-client` Suprime todo auto-início (deeplink do Explorer desktop, abertura do navegador, QR mobile). O monitor de arquivos ainda notifica um Explorer desktop se ele se conectar por conta própria. Útil quando uma ferramenta externa controla o processo do Explorer. * `-- --mcp` Ativa o servidor MCP no Explorer (encaminhado como um parâmetro de deep link). * `-- --mcp-port` Porta para o servidor MCP no Explorer (encaminhada como um parâmetro de deep link). Por exemplo: `npm run start -- --mcp --mcp-port 3001`. {% hint style="warning" %} **📔 Nota**: Os parâmetros precisam ser adicionados com dois grupos de hífens, por exemplo `npm run start -- --web3`. {% endhint %} ## Pré-visualizar com assets otimizados Quando você publica uma scene, os servidores da Decentraland convertem todos os seus modelos 3D em asset bundles, um formato otimizado que é muito mais leve para carregar e renderizar. Veja [Conversão de asset bundle](/creator/content-creator-pt/scenes-sdk7/otimizacao/performance-optimization.md#asset-bundle-conversion). Por padrão, as pré-visualizações locais pulam esta etapa e carregam os modelos brutos em vez disso. Ative assets otimizados para executar essa mesma conversão localmente quando você pré-visualizar sua scene. Isso tem dois benefícios: * A pré-visualização carrega mais rápido e roda de forma mais suave, especialmente em scenes com modelos 3D pesados. * Você vê os modelos exatamente como os players os verão após a publicação, então pode identificar qualquer problema com a compressão dos assets antes de publicar. Esta opção afeta apenas a sua pré-visualização local. A scene publicada é sempre convertida nos servidores, independentemente de você usar esta opção ou não. Para ativá-la: * **No Creator Hub**: marque **Otimizar assets** no menu suspenso ao lado do **Preview** botão. * **Na CLI**: execute `npm run start -- --local-ab`. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-e8a9e4c2c58d07f6493df205efe569837d4701f8%2Foptimize-assets-checkbox.png?alt=media) Com esta opção ativada, o Explorer da Decentraland converte os modelos 3D da scene em asset bundles na sua máquina antes de carregá-los. A conversão é quase instantânea para a maioria das scenes, mas a primeira pré-visualização pode demorar mais se a scene tiver assets muito pesados. Os modelos convertidos ficam em cache, então nas pré-visualizações seguintes apenas assets novos ou modificados precisam ser convertidos. {% hint style="info" %} **💡 Dica**: Se a conversão de um asset falhar por qualquer motivo, a pré-visualização volta a carregar os modelos 3D brutos, como em uma pré-visualização normal. {% endhint %} ## Enviar uma scene para Decentraland Quando você estiver satisfeito com sua scene, você pode enviá-la e publicá-la na Decentraland. Para isso, você deve possuir LAND, um Decentraland NAME ou um nome ENS em ETH, ou ter permissões concedidas por alguém que tenha. Veja [publicação](/creator/content-creator-pt/scenes-sdk7/publicacao/publishing.md) para instruções sobre como fazer isso. ## Tamanho da scene na pré-visualização O tamanho da scene mostrado na pré-visualização é baseado na configuração da scene. Edite isso na segunda aba do menu da scene no Scene Editor. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-54a1901635efda3371172e647c03614733baca17%2Fscene-parcels-3x3.png?alt=media) Use os menus suspensos e clique em **Aplicar layout** para alterar as dimensões da sua scene. Você também pode clicar em cada parcel individual para desativá-la no seu layout. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-bbc2ecb567600843892a8c8873aaa70107e66839%2Fscene-parcels-toggled.png?alt=media) Você também pode editar o *scene.json* arquivo para listar vários parcels no campo "parcels". Veja [definir parcels pela linha de comando](/creator/content-creator-pt/scenes-sdk7/tipos-de-projetos/scene-metadata.md#scene-parcels) para mais detalhes. {% hint style="info" %} **💡 Dica**: Enquanto a pré-visualização estiver em execução, as coordenadas dos parcels não precisam corresponder às que sua scene realmente usará, desde que sejam adjacentes e estejam organizadas no mesmo formato. Você terá que substituí-las pelas coordenadas reais mais tarde, quando você [fizer o deploy da scene](#upload-a-scene-to-decentraland). {% endhint %} ## Ver o console da scene Abra o console clicando no ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-a673f6b987216e9e471fdac882879c44fcf94652%2Fconsole-icon.png?alt=media) ícone no canto superior direito. Aqui você pode ver quaisquer mensagens de erro e também qualquer texto que sua scene imprime no console via `console.log()`. Você também pode abri-lo pressionando a **\`** tecla no seu teclado. Você também pode pressionar Shift + **\`** para abrir o console ainda mais amplo, caso precise ver mais texto. ## Teste localmente uma scene multiplayer Se você iniciar uma pré-visualização da scene e abri-la em duas (ou mais) janelas diferentes do Explorer da Decentraland, cada janela aberta será interpretada como um player separado, e um servidor de comunicação simulado manterá esses players em sincronização. Interaja com a scene em uma janela e depois mude para a outra para ver que os efeitos dessa interação também ficam visíveis lá. Usando o Creator Hub, clique no botão Preview uma segunda vez, e isso abrirá uma segunda janela do Explorer da Decentraland. Você deve conectar as duas janelas com endereços diferentes. As mesmas sessões permanecerão abertas enquanto a scene recarrega. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-30317b50bc4b4e646a1b28effe1ff76939ab0f28%2Fpreview-button.png?alt=media) Como alternativa, você pode abrir uma segunda janela do Explorer da Decentraland escrevendo o seguinte em uma URL do navegador: > `decentraland://realm=http://127.0.0.1:8000&local-scene=true&debug=true&multi-instance=true` ### Avançado: iteração rápida com asset bundles remotos {% hint style="info" %} **💡 Dica**: Para a maioria das scenes, a maneira mais simples de pré-visualizar com asset bundles é ativar [assets otimizados](#preview-with-optimized-assets), o que converte seus modelos localmente e sempre reflete a versão mais recente deles. O modo abaixo é uma alternativa que reutiliza os bundles já publicados nos servidores. {% endhint %} Para scenes pesadas com muitos modelos 3D, você pode acelerar o carregamento e o recarregamento da scene reutilizando os [asset bundles](/creator/content-creator-pt/scenes-sdk7/otimizacao/performance-optimization.md#asset-bundle-conversion) que já estão publicados nos servidores da Decentraland, em vez de carregar os modelos 3D brutos e não otimizados. Isso é especialmente útil ao iterar em mudanças apenas de código. Para ativar este modo, inicie o Decentraland Desktop Client com os seguintes argumentos: ```bash npm run start -- --realm http://127.0.0.1:8000/ --position 0,0 --local-scene true --debug --skip-version-check true --lsd-use-remote-ab ``` Os `` o argumento muda dependendo de onde a scene já está publicada: * **Em Genesis City**: `--lsd-remote-ab-server Genesis` * **Em um World**: `--lsd-remote-ab-world .dcl.eth` Por exemplo, para pré-visualizar uma cópia local de uma scene que já foi implantada em um World: ```bash npm run start -- --realm http://127.0.0.1:8000/ --position 0,0 --local-scene true --debug --skip-version-check true --lsd-use-remote-ab --lsd-remote-ab-world myworld.dcl.eth ``` Em ambos os casos, `--realm http://127.0.0.1:8000/` aponta o cliente para o seu servidor local de pré-visualização (execute `npm run start` primeiro para iniciá-lo), e `--local-scene true` instrui o cliente a carregar o código da scene a partir dali. {% hint style="warning" %} **📔 Importante**: Ao usar este modo, é recomendável que **todos** os seus assets de arte já estejam publicados, com seus asset bundles totalmente processados pelos content servers. Se você adicionou assets novos, você não terá o carregamento otimizado, pois eles serão carregados como arquivos gltf brutos, como acontece quando você executa uma pré-visualização normalmente. Mas, se você modificou localmente um asset que já estava publicado, mantendo o mesmo nome de arquivo, então você verá a versão publicada antiga desse asset. Nesse caso, faça o deploy da scene novamente primeiro, espere alguns minutos para que os asset bundles sejam gerados (veja [Conversão de asset bundle](/creator/content-creator-pt/scenes-sdk7/otimizacao/performance-optimization.md#asset-bundle-conversion)), e depois volte a usar este modo para iteração apenas de código. {% endhint %} --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.decentraland.org/creator/content-creator-pt/scenes-sdk7/primeiros-passos/preview-scene.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.