Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

I've always liked the infinite canvas as an exploration medium, but I could never get into Figma because I'm faster at designing in code So this weekend I made an app that combines canvas with code editor - write React, and it appears in the canvas

nandafyi's profile picture

nanda

28,136 subscribers

79,813 Aufrufe • vor 4 Monaten •via X (Twitter)

KunstWissenschaft & Technologie
LIVE

Anya Rossi• Live Now

Private livecam show

0 Kommentare

Keine Kommentare verfügbar

Kommentare vom Original-Post werden hier angezeigt

Ähnliche Videos

CODE EXECUTION IN CANVAS🎨 Canvas becomes an automated SWE and a data scientist. Search for API docs, ask the model to write code and execute, get the plot!
0:21

CODE EXECUTION IN CANVAS🎨 Canvas becomes an automated SWE and a data scientist. Search for API docs, ask the model to write code and execute, get the plot!

Karina

46,604 Aufrufe • vor 1 Jahr

I've always dreamed of a multi-modal canvas, and when i was at figma that meant code + direct manipulation, and now it means agents + code + direct manipulation I might cry
1:16

I've always dreamed of a multi-modal canvas, and when i was at figma that meant code + direct manipulation, and now it means agents + code + direct manipulation I might cry

Michael Feldstein

11,440 Aufrufe • vor 5 Monaten

i shit you not, it's an IDE AND has browser embeds, so I can localhost multiple pages at once in the same canvas obsidian's canvas being able to embed ANYTHING, and the Obsidian editor being literally just code-mirror, makes it the perfect worspace (tldraw is also cool)
0:38

i shit you not, it's an IDE AND has browser embeds, so I can localhost multiple pages at once in the same canvas obsidian's canvas being able to embed ANYTHING, and the Obsidian editor being literally just code-mirror, makes it the perfect worspace (tldraw is also cool)

Igor bedesqui

78,297 Aufrufe • vor 6 Monaten

You can just tell Claude Code to learn skills and it will. I asked Claude to create an app that uses tldraw and it one shotted it with sqlite db, and then I asked Claude Code to create a skill so that it could read and write on the canvas. 10 minutes later it could do it. Weirrrrdddd times.
0:25

You can just tell Claude Code to learn skills and it will. I asked Claude to create an app that uses tldraw and it one shotted it with sqlite db, and then I asked Claude Code to create a skill so that it could read and write on the canvas. 10 minutes later it could do it. Weirrrrdddd times.

Riley Brown

73,418 Aufrufe • vor 8 Monaten

You've never vibe coded like this before. Replit ⠕ is now your canvas for building & creating. In this video I'm building a graphics shader app. I click Replit's canvas button and see the live app running on infinite editable canvas, generate several design variants in parallel side by side, bring one back into my app. Just 1 of the things we shipped.
1:53

You've never vibe coded like this before. Replit ⠕ is now your canvas for building & creating. In this video I'm building a graphics shader app. I click Replit's canvas button and see the live app running on infinite editable canvas, generate several design variants in parallel side by side, bring one back into my app. Just 1 of the things we shipped.

jordwalke

188,333 Aufrufe • vor 5 Monaten

That gap between design and production? Closed. 🔁 GitHub Copilot, Visual Studio Code, and Figma now create a continuous loop. With the bidirectional Figma MCP server, Copilot users can: 🔹 Pull design context into code 🔹 Push working UI back to the canvas Connect your canvas and stay in the flow. 👇
1:40

That gap between design and production? Closed. 🔁 GitHub Copilot, Visual Studio Code, and Figma now create a continuous loop. With the bidirectional Figma MCP server, Copilot users can: 🔹 Pull design context into code 🔹 Push working UI back to the canvas Connect your canvas and stay in the flow. 👇

GitHub

113,297 Aufrufe • vor 5 Monaten

Design ∞ code loop, but 10x better. Introducing the browser agent in pen.dev. Import HTML/React to fully editable canvas, make edits/variations, export back to code. Build with the browser & the canvas at the same time, the ultimate combo. Download today.
1:07

Design ∞ code loop, but 10x better. Introducing the browser agent in pen.dev. Import HTML/React to fully editable canvas, make edits/variations, export back to code. Build with the browser & the canvas at the same time, the ultimate combo. Download today.

Tom Krcha

101,168 Aufrufe • vor 1 Monat

You can now push what you’re building in Claude Code directly into Figma. With the latest updates to the Figma MCP server, build a working prototype in code, then send it to a Figma canvas to explore multiple versions.
0:30

You can now push what you’re building in Claude Code directly into Figma. With the latest updates to the Figma MCP server, build a working prototype in code, then send it to a Figma canvas to explore multiple versions.

Claude

4,321,063 Aufrufe • vor 6 Monaten

For years, the design industry has talked about "design vs code" And tools (including Figma!) have forced a choice. But this is a false debate. Code isn't the opposite of design. Code is a material for design. So we're bringing code to the Figma canvas with Code Layers.
0:20

