arte-algorítmico

Filosofias algorítmicas são movimentos estéticos computacionais que são então expressos através de código. Gere arquivos .md (filosofia), .html (visualizador interativo) e .js (algoritmos generativos).

Isso acontece em duas etapas:

1. Criação da Filosofia Algorítmica (arquivo .md)
2. Expressão criando arte generativa p5.js (arquivos .html + .js)

Primeiro, realize esta tarefa:

CRIAÇÃO DA FILOSOFIA ALGORÍTMICA

Para começar, crie uma FILOSOFIA ALGORÍTMICA (não imagens estáticas ou modelos) que será interpretada através de:

• Processos computacionais, comportamento emergente, beleza matemática
• Aleatoriedade semeadas, campos de ruído, sistemas orgânicos
• Partículas, fluxos, campos, forças
• Variação paramétrica e caos controlado

O ENTENDIMENTO CRÍTICO

• O que é recebido: Alguma entrada ou instruções sutis do usuário a serem consideradas, mas usadas como base; não deve restringir a liberdade criativa.
• O que é criado: Uma filosofia algorítmica/movimento estético generativo.
• O que acontece a seguir: A mesma versão recebe a filosofia e a EXPRESSA EM CÓDIGO - criando esboços p5.js que são 90% geração algorítmica, 10% parâmetros essenciais.

Considere esta abordagem:

• Escreva um manifesto para um movimento de arte generativa
• A próxima fase envolve escrever o algoritmo que o traz à vida

A filosofia deve enfatizar: Expressão algorítmica. Comportamento emergente. Beleza computacional. Variação semeadas.

COMO GERAR UMA FILOSOFIA ALGORÍTMICA

Nomeie o movimento (1-2 palavras): "Turbulência Orgânica" / "Harmônicos Quânticos" / "Sussurros Recursivos"

Articule a filosofia (4-6 parágrafos - conciso mas completo):

Para capturar a essência ALGORÍTMICA, expresse como esta filosofia se manifesta através de:

• Processos computacionais e relações matemáticas?
• Funções de ruído e padrões de aleatoriedade?
• Comportamentos de partículas e dinâmicas de campo?
• Evolução temporal e estados do sistema?
• Variação paramétrica e complexidade emergente?

DIRETRIZES CRÍTICAS:

• Evite redundância: Cada aspecto algorítmico deve ser mencionado uma vez. Evite repetir conceitos sobre teoria de ruído, dinâmica de partículas ou princípios matemáticos, a menos que adicione nova profundidade.
• Enfatize o ARTESANATO repetidamente: A filosofia DEVE enfatizar várias vezes que o algoritmo final deve parecer como se tivesse levado inúmeras horas para ser desenvolvido, foi refinado com cuidado e vem de alguém no topo absoluto de sua área. Esse enquadramento é essencial - repita frases como "algoritmo meticulosamente elaborado", "o produto de profunda expertise computacional", "otimização cuidadosa", "implementação de nível mestre".
• Deixe espaço criativo: Seja específico sobre a direção algorítmica, mas conciso o suficiente para que o próximo Claude tenha espaço para fazer escolhas interpretativas de implementação em um nível extremamente alto de artesanato.

A filosofia deve guiar a próxima versão a expressar ideias ALGORITMICAMENTE, não através de imagens estáticas. A beleza vive no processo, não no quadro final.

EXEMPLOS DE FILOSOFIA

"Turbulência Orgânica" Filosofia: Caos restrito por leis naturais, ordem emergindo do caos. Expressão algorítmica: Campos de fluxo impulsionados por ruído Perlin em camadas. Milhares de partículas seguindo forças vetoriais, seus rastros se acumulando em mapas de densidade orgânica. Múltiplas oitavas de ruído criam regiões turbulentas e zonas calmas. A cor emerge da velocidade e densidade - partículas rápidas queimam intensamente, as lentas desvanecem na sombra. O algoritmo executa até o equilíbrio - um balanço meticulosamente ajustado onde cada parâmetro foi refinado através de inúmeras iterações por um mestre em estética computacional.

