Loading video...

Video Failed to Load

Go Home

typically you've had to choose: prototype with code, or prototype in an editor. why not both? we created a new format for writing React components that lets us direct edit real UI, while keeping it interactive...

nateparrott's profile picture

nate parrott

60,500 subscribers

56,088 views • 2 months ago •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.
1:01

we released our react package build an ai chat w/ interactive components in a few lines of code. add it to your app with: npx tambo full-send we support: - streaming for both messages and components - message history and message threads - state manage for generated components - suggested actions based on available components - component library that uses the react package the react package is open-source. server package will be open-sourced later this year.

Michael Magán

65,473 views • 1 year ago

What if you could watch a UI generate in real-time as you work with AI? Now you can, with Real Time UI in MagicPath. This is extremely hard to do, especially for interactive React components with states. That’s why you don’t see this anywhere else. This is a first.
0:33

What if you could watch a UI generate in real-time as you work with AI? Now you can, with Real Time UI in MagicPath. This is extremely hard to do, especially for interactive React components with states. That’s why you don’t see this anywhere else. This is a first.

Pietro Schirano

51,983 views • 1 year ago

Markdown is the new programming language. But writing markdown sucks. So I created a beautiful app to write and edit markdown files with agents, locally. It's called Skribe, an open-source, beautiful markdown editor and you can try it for free today. Just: - Open your codebase - Only markdown files are shown - Edit and write markdown alongside Claude Code or Codex within a beautiful editor
1:05

Markdown is the new programming language. But writing markdown sucks. So I created a beautiful app to write and edit markdown files with agents, locally. It's called Skribe, an open-source, beautiful markdown editor and you can try it for free today. Just: - Open your codebase - Only markdown files are shown - Edit and write markdown alongside Claude Code or Codex within a beautiful editor

Chris Ashby

11,258 views • 2 months ago

Anthropic released interactive apps for Claude. Interactive apps can respond with interactive UI Widgets to enable additional usecases. "MCP Apps is a new extension to MCP that lets any MCP server deliver an interactive interface within any supporting AI product"
0:53

Anthropic released interactive apps for Claude. Interactive apps can respond with interactive UI Widgets to enable additional usecases. "MCP Apps is a new extension to MCP that lets any MCP server deliver an interactive interface within any supporting AI product"

🚨 AI News | TestingCatalog

52,554 views • 7 months ago

In MagicPath every component is a conversation. Edit and refine, either manually or with AI. Design is the art of keeping good decisions. MagicPath lets you copy and paste interactive components across the canvas to explore and perfect your ideas.
1:00

In MagicPath every component is a conversation. Edit and refine, either manually or with AI. Design is the art of keeping good decisions. MagicPath lets you copy and paste interactive components across the canvas to explore and perfect your ideas.

Pietro Schirano

53,164 views • 1 year ago

New sidebar coming soon to Quiver. I designed this working prototype, then built it in actual code and sent real PRs for engineering to polish and ship. I'm not a developer. I've NEVER done that in my entire career. Incredible time to be a product designer.
0:20

New sidebar coming soon to Quiver. I designed this working prototype, then built it in actual code and sent real PRs for engineering to polish and ship. I'm not a developer. I've NEVER done that in my entire career. Incredible time to be a product designer.

DANN©

21,234 views • 21 days ago

🗒️ Kotlin Notebook, a new interactive environment for JVM developers, comes bundled in IntelliJ IDEA 2025.1 – both Community Edition and Ultimate. It is also coming soon to Android Studio. Experiment, prototype, visualize data, and more!
0:43

🗒️ Kotlin Notebook, a new interactive environment for JVM developers, comes bundled in IntelliJ IDEA 2025.1 – both Community Edition and Ultimate. It is also coming soon to Android Studio. Experiment, prototype, visualize data, and more!

Kotlin by JetBrains

10,838 views • 1 year ago

Nintendo had a plan to build a CD-ROM adapter for SuperFamicom. Sony suggested it and it almost came out like that picture. But Nintendo overturned the project and Sony developed a prototype. A few years ago, I built a prototype with a real PlayStation 1 based on that picture.
1:28

Nintendo had a plan to build a CD-ROM adapter for SuperFamicom. Sony suggested it and it almost came out like that picture. But Nintendo overturned the project and Sony developed a prototype. A few years ago, I built a prototype with a real PlayStation 1 based on that picture.

Gamer_lafan

106,537 views • 1 year ago

AIDesigner is officially live! I think we can all agree that vibe coded apps look horrible, so I built an AI UI designer that creates actually beautiful UI in seconds. • Stunning designs from the simplest of prompts. • Design, edit, iterate all on a single canvas. • Copy styles from any URL. • Publish in a single click (subdomain or custom). • Designs for both web and mobile. • Export to code and image. Great UI design doesn't have to be difficult. Components, mobile apps, websites, AIDesigner does it all. Try it for free:
1:31

