-
-
The agent flags a note as four tasks in one, you answer on the note, it reports back when done.
-
Claim pills show what the agent is working on right now. Badges show which notes it wrote.
-
Every board merged into one view, with the agent's work visible across all of them.
Inspiration
Adding MCP to Pinnwall was already on my list. I use it as my own sticky-note board and kept wanting an assistant that could tidy it up, but not enough to build a whole server with its own auth just for that. I hadn't heard of WebMCP before this hackathon. It turned out to be the shape I actually needed, so I finally built it.
What it does
Pinnwall is a sticky-note board with no database. With WebMCP, an agent works it with you.
It has 13 tools: read the board, create and move notes, add columns, switch the board you're looking at. It can also claim a note, so a marker appears before it starts, and comment on one to say what it did or ask you something. You answer on the note. Anything the agent writes gets badged, so you can always tell who did what.
Why WebMCP fits this
A board is shared state that two people edit. Before, I had two bad options: let an agent click through the UI from screenshots, which is slow and breaks every time I touch the CSS, or stand up an MCP server with its own auth and deploy, just so something could edit a board I'm already signed into.
WebMCP skips both. The tools run in the page, on my session. The agent can do what I can do and nothing more, there's no key to leak, and access ends when I close the tab.
Concretely: one note on my board said "ship pricing page, update the FAQ, brief support, schedule the newsletter." Splitting that by hand is four notes typed, four drags, then delete the original. Now it's one sentence, and I watch the agent claim it, split it, and tell me what it did. Then I answer it on the note. That last part is the bit I didn't expect to care about — the conversation stays on the work instead of disappearing into a chat window.
How I built it
Node, Express, vanilla JS. No build step, no new dependencies.
All the tools sit in one file. Each is registered with document.modelContext.registerTool and calls the same fetch helper the buttons call, so the agent rides my session cookie and hits the same CSRF check and validation as a click.
They take names, not ids. move_note({ note: "brief support", column: "Done" }) finds the note from a piece of its text and tells the agent what it matched if there's more than one.
Pinnwall itself predates the hackathon. The agent side is all new. WEBMCP.md in the repo has the split.
Challenges I ran into
Mirroring my REST API one to one gave me tools the agent used badly. It doesn't have ids and it thinks in names, so half its calls missed. Making every tool resolve by name fixed more than anything I did on the server.
The board reloads itself after the agent writes. The first version did that even while I was typing in a note, and wiped what I'd written. Now it waits until I stop.
Accomplishments that I'm proud of
No new dependencies, no API key, no second service. You sign in normally and the agent can do what you can do.
It's also additive. Existing Pinnwall installs run unchanged and old notes work without a migration.
What I learned
The useful part of WebMCP is the session, not the protocol. Running in the page turns authorisation from the hardest part into a non-problem.
And you have to build for two actors from the start. Almost every bug worth fixing came from assuming only one of us was touching the board at a time.
Log in or sign up for Devpost to join the conversation.