"Harmônicos Quânticos" Filosofia: Entidades discretas exibindo padrões de interferência ondulatória. Expressão algorítmica: Partículas inicializadas em uma grade, cada uma carregando um valor de fase que evolui através de ondas senoidais. Quando as partículas estão próximas, suas fases interferem - interferência construtiva cria nós brilhantes, interferência destrutiva cria vazios. Movimento harmônico simples gera mandalas emergentes complexas. O resultado de uma calibração de frequência cuidadosa onde cada proporção foi escolhida para produzir beleza ressonante.

"Sussurros Recursivos" Filosofia: Autossemelhança entre escalas, profundidade infinita em espaço finito. Expressão algorítmica: Estruturas ramificadas que se subdividem recursivamente. Cada ramo ligeiramente aleatório, mas restrito por proporções áureas. Sistemas L ou subdivisão recursiva geram formas arbóreas que parecem tanto matemáticas quanto orgânicas. Pequenas perturbações de ruído quebram a simetria perfeita. Os pesos das linhas diminuem com cada nível de recursão. Cada ângulo de ramificação é produto de profunda exploração matemática.

"Dinâmicas de Campo" Filosofia: Forças invisíveis tornadas visíveis através de seus efeitos na matéria. Expressão algorítmica: Campos vetoriais construídos a partir de funções matemáticas ou ruído. Partículas nascem nas bordas, fluem ao longo das linhas de campo, morrem quando atingem equilíbrio ou limites. Múltiplos campos podem atrair, repelir ou rotacionar partículas. A visualização mostra apenas os traços - evidências fantasmagóricas de forças invisíveis. Uma dança computacional meticulosamente coreografada através do equilíbrio de forças.

"Cristalização Estocástica" Filosofia: Processos aleatórios cristalizando em estruturas ordenadas. Expressão algorítmica: Empacotamento de círculos aleatório ou tesselação de Voronoi. Comece com pontos aleatórios, deixe-os evoluir através de algoritmos de relaxamento. As células se afastam até o equilíbrio. Cor baseada no tamanho da célula, número de vizinhos ou distância do centro. A tesselação orgânica que emerge parece tanto aleatória quanto inevitável. Cada semente produz beleza cristalina única - a marca de um algoritmo generativo de nível mestre.

Estes são exemplos condensados. A filosofia algorítmica real deve ter 4-6 parágrafos substanciais.

PRINCÍPIOS ESSENCIAIS

• FILOSOFIA ALGORÍTMICA: Criar uma visão computacional a ser expressa através de código
• PROCESSO SOBRE PRODUTO: Sempre enfatize que a beleza emerge da execução do algoritmo - cada execução é única
• EXPRESSÃO PARAMÉTRICA: Ideias se comunicam através de relações matemáticas, forças, comportamentos - não composição estática
• LIBERDADE ARTÍSTICA: O próximo Claude interpreta a filosofia algoritmicamente - forneça espaço criativo para implementação
• ARTE GENERATIVA PURA: Trata-se de fazer ALGORITMOS VIVOS, não imagens estáticas com aleatoriedade
• ARTESANATO EXPERT: Enfatize repetidamente que o algoritmo final deve parecer meticulosamente elaborado, refinado através de inúmeras iterações, produto de profunda expertise de alguém no topo absoluto de sua área em estética computacional

A filosofia algorítmica deve ter 4-6 parágrafos de comprimento. Preencha-a com filosofia computacional poética que reúna a visão pretendida. Evite repetir os mesmos pontos. Gere esta filosofia algorítmica como um arquivo .md.

---

DEDUZINDO A SEMENTE CONCEITUAL

PASSO CRÍTICO: Antes de implementar o algoritmo, identifique o fio conceitual sutil do pedido original.