For years, the design industry has talked about "design vs code" And tools (including Figma!) have forced a choice. But this is a false debate. Code isn't the opposite of design. Code is a material for design. So we're bringing code to the Figma canvas with Code Layers.

Dylan Field

97,239 Aufrufe • vor 2 Monaten

Canvas to Code x Arties The web3 space moves at an unmatched pace. As an artist, staying at the forefront of innovation and embracing the latest advancements in the industry is crucial. That's why I partnered with @Artiesltd to bring traditional art into the NFT space.
0:32

Canvas to Code x Arties The web3 space moves at an unmatched pace. As an artist, staying at the forefront of innovation and embracing the latest advancements in the industry is crucial. That's why I partnered with @Artiesltd to bring traditional art into the NFT space.

VOKA

49,619 Aufrufe • vor 3 Jahren

Figma just shipped the ability to bring UI work done in Claude Code straight into Figma as editable design frames. Use this to explore new ideas in Figma, view multi-page flows on the canvas, or reimagine user experiences.
0:25

Figma just shipped the ability to bring UI work done in Claude Code straight into Figma as editable design frames. Use this to explore new ideas in Figma, view multi-page flows on the canvas, or reimagine user experiences.

Thariq

1,327,217 Aufrufe • vor 6 Monaten

I asked o1 to help me code the wii menu it built a react app that renders in chatgpt canvas I fed it a screenshot and it one-shotted the basic layout—even the striped background—then I kept on prompting to add animations, etc
0:21

I asked o1 to help me code the wii menu it built a react app that renders in chatgpt canvas I fed it a screenshot and it one-shotted the basic layout—even the striped background—then I kept on prompting to add animations, etc

edwin

139,305 Aufrufe • vor 1 Jahr

been making a design tool where you and AI agents design together... claude code, cursor, or any cli agent can join the canvas and build with u infinite canvas, real components, everything in tailwind + html so you can just copy the code + eventually publish like any other site too
4:39

been making a design tool where you and AI agents design together... claude code, cursor, or any cli agent can join the canvas and build with u infinite canvas, real components, everything in tailwind + html so you can just copy the code + eventually publish like any other site too

Pablo Stanley

21,470 Aufrufe • vor 6 Monaten

New short course: Collaborative Writing and Coding with OpenAI Canvas! Explore new ways to write and code with OpenAI Canvas, a user-friendly interface that allows you to brainstorm, draft, and refine text and code in collaboration with ChatGPT. In the short course, created with OpenAI, and taught by , a research lead at OpenAI, you’ll learn to use Canvas to enhance your workflows. Canvas lets you go beyond simple chat interactions. It provides a side-by-side workspace where you and ChatGPT can edit and refine text or code collaboratively. This makes brainstorming, drafting, and iterating as you write feel more natural and effective. As the first major update to ChatGPT’s visual interface since its launch in 2022, Canvas gives a new, innovative approach to collaboration with AI. For instance, after writing the first version of your code, Canvas can review it and give suggestions for improvement. It can also help with debugging by adding logging, identifying problems to fix, and writing comments. In addition, you'll also learn what it takes to train the model for an interface like Canvas. In this video-only short course, you’ll: - Learn how to ask for in-line feedback and control the iteration of your work by directly editing selected areas of your text or code from the model’s output. - Learn how to access quick automation tools in a shortcut menu that allows you to modify your writing tone and length, enhance your code, and restore previous versions of your work. - Learn how to use Canvas as a research assistant tool with an example of asking the model to reason through the screenshot of a plot to write a research report, in which you can ask questions within the created report. - Ask the model to write Python code to replicate the graph seen on a screenshot image. - Go behind the scenes of how you can create a video game, such as Space Battleship, from scratch, edit it, and display it in one self-contained HTML file. - Get a real-world application example of creating a SQL database from the image of its architecture. - Understand the model training and design processes that power Canvas! Please sign up here:
1:49

New short course: Collaborative Writing and Coding with OpenAI Canvas! Explore new ways to write and code with OpenAI Canvas, a user-friendly interface that allows you to brainstorm, draft, and refine text and code in collaboration with ChatGPT. In the short course, created with OpenAI, and taught by , a research lead at OpenAI, you’ll learn to use Canvas to enhance your workflows. Canvas lets you go beyond simple chat interactions. It provides a side-by-side workspace where you and ChatGPT can edit and refine text or code collaboratively. This makes brainstorming, drafting, and iterating as you write feel more natural and effective. As the first major update to ChatGPT’s visual interface since its launch in 2022, Canvas gives a new, innovative approach to collaboration with AI. For instance, after writing the first version of your code, Canvas can review it and give suggestions for improvement. It can also help with debugging by adding logging, identifying problems to fix, and writing comments. In addition, you'll also learn what it takes to train the model for an interface like Canvas. In this video-only short course, you’ll: - Learn how to ask for in-line feedback and control the iteration of your work by directly editing selected areas of your text or code from the model’s output. - Learn how to access quick automation tools in a shortcut menu that allows you to modify your writing tone and length, enhance your code, and restore previous versions of your work. - Learn how to use Canvas as a research assistant tool with an example of asking the model to reason through the screenshot of a plot to write a research report, in which you can ask questions within the created report. - Ask the model to write Python code to replicate the graph seen on a screenshot image. - Go behind the scenes of how you can create a video game, such as Space Battleship, from scratch, edit it, and display it in one self-contained HTML file. - Get a real-world application example of creating a SQL database from the image of its architecture. - Understand the model training and design processes that power Canvas! Please sign up here:

