Show HN: Convert a Prompt or Image to User Interface, Using a React Playground
getaprototype.comHey HN!
About 3 months ago, I posted my first rough version of Prototyper. After talking to a fair amount of users, I'm back with a real V1 :).
Update: funding this out of pocket, so you can make 5 edits to an example. Hope you understand! The playground is unlimited to try though!
Short background: I love prototyping in code. Whenever I start on a new project, I never pull up Figma, but drive straight into a small jsx file to create some live mock ups. I'm hoping to bring that 'builders' feeling back. There is a great video from Garry Tan, about Raphael Schaads workflow: https://www.youtube.com/watch?v=2MrNSjJFBBI. That's what I'm going for.
The architecture has changed significantly from 80 days ago: - it now features a real react playground (try interacting with the hacker news example!) -> that means I also can finally support (public) APIs and so on :) - now with a design system (finally works with shadcn, but gonna expand that with more components & different ui component libraries) - Code quality is significantly higher, due to improved pipeline. -> I now use 'download code' as a proxy for code quality. Allowing me to assemble a weighted database of examples.
Very curious what your take on this is. Should it come before/after Figma? What do you think about an infinite canvas to rely on multimodal edits? And so on.
My mission is to create a shared prototyping environment for startups.
Lmk! NOTE: To try it, select an example to edit using the AI. Funding it out of pocket, so sadly no infinite amount of ai credits for PLG :'). NOTE (2): Invite team members is optional :) - just skip it to get started! You have reached the maximum number of changes allowed. Please subscribe to make more changes. I've now noted it in the first post! No VC backed product, just a solo founder. Trying to keep free AI usage somewhat limited :). I bailed when setup demanded I give personal info of teammates in order to be being allowed to try the product. > I now use 'download code' as a proxy for code quality What could possibly go wrong? :) I wish you good luck with the project. Hey Chris, The invite team members is optional. Not required. What was not clear enough about that in the interface? Really try to position it as a team first tool. > The invite team members is optional. Not required. What was not clear enough about that in the interface? "[!] Please fill in this field" blocking each Continue button press. And the button to delete the member item is disabled. Now I find a very shy "Skip" link underneath the on-screen keyboard. Why not allow Continue without members? not free ;( do yall have a discord server. No discord yet. Can set it up! Would actually be cool. And as mentioned - try the examples :). sure Try examples, worked for me!