Criar pop-up assustador (para jogo, site de Halloween ou pegadinha) exige mais que jumpscare. Aqui está framework responsável:
- Gatilho – Clique, profundidade de scroll, timer (ex.: 10s ocioso), intenção de saída. Evite auto-on-load.
- Visuais – Paleta escura, alto contraste, imagem perturbadora (rosto distorcido, sombra, glitch). Animações CSS: shake, zoom, flicker de opacidade.
- Texto – Curto, sinistro. "Não olhe para trás." "Você não está sozinho."
- Áudio – Rangido, sussurro, estático, batida cardíaca. Deve ser user-initiated ou muted by default (política autoplay do browser).
- Interação – Botão fechar (claro), "Não mostrar de novo" (localStorage), ou mini-game (clique no fantasma).
- Teste – Desktop, mobile, reduced motion, screen readers. Garanta focus trap, ESC para fechar.
- Ética – Sem flashes risco convulsão (>3 Hz). Avisse se intenso. Nunca em sites bancários, médicos, gov, ou infantis. Opt-in preferido.
Stack Exemplo
- HTML/CSS/JS (vanilla ou React/Vue).
- Animate.css ou GSAP para movimento.
- Howler.js para áudio.
- localStorage para persistência.
Assuste responsavelmente. O melhor horror é antecipado, não forçado.