AIDesigner is officially live! I think we can all agree that vibe coded apps look horrible, so I built an AI UI designer that creates actually beautiful UI in seconds. • Stunning designs from the simplest of prompts. • Design, edit, iterate all on a single canvas. • Copy styles from any URL. • Publish in a single click (subdomain or custom). • Designs for both web and mobile. • Export to code and image. Great UI design doesn't have to be difficult. Components, mobile apps, websites, AIDesigner does it all. Try it for free:

Wiz

17,068 views • 8 months ago

🎮 A fan-made Sonic 2 controller prototype adds real-time Spin Dash force feedback and a tiny charge screen! Created by Dr_BrownBR, it uses an internal motor to react to Sonic’s movement through a PC emulator. Full details in our community spotlight in the replies! #SonicNews
0:57

🎮 A fan-made Sonic 2 controller prototype adds real-time Spin Dash force feedback and a tiny charge screen! Created by Dr_BrownBR, it uses an internal motor to react to Sonic’s movement through a PC emulator. Full details in our community spotlight in the replies! #SonicNews

Sonic City ⋆★ Sonic News, Media & Community ★⋆🦔💨

49,480 views • 4 months ago

With Canvas in Gemini, you can: ⌨️ Write, iterate & preview React/HTML code 📝 Draft & edit comprehensive documents 🎨 Build interactive prototypes, games & visualization …and more. Simply select ‘Canvas’ in your prompt bar and you can write and edit documents or code, with changes appearing in real-time: Try it today and share your Canvas creations by tagging us here!
0:30

With Canvas in Gemini, you can: ⌨️ Write, iterate & preview React/HTML code 📝 Draft & edit comprehensive documents 🎨 Build interactive prototypes, games & visualization …and more. Simply select ‘Canvas’ in your prompt bar and you can write and edit documents or code, with changes appearing in real-time: Try it today and share your Canvas creations by tagging us here!

Google Gemini

414,938 views • 1 year ago

We asked AI Mode in Search how a basketball player's 3 point shot relates to the quadratic equation. With Gemini 3's new generative UI capabilities, it created an interactive visualization to help bring this concept to life. Try it out with the Gemini 3 drop down in AI Mode and share your examples with us!
0:34

We asked AI Mode in Search how a basketball player's 3 point shot relates to the quadratic equation. With Gemini 3's new generative UI capabilities, it created an interactive visualization to help bring this concept to life. Try it out with the Gemini 3 drop down in AI Mode and share your examples with us!

Rajan Patel

202,459 views • 9 months ago

Design. Prototype. Ship. All with the power of Play AI. Use Play AI to: › Generate a chart, a full onboarding flow, or a background with shifting gradients. Play creates it in real time with the new AI View. › Prototype using natural language — “On tap, open this page in a sheet and add a haptic.” › Design effects like Liquid Glass, system icons, or native elements in seconds. Try Play AI for free today!
0:36

Design. Prototype. Ship. All with the power of Play AI. Use Play AI to: › Generate a chart, a full onboarding flow, or a background with shifting gradients. Play creates it in real time with the new AI View. › Prototype using natural language — “On tap, open this page in a sheet and add a haptic.” › Design effects like Liquid Glass, system icons, or native elements in seconds. Try Play AI for free today!

Play

26,079 views • 10 months ago

Introducing primeui. Build sites fast. Fear no code. Available today • 200+ handcrafted marketing UI components and templates • Sitemap planner • Prototype + experiment on an infinite canvas • Clean export to Next.js, Tailwind + shadcn/ui compatible • Not just landing pages: build Blog, Docs, Pricing, and more Coming soon • MCP • Skills • AI Designer We started Prime UI because we believe site builders that do not output real code end up slowing you down. So instead of building another “app builder,” we focused on marketing sites, the work we know best after 10+ years of designing and building high-end websites at Pixel Point. Human expertise combined with AI scalability is what we believe in. Prime UI isn’t here (yet) to fully replace your stack, but it is already capable of saving you hundreds of hours in prototyping and the early phases of your next site project. What’s next: MCP: continuously add new pages to your site from Prime UI, aligned with your project setup and style. Skills: an AI-agent-friendly concentrate of our years of website design and development expertise. It is time to ditch old habits. Fear no code and build sites fast, ready for the AI era.
0:30

Introducing primeui. Build sites fast. Fear no code. Available today • 200+ handcrafted marketing UI components and templates • Sitemap planner • Prototype + experiment on an infinite canvas • Clean export to Next.js, Tailwind + shadcn/ui compatible • Not just landing pages: build Blog, Docs, Pricing, and more Coming soon • MCP • Skills • AI Designer We started Prime UI because we believe site builders that do not output real code end up slowing you down. So instead of building another “app builder,” we focused on marketing sites, the work we know best after 10+ years of designing and building high-end websites at Pixel Point. Human expertise combined with AI scalability is what we believe in. Prime UI isn’t here (yet) to fully replace your stack, but it is already capable of saving you hundreds of hours in prototyping and the early phases of your next site project. What’s next: MCP: continuously add new pages to your site from Prime UI, aligned with your project setup and style. Skills: an AI-agent-friendly concentrate of our years of website design and development expertise. It is time to ditch old habits. Fear no code and build sites fast, ready for the AI era.

