Esses dias eu acordei meio no automático, daqueles dias em que o corpo levanta antes da cabeça. Fui pra cozinha, apertei o botão da cafeteira e fiquei ali, parado, ouvindo. E pela primeira vez em muito tempo eu realmente escutei aquilo: o motorzinho zunindo num tom grave e constante, a água borbulhando por cima num agudo irregular, e no fim aquele chiado do vapor escapando. Por algum motivo meu cérebro ainda sonolento pensou: "isso aqui é quase um acorde".
Saí pra varanda com a xícara e o jogo continuou. A buzina de um carro lá embaixo — um nó bem definido, dava pra cantar. O bip do micro-ondas do vizinho, sempre na mesma nota. O teclado do meu notebook, que tem um clique seco e meio percussivo. E aí veio a pergunta que me fez largar o café e abrir o editor: e se cada som do meu dia fosse uma nota? E se eu pudesse fazer som do nada, sem instrumento nenhum, só com código?
Spoiler: o navegador já é um estúdio
A coisa mais maluca dessa história é que você não precisa instalar absolutamente nada. O navegador que você está usando agora tem, embutida, uma das ferramentas de áudio mais poderosas que já vi: a Web Audio API. Ela não toca um arquivo de música — ela gera som, amostra por amostra, em tempo real. É a diferença entre tocar um disco e ter uma banda dentro da máquina.
E quando eu digo "do nada", é do nada mesmo. Som, no fim das contas, é só ar vibrando. Na tela, isso vira números: milhares de vezes por segundo, o computador decide a posição do alto-falante. Uma senoide que sobe e desce 440 vezes por segundo é o famoso "lá" da orquestra. É só matemática virando pressão no seu tímpano.
O bloco de Lego do som: o oscilador
O coração de tudo é o oscilador (OscillatorNode). Pensa nele como uma corda de violão que nunca para de vibrar. Você diz a frequência (em hertz, que é "vibrações por segundo") e o formato da onda, e ele gera o tom puro. A frequência é o que a gente percebe como altura da nota: grave embaixo, agudo em cima.
O formato da onda é o que muda o timbre — o "sabor" do som. Esses são os quatro clássicos:
- Senoide — o tom mais puro e limpo que existe, sem tempero nenhum. Soa como um apito suave ou um diapasão.
- Quadrada — oca e "retrô", a cara dos videogames de 8 bits. É o som de um Game Boy.
- Triângulo — parecida com a senoide, mas com um corpinho a mais, um zumbido macio.
- Dente-de-serra — a mais áspera e cheia, recheada de harmônicos. É a base da maioria dos sintetizadores que você ouve em música eletrônica.
Por que um botão "iniciar áudio"?
Tem um detalhe técnico que parece chato mas é, na real, uma gentileza. Os navegadores proíbem que uma página comece a fazer barulho sozinha — imagina abrir um site e levar um susto sonoro. Por isso o áudio só "acorda" depois do primeiro toque ou clique seu. É o chamado gesture gate. No sintetizador aqui embaixo, é exatamente pra isso que serve o botão de ligar: ele desbloqueia o estúdio. Pequena curiosidade, grande alívio pros ouvidos do mundo.
Duas curiosidades que me deixaram de queixo caído
1. O envelope ADSR. Quando você toca uma tecla de piano, o som não aparece e some na hora — ele nasce, brilha e morre num desenho específico. Esse desenho tem nome: ADSR (Attack, Decay, Sustain, Release). Ataque é quão rápido o som surge; um órgão tem ataque instantâneo, um violino tem ataque lento. É um único conceito que separa um "bip" robótico de algo que soa como música de verdade. No synth abaixo, mexe nesses sliders e você vai sentir a diferença na hora.
2. A escala pentatônica nunca erra. Existe um conjunto de cinco notas — a escala pentatônica — em que qualquer combinação que você tocar soa, no mínimo, agradável. É quase impossível fazer feio. Não é magia: é que essas notas não têm os intervalos "tensos" que causam dissonância. Por isso o modo generativo do meu synth toca notas aleatórias nessa escala e mesmo assim parece que tem um músico ali. O acaso, com as regras certas, vira beleza.
Minha opinião honesta
Eu trabalho com web faz tempo e ainda assim a Web Audio API me surpreende. A gente associa "navegador" a botão, formulário, tabela — coisas visuais. Mas tem todo um universo sonoro ali, de graça, sem dependência nenhuma. Dava pra resolver isso com a biblioteca Tone.js, que é excelente, mas pra entender o que está acontecendo eu prefiro mil vezes montar na mão. É como aprender a dirigir num carro com câmbio manual: dá mais trabalho, mas você sente a máquina.
E tem um lado meio filosófico nisso tudo: a matéria-prima do som não é nenhum equipamento caro — é só vibração organizada. A cafeteira já fazia música naquela manhã; eu só precisei de um botão pra perceber.
Chega de papo, faz barulho 👇
Montei um mini-sintetizador completo, vanilla, que roda aqui na página. Toque as teclas com o mouse, com o dedo ou pelo teclado do PC (as letras A a J). Troque a forma de onda, mexa no envelope e no filtro, e veja a onda desenhada ao vivo. Se quiser só relaxar, liga o modo generativo e deixa ele tocar sozinho na pentatônica. Aperta o botão de ligar e diverte-se.