Axis DesignConversa → canvasBaixar Axis Design

Axis Design / workspace desktop com OpenCode

HTML · CSS · JS / LOCAL + SSH

Da conversa ao canvas.

Descreva. Veja. Refine. Leve os arquivos.

Uma visão concreta

A conversa de um lado. A página do outro.

Veja a interface real em modo demo. Os pedidos usam respostas simuladas, sem chamadas à IA.

AXIS DESIGN / DEMONSTRAÇÃOLOCAL · MODO DEMO
Capa da demonstração: interface real do Axis Design com conversa e prévia lado a lado, em modo demo
Pausado. A reprodução começa somente quando você escolher.

A gravação mostra um pedido alterando a página, a seleção de um elemento na prévia e um ajuste por prompt, seguido da conferência no viewport mobile. As respostas são simuladas, sem uso de IA.

Interface real · modo demo · respostas simuladas · sem áudio

Quatro momentos, um fluxo

Da intenção ao arquivo. Sem perder o fio.

O canvas é a área de trabalho. A página continua sendo HTML, CSS e JavaScript reais, não uma imagem do que poderia ser.

01 / DO PEDIDO À PÁGINA

Descreva.

Comece de uma página em branco, de um template ou de uma pasta com index.html. Conte ao OpenCode o que a página precisa comunicar e qual direção visual seguir.

Para IA: OpenCode CLI instalado e provedor autenticado.

Um ponto de partida

“Crie uma landing page para um estúdio de arquitetura. Direção editorial, cores neutras, tipografia marcante e navegação simples.”
Exemplo de pedido, não uma captura da interface.

02 / DO PEDIDO À PÁGINA

Veja ao vivo.

Conversa e prévia ficam lado a lado. Quando os arquivos são salvos, a página se atualiza. Alterne entre desktop, tablet e mobile para conferir como o layout responde.

Prévia pelo DOM do navegador, em um iframe isolado.

A mesma página, outras larguras

Desktop1280px
Tablet768px
Mobile390px
Esquema conceitual dos viewports do aplicativo. Não é uma captura.

03 / DO PEDIDO À PÁGINA

Selecione e refine.

Ative Selecionar e clique no elemento. O trecho da página, seus estilos e suas dimensões acompanham o próximo pedido, para um ajuste com contexto.

Seleção e edição por prompt. Sem arrastar componentes.

Um elemento, um pedido

ELEMENTO SELECIONADO / h1Seu próximo título.

“Troque o texto por ‘Ideias com propósito.’”

Exemplo conceitual de seleção e prompt, não uma captura da interface.

04 / DO PEDIDO À PÁGINA

Exporte.

Consulte o código de index.html e exporte os arquivos públicos em ZIP. O inspetor fica só na prévia: não é gravado na página nem incluído na exportação.

Arquivos estáticos. Sem backend ou hospedagem automática.

O resultado não fica preso à prévia

HTML + CSS + JS
Arquivos públicos do projetoExportação ZIP
Esquema conceitual da exportação. Recursos externos por URL não entram no ZIP.

Local ou por SSH

O projeto fica onde você trabalha.

A interface aproxima o fluxo. Cada ambiente mantém seus arquivos e seu OpenCode.

01 / NA SUA MÁQUINA

Desktop local.

Abra seus projetos no computador. Para usar IA, o aplicativo se conecta ao OpenCode instalado nesse ambiente, com o seu provedor autenticado.

02 / NO HOST DE DESTINO

Companion Linux por SSH.

Use o desktop com um túnel OpenSSH para o servidor headless. Arquivos, modelos e autenticação ficam no host remoto, que também precisa do OpenCode para IA.

SSH por chave ou agent, com host conhecido. Não é necessário expor a porta HTTP do workspace na internet.

Primeiros passos

Da instalação à primeira conversa.

Confira os requisitos do pacote antes de abrir seu workspace.

Consultar pacotes e requisitos
  1. 01

    Escolha um pacote publicado.

    Veja os arquivos disponíveis para seu sistema. O companion SSH é um pacote separado do desktop.

  2. 02

    Prepare o OpenCode para IA.

    Instale o CLI e autentique o provedor na máquina local ou no host SSH que executa o projeto.

    opencode auth login
    opencode models
  3. 03

    Abra o Axis Design e descreva a página.

    Crie ou abra um design, conecte o OpenCode e envie seu pedido. Para explorar sem IA, use o modo demo.

Antes de começar

Perguntas diretas. Limites claros.

O que o aplicativo faz, o que você precisa e o que está fora desse fluxo.

Consultar mudanças publicadas
Preciso do OpenCode para usar IA?

Sim. Para gerar e refinar páginas com IA, instale o OpenCode CLI na máquina que executa o projeto e autentique seu provedor. O Axis Design usa os modelos e a conta desse OpenCode; não inclui uma conta de IA. Fora da demo, o aplicativo instala seu kit de integração com o OpenCode.

A demonstração usa IA de verdade?

Não. A gravação mostra a interface real em modo demo, com arquivos temporários e respostas simuladas, sem chamadas à IA e sem áudio. Você também pode abrir o aplicativo com --demo para explorar esse fluxo. Ao encerrar, os arquivos temporários são removidos; exporte um ZIP se quiser guardar uma cópia.

O aplicativo gera projetos React ou Next.js?

Não. O resultado é uma página estática em HTML, CSS e JavaScript, com entrada index.html. A prévia renderiza essa página pelo DOM do navegador em um iframe isolado. Projetos React, Next.js ou Vite, bundlers e servidores de desenvolvimento não são iniciados. A prévia é visual: não fornece backend nem hospedagem para o site gerado.

Posso arrastar elementos no canvas?

Não há drag-and-drop, desenho vetorial ou redimensionamento por alças. Ative Selecionar, clique em um elemento da prévia e descreva o ajuste. O seletor, o texto, o HTML, os estilos computados, as dimensões e o viewport ajudam a contextualizar o pedido enviado ao OpenCode.

O que vem no ZIP exportado?

Os arquivos públicos do projeto, incluindo HTML, CSS e JavaScript. O inspetor usado na prévia não entra na exportação. Pastas ocultas, node_modules e links simbólicos são excluídos; recursos externos referenciados por URL não são baixados para o ZIP. O limite atual é de 1.000 arquivos e 20 MiB de conteúdo público.

Como funciona o trabalho por SSH?

O desktop se conecta por túnel OpenSSH ao companion Linux headless. O host remoto precisa de shell POSIX, OpenCode instalado e provedor autenticado para IA. A conexão usa chave ou ssh-agent e host conhecido, sem diálogo de senha. Projetos, arquivos, modelos e autenticação ficam na máquina remota; o companion não é o aplicativo desktop.

Quais sistemas e versões posso baixar?

A disponibilidade depende dos arquivos realmente publicados em cada release; consulte Download e Changelog. Linux desktop requer GTK 3 e WebKitGTK 4.1; Windows requer WebView2. Os pacotes macOS são DMGs com assinatura ad-hoc, sem notarização. O companion SSH é Linux headless, sem GTK. Esta página não garante que todos os pacotes já estejam publicados.

Axis Design / da conversa ao canvas

Dê forma à próxima ideia.

Conheça os pacotes disponíveis e leve o fluxo para o seu ambiente.