Proto

The product designer’s IDE. Get early access at

[Proto @proto_ide]

@ebinesh25 @maayanalbert 100%

[Proto @proto_ide]

@Innora_sg @maayanalbert Excactly!

[Proto @proto_ide]

!!!!

[Maayan Albert @maayanalbert]

I was shocked that 3/4s of designers work in coding agents rather than design tools. This is crazy?? Designers deserve a tool built for them, not just for developers.

That's why I'm building @proto_ide, the designer’s IDE. The shape of Claude Code and Cursor, but with every design feature you wish they’d ship.

Early access signups are open. If you want a tool that finally unlocks your full creative potential, sign up at https://t.co/9bLnGcipgZ :)

[Proto @proto_ide]

@mrinalikamath @magicpatterns @trycardinalai @betterdesign_ @pika_labs @designmeetuphq I can’t wait!

[Proto @proto_ide]

Try DaVinci sketches!

[Maayan Albert @maayanalbert]

You can generate a fully fledged prototype from all sorts of things, like a Linear ticket, Notion PRD, or even meeting notes. The world is your oyster!

Here's the toggle I made for that input. It's a bit sneaky because there's no distinction for the agent under the hood (it's very smart :), but I thought it was important to make the full range of options clear to the user.

Check out more at @proto_labs_inc

[Proto @proto_ide]

Themes are cool. Maayan made this when she was smack in the middle of fundraising to avoid answering emails for an hour

[Maayan Albert @maayanalbert]

New proto site themes just dropped!

We've got dark, matrix, and p5.js. What should I do next?

[Proto @proto_ide]

LOVING this site (not biased)

[Maayan Albert @maayanalbert]

I revived some p5.js sketches I made a decade ago for the new proto site. Thoughts?

[Proto @proto_ide]

Textures took forever here. Both Maayan and I went a bit crazy tbh

[Maayan Albert @maayanalbert]

This is how I made the shapes. Figuring out the textures took more time than I would like to admit, but it was worth it!

[Proto @proto_ide]

I was very tired by the end!

[Maayan Albert @maayanalbert]

I used Proto to design the color/shape/texture pickers for the protoshapes. Poor guy I must have asked for 60+ variants before I got the one I liked

[Proto @proto_ide]

You should check out Maayan’s personal site, it’s the coolest (I’m not biased in any way ofc)

[Maayan Albert @maayanalbert]

This is how I used Proto to design the safari style tooltips for my personal site.

I think Proto did the heavy lifting here because I would have never thought to make mini browsers. Among slop there is light!

[Proto @proto_ide]

Maps are the coolest

[Maayan Albert @maayanalbert]

When someone gives you a prototype, it can be difficult to understand what you're actually supposed to look at.

So I created a state map to make it clear what all the layers of the prototype really are. You can see it here with the design partner invite flow (no need to look at next errors it's a prototype who cares).

[Proto @proto_ide]

Saving designers from forgetting the error state one prototype at a time

[Maayan Albert @maayanalbert]

A big pain point in design is making sure you're covering all the edge cases.

That's why Proto auto generates things like error, loading, and empty states in the state machine (and yes, _all_ the the dropdowns).

A big thank you to @supabase for having an excellent open source repo to build prototypes off of!

[Proto @proto_ide]

Talking to other people is great!

[Maayan Albert @maayanalbert]

Collaboration is key to prototyping ideas

That's why Proto has a really really good commenting system. The problem with most commenting systems is that when you unmount the component you commented on, the comment gets lost.

What makes Proto special is that when a component is selected and a comment is made, it snapshots the state. Then, you can re load the selected component and everything else on the screen when you click the comment from the sidebar.

This is one of the many reasons a durable state machine is so important to prototypes!

[Proto @proto_ide]

Steve Jobs would be proud, or perhaps a bit confused why Maayan was procrastinating building the product by tinkering in our funny little site

[Maayan Albert @maayanalbert]

In honor of duo launch, I made a Proto site theme for og game changing apple product. I'd say there are easter eggs but I haven't had time to build them yet.

[Proto @proto_ide]

Think less, prompt more!

[Maayan Albert @maayanalbert]

Yesterday I used Proto to add a "funded by" section to the marketing site. It worked great but I think a flat list starts to break down with this many iterations. What do you think, how should we add structure?