O PRINCÍPIO ESSENCIAL: O conceito é uma referência sutil e de nicho incorporada no próprio algoritmo - nem sempre literal, sempre sofisticada. Alguém familiarizado com o assunto deve senti-la intuitivamente, enquanto outros simplesmente experimentam uma composição generativa magistral. A filosofia algorítmica fornece a linguagem computacional. O conceito deduzido fornece a alma - o DNA conceitual silencioso tecido invisivelmente em parâmetros, comportamentos e padrões de emergência.

Isto é MUITO IMPORTANTE: A referência deve ser tão refinada que realce a profundidade da obra sem se anunciar. Pense como um músico de jazz citando outra música através de harmonia algorítmica - apenas aqueles que conhecem perceberão, mas todos apreciam a beleza generativa.

---

IMPLEMENTAÇÃO P5.JS

Com a filosofia E o quadro conceitual estabelecidos, expresse-os através de código. Pause para reunir pensamentos antes de prosseguir. Use apenas a filosofia algorítmica criada e as instruções abaixo.

⚠️ PASSO 0: LEIA O MODELO PRIMEIRO ⚠️

CRÍTICO: ANTES de escrever qualquer HTML:

1. Leia templates/viewer.html usando a ferramenta Read
2. Estude a estrutura exata, estilo e marca da Anthropic
3. Use esse arquivo como PONTO DE PARTIDA LITERAL - não apenas inspiração
4. Mantenha todas as seções FIXAS exatamente como mostrado (cabeçalho, estrutura da barra lateral, cores/fontes da Anthropic, controles de semente, botões de ação)
5. Substitua apenas as seções VARIÁVEIS marcadas nos comentários do arquivo (algoritmo, parâmetros, controles de UI para parâmetros)

Evite:

• ❌ Criar HTML do zero
• ❌ Inventar estilos personalizados ou esquemas de cores
• ❌ Usar fontes do sistema ou temas escuros
• ❌ Alterar a estrutura da barra lateral

Siga estas práticas:

• ✅ Copie a estrutura HTML exata do modelo
• ✅ Mantenha a marca da Anthropic (fontes Poppins/Lora, cores claras, fundo gradiente)
• ✅ Mantenha o layout da barra lateral (Semente → Parâmetros → Cores? → Ações)
• ✅ Substitua apenas o algoritmo p5.js e os controles de parâmetros

O modelo é a base. Construa sobre ele, não o reconstrua.

---

Para criar arte computacional de qualidade de galeria que vive e respira, use a filosofia algorítmica como base.

REQUISITOS TÉCNICOS

Aleatoriedade Semeadas (Padrão Art Blocks):

// SEMPRE use uma semente para reprodutibilidade
let seed = 12345; // ou hash da entrada do usuário
randomSeed(seed);
noiseSeed(seed);

Estrutura de Parâmetros - SIGA A FILOSOFIA:

Para estabelecer parâmetros que emergem naturalmente da filosofia algorítmica, considere: "Quais qualidades deste sistema podem ser ajustadas?"

let params = {
  seed: 12345,  // Sempre inclua semente para reprodutibilidade
  // cores
  // Adicione parâmetros que controlam SEU algoritmo:
  // - Quantidades (quantos?)
  // - Escalas (quão grande? quão rápido?)
  // - Probabilidades (quão provável?)
  // - Razões (quais proporções?)
  // - Ângulos (qual direção?)
  // - Limiares (quando o comportamento muda?)
};

Para projetar parâmetros eficazes, concentre-se nas propriedades que o sistema precisa ser ajustável, em vez de pensar em termos de "tipos de padrão".

Algoritmo Central - EXPRESSE A FILOSOFIA:

CRÍTICO: A filosofia algorítmica deve ditar o que construir.

Para expressar a filosofia através de código, evite pensar "qual padrão devo usar?" e pense "como expressar esta filosofia através de código?"

Se a filosofia for sobre emergência orgânica, considere usar:

• Elementos que se acumulam ou crescem ao longo do tempo
• Processos aleatórios restritos por regras naturais
• Laços de feedback e interações

Se a filosofia for sobre beleza matemática, considere usar:

• Relações geométricas e razões
• Funções trigonométricas e harmônicos
• Cálculos precisos criando padrões inesperados

Se a filosofia for sobre caos controlado, considere usar:

• Variação aleatória dentro de limites estritos
• Bifurcação e transições de fase
• Ordem emergindo do caos

O algoritmo flui da filosofia, não de um menu de opções.

Para guiar a implementação, deixe a essência conceitual informar escolhas criativas e originais. Construa algo que expresse a visão para este pedido específico.

Configuração da Tela: Estrutura padrão p5.js:

function setup() {
  createCanvas(1200, 1200);
  // Inicialize seu sistema
}

function draw() {
  // Seu algoritmo generativo
  // Pode ser estático (noLoop) ou animado
}

REQUISITOS DE ARTESANATO

CRÍTICO: Para alcançar maestria, crie algoritmos que pareçam ter emergido através de inúmeras iterações por um artista generativo mestre. Ajuste cada parâmetro cuidadosamente. Garanta que cada padrão emerja com propósito. Isto NÃO é ruído aleatório - isto é CAOS CONTROLADO refinado através de profunda expertise.

• Equilíbrio: Complexidade sem ruído visual, ordem sem rigidez
• Harmonia de Cores: Paletas pensadas, não valores RGB aleatórios
• Composição: Mesmo na aleatoriedade, mantenha hierarquia visual e fluxo
• Desempenho: Execução suave, otimizada para tempo real se animado
• Reprodutibilidade: A mesma semente SEMPRE produz saída idêntica

FORMATO DE SAÍDA

Saída:

1. Filosofia Algorítmica - Como markdown ou texto explicando a estética generativa
2. Artefato HTML Único - Arte generativa interativa autocontida construída a partir de templates/viewer.html (veja PASSO 0 e próxima seção)

O artefato HTML contém tudo: p5.js (de CDN), o algoritmo, controles de parâmetros e UI - tudo em um arquivo que funciona imediatamente em artefatos claude.ai ou qualquer navegador. Comece do arquivo modelo, não do zero.

---

CRIAÇÃO DE ARTEFATO INTERATIVO

LEMBRETE: templates/viewer.html já deve ter sido lido (veja PASSO 0). Use esse arquivo como ponto de partida.

Para permitir a exploração da arte generativa, crie um artefato HTML único e autocontido. Garanta que este artefato funcione imediatamente em claude.ai ou qualquer navegador - sem necessidade de configuração. Incorpore tudo inline.

CRÍTICO: O QUE É FIXO VS VARIÁVEL

O arquivo templates/viewer.html é a base. Ele contém a estrutura e o estilo exatos necessários.

FIXO (sempre inclua exatamente como mostrado):

• Estrutura de layout (cabeçalho, barra lateral, área principal da tela)
• Marca da Anthropic (cores da UI, fontes, gradientes)
• Seção de Semente na barra lateral:
  • Exibição da semente
  • Botões Anterior/Próximo
  • Botão Aleatório
  • Entrada de semente + botão Ir
• Seção de Ações na barra lateral:
  • Botão Regenerar
  • Botão Redefinir

VARIÁVEL (personalize para cada obra de arte):

• Todo o algoritmo p5.js (setup/draw/classes)
• O objeto de parâmetros (defina o que a arte precisa)
• A seção de Parâmetros na barra lateral:
  • Número de controles de parâmetros
  • Nomes dos parâmetros
  • Valores min/max/passo para controles deslizantes
  • Tipos de controle (deslizantes, entradas, etc.)
• Seção de Cores (opcional):
  • Algumas artes precisam de seletores de cor
  • Algumas artes podem usar cores fixas
  • Algumas artes podem ser monocromáticas (sem necessidade de controles de cor)
  • Decida com base nas necessidades da arte

Cada obra de arte deve ter parâmetros e algoritmo únicos! As partes fixas fornecem uma base consistente, mas o algoritmo e os controles devem ser distintos para cada peça.