Alex Barashkov

72,313 views • 6 months ago

I took Grok 4 for a spin this weekend to build this game prototype. I used SuperGrok Chat to generate the initial game prototype and then brought it over to Cursor to continue coding with Grok 4 MAX. Grok 4 in Cursor is like a no-nonsense agent. Doesn't speak much, but delivers the goods. There were moments where I was rate-limited or stuck on a bug or two that I had to get other models to help, but otherwise it's a fast, reliable model to work with. This makes me incredibly excited for Grok Code to launch in August!
0:24

I took Grok 4 for a spin this weekend to build this game prototype. I used SuperGrok Chat to generate the initial game prototype and then brought it over to Cursor to continue coding with Grok 4 MAX. Grok 4 in Cursor is like a no-nonsense agent. Doesn't speak much, but delivers the goods. There were moments where I was rate-limited or stuck on a bug or two that I had to get other models to help, but otherwise it's a fast, reliable model to work with. This makes me incredibly excited for Grok Code to launch in August!

Danny Limanseta

20,488,142 views • 1 year ago

At Google Labs, our goal is to "build together" with industry experts. So, we handed Stitch to the team at Voltage to see how an elite design agency tackles real client problems. 🧠⚡️ They teamed up with Force 4 Good, who needed a new mobile app. 24 hours after the first brainstorm... 📉 Client Expected: A few high-level static mocks. 🚀 What Voltage Delivered: A fully interactive, multi-screen prototype. Because Stitch lets you iterate at the speed of thought, the team skipped the tedious phases and went straight to showing a prototype. Check out how they did it in the video below! 👇
2:04

At Google Labs, our goal is to "build together" with industry experts. So, we handed Stitch to the team at Voltage to see how an elite design agency tackles real client problems. 🧠⚡️ They teamed up with Force 4 Good, who needed a new mobile app. 24 hours after the first brainstorm... 📉 Client Expected: A few high-level static mocks. 🚀 What Voltage Delivered: A fully interactive, multi-screen prototype. Because Stitch lets you iterate at the speed of thought, the team skipped the tedious phases and went straight to showing a prototype. Check out how they did it in the video below! 👇

Stitch by Google

26,179 views • 2 months ago

working theory for a new vibe code workflow: 1. create a proof of concept in v0 2. move to github and clone in a local repo 3. use as ref for agent planning 4. create a backend directory to test API plumbing 5. create a frontend directory to prototype iteratively this way you can repeatedly rip apart the frontend for ideation without worrying about breaking changes to the backend. i really like asking for an open ended "job to be done" (i.e. place a bet with a single tap) with 5-10 variations to feel. it's the modern day wireframing. it's still UI slop but i can get ideas in my head out faster and reveal design shortcomings before polishing or worrying about making components functional. and because the v0 prototype gets you to functional ai features and backend integration fastest, you have both a technical and conceptual reference to use in your agentic planning so your v1 is more predictable with minimal effort.
0:22

working theory for a new vibe code workflow: 1. create a proof of concept in v0 2. move to github and clone in a local repo 3. use as ref for agent planning 4. create a backend directory to test API plumbing 5. create a frontend directory to prototype iteratively this way you can repeatedly rip apart the frontend for ideation without worrying about breaking changes to the backend. i really like asking for an open ended "job to be done" (i.e. place a bet with a single tap) with 5-10 variations to feel. it's the modern day wireframing. it's still UI slop but i can get ideas in my head out faster and reveal design shortcomings before polishing or worrying about making components functional. and because the v0 prototype gets you to functional ai features and backend integration fastest, you have both a technical and conceptual reference to use in your agentic planning so your v1 is more predictable with minimal effort.

0xDesigner

14,912 views • 8 months ago

“This took less than an hour." Interactive 3D is becoming essential across industries - but for a lot of teams, it’s still out of reach. That’s why we built Unity Studio - an intuitive, web-based, no-code editor that helps teams across industries, from manufacturing to retail, turn existing 3D assets into interactive experiences, straight from the browser. Check out what it looks like to go from a static 3D file to a fully interactive demo in under an hour. 🔗 Try it out yourself with a free 30 day Unity Studio trial:
1:01

“This took less than an hour." Interactive 3D is becoming essential across industries - but for a lot of teams, it’s still out of reach. That’s why we built Unity Studio - an intuitive, web-based, no-code editor that helps teams across industries, from manufacturing to retail, turn existing 3D assets into interactive experiences, straight from the browser. Check out what it looks like to go from a static 3D file to a fully interactive demo in under an hour. 🔗 Try it out yourself with a free 30 day Unity Studio trial:

Unity

10,408 views • 3 months ago