Andrew Ng

128,180 Aufrufe • vor 1 Jahr

I can't believe it, I've managed to create a HTML-in-Canvas beast with Ultramock 🔥 Load up any website/app into an interactive 3D scene and programatically animate all components beautifully:
0:34

I can't believe it, I've managed to create a HTML-in-Canvas beast with Ultramock 🔥 Load up any website/app into an interactive 3D scene and programatically animate all components beautifully:

Josh Millgate

22,337 Aufrufe • vor 3 Monaten

✨ I tried Claude Code cause Marc Köhlbrugge kept telling me too and asked it to make this inpaint editor for Photo AI I had this idea of some 🌈 holographic paint brush strokes so I just asked it and it one shotted this glowing JS code for , extremely cool because I could never make this myself without AI All vanilla jQuery code also no libraries (as usual) The inpaint editor lets you edit any of your phtoos AND it uses your AI model so even if you touch the face it still looks like your model unlike regular AI image editors! Also this brings my editing (and all my features now) in-house (before it was an embedded Photopea editor)
1:11

✨ I tried Claude Code cause Marc Köhlbrugge kept telling me too and asked it to make this inpaint editor for Photo AI I had this idea of some 🌈 holographic paint brush strokes so I just asked it and it one shotted this glowing JS code for , extremely cool because I could never make this myself without AI All vanilla jQuery code also no libraries (as usual) The inpaint editor lets you edit any of your phtoos AND it uses your AI model so even if you touch the face it still looks like your model unlike regular AI image editors! Also this brings my editing (and all my features now) in-house (before it was an embedded Photopea editor)

@levelsio

256,762 Aufrufe • vor 1 Jahr

Introducing CNVS ✨ I made the first mac app that lets you command an army of agents on an infinite canvas with your voice. Doodle. Spawn agents. Listen to your music. Run servers in terminals. View changes in live broswers. Each canvas is a different project. no more LAME terminal grids -> this is real VIBE coding In alpha right now. Ultra limited access, first come first serve. link below.
3:39

Introducing CNVS ✨ I made the first mac app that lets you command an army of agents on an infinite canvas with your voice. Doodle. Spawn agents. Listen to your music. Run servers in terminals. View changes in live broswers. Each canvas is a different project. no more LAME terminal grids -> this is real VIBE coding In alpha right now. Ultra limited access, first come first serve. link below.

Max Blade

15,842 Aufrufe • vor 2 Monaten

👋 Meet Canvas, a new interactive space in Gemini that simplifies creating, refining, and sharing your work. Canvas is like a shared whiteboard where you and Gemini can work together. You can refine documents, write code, design prototypes and more while Gemini collaborates with you in real-time to make improvements. Try Canvas today here: and share your creations with us in the comments!
1:00

👋 Meet Canvas, a new interactive space in Gemini that simplifies creating, refining, and sharing your work. Canvas is like a shared whiteboard where you and Gemini can work together. You can refine documents, write code, design prototypes and more while Gemini collaborates with you in real-time to make improvements. Try Canvas today here: and share your creations with us in the comments!

G3mini

63,795 Aufrufe • vor 1 Jahr

Holy moly Never seen someone being that bullish for AI developement as Dario Amodei: - There's just an exponential just like we had an exponential with Moore's law - I think the models are just going to get more and more capable at everything - I've had internal people at Anthropic say, "I don't write any code anymore. I don't write I don't open up an editor and write code. I just let Claude code write the first draft and and all I do is edit it. - What what we're going to see in the future is just like we've going to be seen in the past except more so - the models are just going to get more and more intellectually capable and you know the the revenue is going to keep adding zeros. holy moly, Dario!
1:06

Holy moly Never seen someone being that bullish for AI developement as Dario Amodei: - There's just an exponential just like we had an exponential with Moore's law - I think the models are just going to get more and more capable at everything - I've had internal people at Anthropic say, "I don't write any code anymore. I don't write I don't open up an editor and write code. I just let Claude code write the first draft and and all I do is edit it. - What what we're going to see in the future is just like we've going to be seen in the past except more so - the models are just going to get more and more intellectually capable and you know the the revenue is going to keep adding zeros. holy moly, Dario!

Chubby♨️

77,711 Aufrufe • vor 9 Monaten

I built Perplexity but with DeepSeek Reasoner model in about an hour and i'm posting the full video of it later today. As always, didn't write a single line of code. Should I open source this one?
1:33

I built Perplexity but with DeepSeek Reasoner model in about an hour and i'm posting the full video of it later today. As always, didn't write a single line of code. Should I open source this one?

Riley Brown

942,499 Aufrufe • vor 1 Jahr