Campo de Estrelas (Starfield)

Um efeito visual interativo onde estrelas são criadas na posição do cursor do mouse e crescem enquanto se movem, criando um campo de estrelas dinâmico e colorido.

Algoritmo Principal

O algoritmo responde ao movimento do mouse:

1. Detecção: Detecta a posição do mouse
2. Criação: Cria múltiplas estrelas na posição do cursor
3. Crescimento: Cada estrela cresce até um tamanho máximo
4. Movimento: Estrelas se movem com movimento oscilatório (seno/cosseno)
5. Desenho: Desenha estrelas com número variável de pontas (3-12)

Equações Implementadas

No código:

// Criação na posição do mouse
x = mouseX
y = mouseY

// Movimento oscilatório
x += directionX + sin(angle)
y += directionY + cos(angle)
angle += 0.1

// Crescimento
size += 0.1
if (size < maxSize) {
  drawStar(x, y, spikes, outerRadius, innerRadius)
}

As estrelas são desenhadas usando coordenadas polares para criar as pontas.

Complexidade de Compreensão

Nível: Intermediário

• Conceitos necessários: Eventos do mouse, coordenadas polares, funções trigonométricas
• Matemática: Trigonometria, coordenadas polares, geometria
• Programação: Event listeners, animação, gráficos vetoriais

Referências e Recursos para Estudo

Artigos e Documentação

• MDN - Mouse Events - Eventos do mouse
• MDN - Canvas Animation - Animações
• Wikipedia - Star Polygon - Polígonos estrela

Tutoriais e Código

• The Coding Train - Mouse Interaction - Interatividade
• Processing Examples - Mouse - Exemplos
• MDN - Canvas Tutorial - Tutorial canvas

Aprofundamento Matemático

• Interactive Computer Graphics - Angel - Gráficos interativos
• Real-Time Rendering - Renderização

Visualizações Interativas

• Interactive Art Examples - Exemplos interativos
• CodePen - Starfield - Exemplos no CodePen