Compétences algorithmic-art
🎨

algorithmic-art

Sûr 🌐 Accès réseau📁 Accès au système de fichiers⚙️ Commandes externes

Criar Arte Generativa com p5.js

Également disponible depuis: Cam10001110101,davila7,sickn33,Azeem-2,ZhanlinCui,ArtemisAI,anthropics

Transforme conceitos matemáticos em arte visual deslumbrante usando técnicas algorítmicas. Esta habilidade fornece modelos guiados para criar obras de arte generativas reproduzíveis com aleatoriedade semeada e controles interativos.

Prend en charge: Claude Codex Code(CC)
📊 70 Adéquat
1

Télécharger le ZIP du skill

2

Importer dans Claude

Allez dans Paramètres → Capacités → Skills → Importer un skill

3

Activez et commencez à utiliser

Tester

Utilisation de "algorithmic-art". Crie uma peça de arte generativa chamada 'Poeira Cósmica' com padrões de partículas em espiral

Résultat attendu:

  • Arquivo HTML com sketch p5.js incorporado
  • Controles na barra lateral para contagem de partículas, velocidade e modo de cor
  • Aleatoriedade semeada garante padrões reproduzíveis
  • Botões de download para exportação PNG e SVG
  • Canvas responsivo que se adapta ao tamanho da janela

Utilisation de "algorithmic-art". Gere um campo de fluxo baseado em ruído que cria padrões orgânicos semelhantes a rios

Résultat attendu:

  • Cálculo de campo de ruído Perlin mapeado para ângulos de partículas
  • Renderização de rastro de partículas em tempo real
  • Controles na barra lateral para escala de ruído e força do fluxo
  • Animação suave usando requestAnimationFrame
  • Funcionalidade de salvar obra de arte para exportação em alta resolução

Audit de sécurité

Sûr
v5 • 1/17/2026

This skill contains only documentation and templates for creating generative art with p5.js. No executable code, network calls, or file operations exist. Static findings are false positives from misidentified markdown syntax and metadata references.

2
Fichiers analysés
376
Lignes analysées
3
résultats
5
Total des audits

Score de qualité

38
Architecture
100
Maintenabilité
87
Contenu
21
Communauté
100
Sécurité
91
Conformité aux spécifications

Ce que vous pouvez construire

Criar Obras de Arte Únicas

Gerar peças visuais exclusivas usando algoritmos matemáticos e aleatoriedade semeada para reprodutibilidade.

Construir Visualizações

Criar visualizações de dados interativas e instalações de arte generativa com parâmetros personalizáveis.

Prototipar Padrões

Prototipar rapidamente padrões procedurais para têxteis, papéis de parede ou materiais de branding.

Essayez ces prompts

Padrão de Fluxo Básico
Crie uma peça de arte generativa usando p5.js com padrões de partículas fluidas. Inclua aleatoriedade semeada para reprodutibilidade e uma barra lateral com controles de velocidade e densidade.
Campos de Fluxo Orgânicos
Gere um visualizador HTML com visualização de campo de ruído Perlin. As partículas devem seguir o fluxo de ruído criando padrões de turbulência orgânica. Adicione controles para escala de ruído e contagem de partículas.
Padrões Geométricos
Crie arte algorítmica baseada em sequências de Fibonacci e proporções áureas. Implemente padrões geométricos recursivos com gradientes de cores e controles de complexidade.
Simulação Interativa
Construa um sistema complexo de partículas com forças de atração e repulsão, efeitos de rastro e interação com o mouse. Inclua múltiplas fontes de emissão e controles de parâmetros físicos.

Bonnes pratiques

  • Sempre use funções aleatórias semeadas (randomSeed, noiseSeed) para obras de arte reproduzíveis
  • Implemente windowResized() para comportamento de canvas responsivo em diferentes tamanhos de tela
  • Use requestAnimationFrame para animações suaves a 60fps sem bloqueios

Éviter

  • Usar Math.random() em vez de funções aleatórias semeadas quebra a reprodutibilidade
  • Criar loops infinitos sem controle adequado de taxa de quadros causa travamento do navegador
  • Codificar dimensões de canvas fixas impede comportamento responsivo em diferentes telas

Foire aux questions

Isso é compatível com todos os navegadores modernos?
Sim, p5.js funciona em todos os navegadores modernos. O HTML gerado inclui links CDN para a biblioteca.
Qual é o tamanho máximo de canvas suportado?
O tamanho do canvas é limitado pela memória do navegador. Para melhor desempenho, mantenha as dimensões abaixo de 2000x2000 pixels.
Posso incorporar isso em meu projeto web existente?
Sim, o HTML gerado é autônomo e pode ser incorporado ou modificado para integração.
Os dados da minha obra de arte são privados e seguros?
Toda a geração acontece localmente em seu navegador. Nenhum dado de obra de arte é enviado para servidores externos.
Por que minha animação está rodando lentamente?
Reduza a contagem de partículas ou complexidade. Use requestAnimationFrame e otimize seus loops de desenho.
Como isso se compara ao Processing?
p5.js é a versão JavaScript do Processing, projetada para navegadores web com sintaxe e conceitos semelhantes.

Détails du développeur

Structure de fichiers

📄 SKILL.md