Type Piano is my Framer hackathon entry: an interactive playground where music becomes typography. Instead of creating sound for the sake of sound, every key press generates visual compositions that evolve into unique typographic posters.

Why I built it

Most creative tools separate exploration from output. You play music in one place and design in another. I wanted to create something that turns playful experimentation directly into a visual artifact you can keep.

What's inside

Piano keyboard that generates typography through interaction
Multiple visual themes, from ambient and cinematic to horror-inspired styles
Multi-language support for different writing systems
Real-time poster generation based on your inputs
Export-ready outputs that can be saved and shared

What agents helped with

Framer agents helped refine the interaction layer, improve the poster layouts, and iterate on how typography responds to user input. They were especially useful for testing different visual systems, simplifying controls, and making the experience work smoothly across screen sizes.

What surprised me most was how quickly agents could help explore creative directions. Instead of spending hours rebuilding layouts, I could focus on the interaction itself and keep experimenting with how music, language, and typography connect.

Try it: pick a theme, play a few notes, and watch a poster emerge from your performance.

Built with Framer 3.0 AI agents.

Suggested for you

Suggested for you

Suggested for you