JDhruv14/ascii-diorama

O que é?

Recursos principais

• 01Renderiza cenas 3D como glifos ASCII coloridos, selecionados conforme o tipo de superfície.
• 02Oferece um servidor de pré-visualização ao vivo que reconstrói a cena ao recarregar.
• 03Inclui uma cena inicial com terreno, shader de água, grama, flores e objetos.
• 04Aplica desfoque tilt-shift às partes superior e inferior da imagem.
• 05Baixa texturas e modelos com um script incluído.

Casos de uso

• Criar uma miniatura 3D animada no estilo ASCII com Claude Code.
• Prototipar um diorama personalizado, como um porto, uma vila ou um farol.
• Exportar uma cena de arte ASCII em loop como uma página web estática.

Início rápido

1. 1

   Clone a skill na pasta de skills do Claude Code

   git clone https://github.com/JDhruv14/ascii-diorama ~/.claude/skills/ascii-diorama
2. 2

   Instale as dependências do Three.js e do esbuild na pasta scene

   npm i three esbuild
3. 3

   Copie a cena inicial para uma nova pasta e baixe os recursos

   mkdir -p my-scene && cp ~/.claude/skills/ascii-diorama/templates/scene/* my-scene/ && bash ~/.claude/skills/ascii-diorama/scripts/fetch-assets.sh my-scene
4. 4

   Inicie a pré-visualização ao vivo e abra http://127.0.0.1:5173/

   node ~/.claude/skills/ascii-diorama/scripts/serve.mjs my-scene

Antes de usar

• !É necessário um navegador compatível com WebGL 2 e Node.js 18 ou superior.
• !O download dos recursos inclui itens com licença CC BY 4.0, que exigem atribuição quando a raposa for exibida.

Em coleções

Tópicos

Perguntas frequentes

O que é ascii-diorama?

Skill do Claude Code que orienta um agente de IA na criação de cenas 3D em miniatura com efeito tilt-shift, renderizadas como glifos ASCII coloridos com Three.js. ascii-diorama é uma skill do Claude Code para criar miniaturas ASCII com efeito tilt-shift: pequenas cenas 3D desenhadas inteiramente com caracteres monoespaçados coloridos. A câmera observa o diorama em Three.js de um ângulo bem elevado e se move para frente e para trás enquanto as partes superior e inferior da imagem ficam desfocadas, criando a aparência de uma maquete. Grama, água, pedra e árvores são desenhadas com conjuntos próprios de glifos, e cada glifo recebe sua cor da renderização 3D.

ascii-diorama é gratuito? Qual é a licença?

ascii-diorama é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.

ascii-diorama ainda é mantido?

Manutenção ativa. O último commit de ascii-diorama foi em 2 de nov. de 2026.

Para que posso usar ascii-diorama?

Criar uma miniatura 3D animada no estilo ASCII com Claude Code. Prototipar um diorama personalizado, como um porto, uma vila ou um farol. Exportar uma cena de arte ASCII em loop como uma página web estática.

Como instalar ascii-diorama?

Clone a skill na pasta de skills do Claude Code: git clone https://github.com/JDhruv14/ascii-diorama ~/.claude/skills/ascii-diorama Instale as dependências do Three.js e do esbuild na pasta scene: npm i three esbuild Copie a cena inicial para uma nova pasta e baixe os recursos: mkdir -p my-scene && cp ~/.claude/skills/ascii-diorama/templates/scene/* my-scene/ && bash ~/.claude/skills/ascii-diorama/scripts/fetch-assets.sh my-scene Inicie a pré-visualização ao vivo e abra http://127.0.0.1:5173/: node ~/.claude/skills/ascii-diorama/scripts/serve.mjs my-scene

Onde consigo ascii-diorama?

O código-fonte e as instruções de instalação estão no GitHub: https://github.com/JDhruv14/ascii-diorama