Em 2012, Bret Victor fez uma apresentação profundamente inspiradora chamada “Inventing on Principle”. As ideias do Bret sobre imediatismo em ferramentas criativas me lembraram de um artigo que escrevi em 2009 sobre atingir a velocidade do pensamento — a ideia de que as melhores ferramentas colapsam a distância entre intenção e resultado. No meio da apresentação, ele demonstra um app de animação para iPad onde performa uma animação em tempo real — apenas arrasta uma camada com o dedo enquanto a timeline toca, e o movimento é capturado exatamente como ele fez. Sem keyframes. Sem tweens. A ferramenta saiu do caminho e deixou ele simplesmente fazer a coisa.
Bret nunca lançou esse app, e por mais de uma década eu quis que algo assim existisse.
Recentemente, minha esposa — uma cirurgiã — começou a criar vídeos didáticos no estilo Osmosis para o Instagram. Eu ajudava às vezes com a produção, mas as ferramentas sempre tinham mais atrito do que deveriam. Precisávamos de uma forma leve e integrada de animar diferentes assets e produzir um vídeo explicativo completo sem um pipeline de pós-produção complexo. Deveria ser tão simples quanto explicar um conceito em um guardanapo.
Muy é minha resposta para as duas coisas. O nome vem de Eadweard Muybridge, e é uma ferramenta de animação onde você grava animações performando-as, não especificando-as.
Princípios de produto como restrições
Antes de começar a construir, defini cinco princípios para a primeira versão. A ideia era que funcionassem como restrições, diferenciadores e um checklist de validação.
- Baseado na web. As APIs web modernas chegaram a um ponto em que um PWA pode entregar uma UX indistinguível de um app nativo. O Figma é a prova disso. Rodar no navegador significava zero fricção de instalação, acesso em qualquer dispositivo e toda a flexibilidade da plataforma web.
- Otimizado para iPad, mas usável no desktop. Ser web-based tornou isso quase automático. Queria respeitar a forma como as pessoas criam conteúdo hoje — sem estar presas a uma estação de trabalho.
- Sem IA. Já existe slop gerado por IA suficiente no mundo. O Muy é deliberadamente sobre expressão humana. O objetivo é ajudar as pessoas a desbloquear intenção sem assistência de IA. Pode ser que eu adicione recursos de IA no futuro, mas a ferramenta principal é para autoria humana.
- Sem back-end. Tudo fica no lado do cliente. Sem autenticação, sem contas — você simplesmente abre a URL e usa, como o Excalidraw. Mais simples, mais barato, e dá ao usuário uma sensação de controle e propriedade.
- Pronto para produção. A primeira versão precisa produzir saída real e utilizável para uma ampla gama de aplicações — não apenas um demo. Isso significa exportar de vídeo de verdade e a capacidade de compor uma animação inteira do zero.
Construindo com agentes
A primeira versão levou duas semanas, após alguns ciclos de iteração. Às vezes projetei funcionalidades no Figma primeiro, às vezes fui direto para o código. Foi também um exercício deliberado de integrar agentic coding ao fluxo de trabalho de design.
Usei bastante o Plan Mode para funcionalidades que exigiam um planejamento mais cuidadoso antes de implementar. Usei modelos diferentes para tarefas diferentes: modelos mais parrudos como Claude Opus para raciocínio complexo e decisões de arquitetura, e modelos locais mais leves para geração mais mecânica, para não gastar o orçamento de tokens desnecessariamente. Usar um framework de UI como o shadcn tornou muita coisa mais rápida e fácil, enquanto ainda deixava espaço significativo para customização — especialmente nos widgets de propriedade e no componente de scrubber.
Componente de scrubber, como input numérico compacto
O processo reforçou algo que eu suspeitava mas não tinha internalizado completamente: o valor do agentic coding não é só velocidade. É a capacidade de iterar rápido, e isso muda como você explora um espaço de problema. Nesse caso, eu era usuário, junto com alguns amigos, então os ciclos de feedback eram curtos.
A mecânica principal
O paradigma de animação do Muy é a gravação por performance. Você seleciona camada(s), aperta Play e manipula suas propriedades enquanto a animação toca. Em cada frame que passa, o novo valor da propriedade é gravado. Quando você para, a animação reflete exatamente o que você fez.
Em vez de planejar keyframes e curvas de interpolação, você simplesmente mostra para a ferramenta o que quer. É tipo fazer um teatro de marionete, com um pouco mais de controle. Estamos prontos para o vibe animating? Desculpe ter sugerido isso 😬️
Além da posição das camadas, você também pode performar rotação, escala, transparência e uma revelação caractere a caractere em textos ou em traços vetoriais—tudo usando o mesmo modelo de gravar enquanto toca. As camadas também possuem controles de sensitividade, pra permitir manipulações mais finas ou reações em diferentes proporções ao manipular várias camadas de uma vez. Assim dá pra simular efeitos de câmera com paralaxe, por exemplo.
O desafio de design é tornar a ferramenta invisível o suficiente para que o usuário fique em flow para conseguir realizar suas animações.
Modelo do sistema solar, usando a sensibilidade de camada para simular diferentes períodos orbitais
Experimente
A versão hospedada está em muy.video. O código é open-source em github.com/jpfaraco/muy.
Projetos salvos ficam armazenados localmente no IndexedDB e podem ser exportados como arquivos .muy auto-contidos com assets em base64 embutidos. O app instala como PWA e roda em modo standalone, indistinguível de um app nativo.
Eu ainda tenho algumas ideias e espero continuar evoluindo o projeto. Espero também que outras pessoas o achem útil para criar vídeos legais.