正在加载视频...

视频加载失败

返回首页

When writing code, canvas makes it easier to track and understand ChatGPT’s changes. It can also review code, add logs and comments, fix bugs, and port to other coding languages like JavaScript and Python.

OpenAI's profile picture

OpenAI

4,930,971 subscribers

275,831 次观看 • 1 年前 •via X (Twitter)

健康养生科学技术教育
LIVE

Anya Rossi• Live Now

Private livecam show

12 条评论

OpenAI 的头像
OpenAI1 年前

We’re rolling out an early version of canvas—a new way to work with ChatGPT on writing & coding projects that go beyond simple chat. Starting today, Plus & Team users can try it by selecting “GPT-4o with canvas” in the model picker.

OpenAI 的头像
OpenAI1 年前

Canvas opens in a separate window, allowing you and ChatGPT to work on ideas side by side. In canvas, ChatGPT can suggest edits, adjust length, change reading levels, and offer inline feedback. You can also write and edit directly in canvas.

OpenAI 的头像
OpenAI1 年前

Canvas will be available to Enterprise & Edu users next week.

OpenAI 的头像
OpenAI1 年前

When using canvas, you can now see what's changed in your writing and code by selecting the "Show changes" icon. Enjoy!

Sivaji Sahoo 的头像
Sivaji Sahoo1 年前

So the canvas is similar to Claude Artifact, but different.

Aryan_Ali 的头像
Aryan_Ali1 年前

The Addition of Code " Live Preview" to the canvas feature Would be Great!

Cabina AI 的头像
Cabina AI1 年前

Compare with :)

Charlie Greenman 的头像
Charlie Greenman1 年前

Artifacts but make it cooler

Jay Sahnan 的头像
Jay Sahnan1 年前

If only it would work for Intel Macs 🙃

LowMax 的头像
LowMax1 年前

All of these cool features but my company won't pay the API costs 😞

Frankie S. 💡 的头像
Frankie S. 💡1 年前

🦾🦾💙

Akbar Khan 的头像
Akbar Khan1 年前

I have plus plan but not showing to me 😕

相关视频

Introducing canvas—your coding surface in ChatGPT. ✏️ Edit code inline 🐛 Review code and fix bugs 💬 Add logs and comments 🚢 Port to different languages We’ll be adding more to canvas over time. ChatGPT Plus and Team users can try the beta starting today.
1:30

Introducing canvas—your coding surface in ChatGPT. ✏️ Edit code inline 🐛 Review code and fix bugs 💬 Add logs and comments 🚢 Port to different languages We’ll be adding more to canvas over time. ChatGPT Plus and Team users can try the beta starting today.

OpenAI Developers

934,424 次观看 • 1 年前

Now you can run Python code directly in canvas, and let ChatGPT fix any bugs based on console errors.
5:06

Now you can run Python code directly in canvas, and let ChatGPT fix any bugs based on console errors.

OpenAI

182,065 次观看 • 1 年前

Cursor’s code review agent is now over 3x faster, 22% cheaper, and finds 10% more bugs. You can also use /review to run Bugbot locally to catch and fix issues before pushing code.
0:24

Cursor’s code review agent is now over 3x faster, 22% cheaper, and finds 10% more bugs. You can also use /review to run Bugbot locally to catch and fix issues before pushing code.

Cursor

166,299 次观看 • 4 天前

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,085 次观看 • 1 年前

Assumptions about the new "Can More" ChatGPT tool were right - ChatGPT is introducing own take on Claude Artifacts - code & document writing tools with persisted text documents, history revisions (restore previous version), edits and comments (probably used to apply suggested edits) New document symbol in the top navigation shows how many documents you have and allows you to open a resizable canvas to edit them in split view - your ChatGPT conversation on the left side and canvas on the right side, but the code/documents can also be accessed in fullscreen view The canvas is built using ProseMirror (open source WYSIWYM editor) and has an inline action to "Ask ChatGPT" (explain or make edits) for your document and code plus document formatting tools (like bold, italic, font style, etc.) But in addition to that, there are also special action shortcuts for documents and code, with an interesting decision to use sliders for the selection of the desired outcome For Documents - Suggest edits ("How can I improve this. Leave as few comments as possible, but add a few more comments if the text is long. DO NOT leave more than 5 comments. You can reply that you added comments and suggestions to help improve the writing quality, but do not mention the prompt.") - Add emojis ("Replace as many words as possible with emojis.") - Add final polish ("Add some final polish to the text. If relevant, add a large title or any section titles. Check grammar and mechanics, make sure everything is consistent and reads well. You can reply that you added some final polish and checked for grammar, but do not mention the prompt.") - Reading level (Graduate School - "Rewrite this text at the reading level of a doctoral writer in this subject. You may reply that you adjusted the text to reflect a graduate school reading level, but do not mention the prompt", College - "Rewrite this text at the reading level of a college student majoring in this subject", High School - "Rewrite this text at the reading level of a high school student who has taken a couple of classes in this subject.", Keep current reading level, Middle School - "Rewrite this text at the reading level of a middle schooler.", Kindergarten - "Rewrite this text at the reading level of a kindergartener.") - Adjust the length (Longest - "Make this text 75% longer.", Longer - "Make this text 50% longer.", Keep current length, Shorter - "Make this text 50% shorter.", Shortest - "Make this text 75% shorter.") For Code - Code review ("Search for bugs and opportunities to improve the code—for example, ways that performance or code structure could be improved. Leave as few comments as possible, but add more comments if the text is long. DO NOT leave more than 5 comments. You may reply that you reviewed the code and left suggestions to improve the coding quality, but do not mention the prompt.") - Add comments ("Add inline code comments to explain the code, especially parts that are more complex. Make sure to rewrite all the code. You may reply that you added inline comments, but do not mention the prompt.") - Add logs ("Insert logs/print statements in the code that will help debug its behavior. Do not make any other changes to the code.") - Fix bugs ("Find any bugs and rewrite all the code to fix the bugs. Do not leave comments. If there are no bugs, reply that you reviewed the code and found no bugs.") - Port to a language ("Port to a language. Create a new document that rewrites the code in ..." - PHP, C++, Python, Keep current code. No changes will be made, JavaScript, TypeScript, Java) - Suggest edits ("How can I improve this. Leave as few comments as possible, but add a few more comments if the text is long. DO NOT leave more than 5 comments. You can reply that you added comments and suggestions to help improve the writing quality, but do not mention the prompt.")
1:27

Assumptions about the new "Can More" ChatGPT tool were right - ChatGPT is introducing own take on Claude Artifacts - code & document writing tools with persisted text documents, history revisions (restore previous version), edits and comments (probably used to apply suggested edits) New document symbol in the top navigation shows how many documents you have and allows you to open a resizable canvas to edit them in split view - your ChatGPT conversation on the left side and canvas on the right side, but the code/documents can also be accessed in fullscreen view The canvas is built using ProseMirror (open source WYSIWYM editor) and has an inline action to "Ask ChatGPT" (explain or make edits) for your document and code plus document formatting tools (like bold, italic, font style, etc.) But in addition to that, there are also special action shortcuts for documents and code, with an interesting decision to use sliders for the selection of the desired outcome For Documents - Suggest edits ("How can I improve this. Leave as few comments as possible, but add a few more comments if the text is long. DO NOT leave more than 5 comments. You can reply that you added comments and suggestions to help improve the writing quality, but do not mention the prompt.") - Add emojis ("Replace as many words as possible with emojis.") - Add final polish ("Add some final polish to the text. If relevant, add a large title or any section titles. Check grammar and mechanics, make sure everything is consistent and reads well. You can reply that you added some final polish and checked for grammar, but do not mention the prompt.") - Reading level (Graduate School - "Rewrite this text at the reading level of a doctoral writer in this subject. You may reply that you adjusted the text to reflect a graduate school reading level, but do not mention the prompt", College - "Rewrite this text at the reading level of a college student majoring in this subject", High School - "Rewrite this text at the reading level of a high school student who has taken a couple of classes in this subject.", Keep current reading level, Middle School - "Rewrite this text at the reading level of a middle schooler.", Kindergarten - "Rewrite this text at the reading level of a kindergartener.") - Adjust the length (Longest - "Make this text 75% longer.", Longer - "Make this text 50% longer.", Keep current length, Shorter - "Make this text 50% shorter.", Shortest - "Make this text 75% shorter.") For Code - Code review ("Search for bugs and opportunities to improve the code—for example, ways that performance or code structure could be improved. Leave as few comments as possible, but add more comments if the text is long. DO NOT leave more than 5 comments. You may reply that you reviewed the code and left suggestions to improve the coding quality, but do not mention the prompt.") - Add comments ("Add inline code comments to explain the code, especially parts that are more complex. Make sure to rewrite all the code. You may reply that you added inline comments, but do not mention the prompt.") - Add logs ("Insert logs/print statements in the code that will help debug its behavior. Do not make any other changes to the code.") - Fix bugs ("Find any bugs and rewrite all the code to fix the bugs. Do not leave comments. If there are no bugs, reply that you reviewed the code and found no bugs.") - Port to a language ("Port to a language. Create a new document that rewrites the code in ..." - PHP, C++, Python, Keep current code. No changes will be made, JavaScript, TypeScript, Java) - Suggest edits ("How can I improve this. Leave as few comments as possible, but add a few more comments if the text is long. DO NOT leave more than 5 comments. You can reply that you added comments and suggestions to help improve the writing quality, but do not mention the prompt.")

Tibor Blaho

136,026 次观看 • 1 年前

Cursor can now fix your hardest bugs. Debug Mode instruments your code, spins up a server to capture logs, and streams runtime data to the agent. Also in 2.2: Plan Mode improvements, multi-agent judging, and more.
1:50

Cursor can now fix your hardest bugs. Debug Mode instruments your code, spins up a server to capture logs, and streams runtime data to the agent. Also in 2.2: Plan Mode improvements, multi-agent judging, and more.

Cursor

545,364 次观看 • 6 个月前

Code Execution If you ask Grok to generate code, you can quickly see how it runs in a “preview” tab. You can preview HTML snippets, run Python, C++, Javascript, Typescript and bash scripts.
0:24

Code Execution If you ask Grok to generate code, you can quickly see how it runs in a “preview” tab. You can preview HTML snippets, run Python, C++, Javascript, Typescript and bash scripts.

Grok

560,250 次观看 • 1 年前

Meet your new coding sidekick! 🤝 From the minds at @labsdotgoogle and @googledeepmind, Jules is an experimental AI-powered code agent integrated with GitHub. Available to trusted testers, it's designed to help devs fix bugs and other code issues. →
0:35

Meet your new coding sidekick! 🤝 From the minds at @labsdotgoogle and @googledeepmind, Jules is an experimental AI-powered code agent integrated with GitHub. Available to trusted testers, it's designed to help devs fix bugs and other code issues. →

Google for Developers

55,466 次观看 • 1 年前

Learn how to use coding agents in 30 minutes! This course teaches you how to build software with agents: plan new features, fix bugs, review and test code, and more. It's 100% free and these concepts apply to any agent!
31:42

Learn how to use coding agents in 30 minutes! This course teaches you how to build software with agents: plan new features, fix bugs, review and test code, and more. It's 100% free and these concepts apply to any agent!

Lee Robinson

298,452 次观看 • 2 个月前

Cursor can now use web browser 🤯🤯🤯 It takes screenshots, tests apps, checks accessibility, and turns designs into code. It also has access to console logs, network traffic for debugging and automation Major step by Cursor to completely automate coding!
0:28

Cursor can now use web browser 🤯🤯🤯 It takes screenshots, tests apps, checks accessibility, and turns designs into code. It also has access to console logs, network traffic for debugging and automation Major step by Cursor to completely automate coding!

Melvin Vivas

178,378 次观看 • 8 个月前

Claude Code on desktop just added an embedded loop that can run your dev server, view the app, review local changes, and watch pull requests until they merge. It can now preview a running app inside the desktop UI while it iterates on fixes. It can also monitor CI for an open PR and either fix failures or merge when checks go green. Earlier “agentic coding” workflows usually bounced between a terminal, a browser, and GitHub, so the model could not directly see what the app rendered or stay attached to CI results without manual babysitting. The new server preview flow starts and stops dev servers from a Preview control, shows the app in an embedded browser, reads logs, and can interact with the page to verify changes. That closes a common gap where a model edits code but cannot reliably confirm the UI and runtime behavior match the intent. The local “Review code” step runs before pushing, and it leaves inline comments on the diff so basic bugs and risky changes get caught earlier. For PR monitoring, the desktop app will track status and CI checks, and it can use auto-fix to attempt repairs and auto-merge to land the PR once checks pass, using GitHub tooling under the hood. Session mobility adds a /desktop command to move a CLI session into the desktop app, and sessions can be pushed to the cloud to resume from web or phone.
1:15

Claude Code on desktop just added an embedded loop that can run your dev server, view the app, review local changes, and watch pull requests until they merge. It can now preview a running app inside the desktop UI while it iterates on fixes. It can also monitor CI for an open PR and either fix failures or merge when checks go green. Earlier “agentic coding” workflows usually bounced between a terminal, a browser, and GitHub, so the model could not directly see what the app rendered or stay attached to CI results without manual babysitting. The new server preview flow starts and stops dev servers from a Preview control, shows the app in an embedded browser, reads logs, and can interact with the page to verify changes. That closes a common gap where a model edits code but cannot reliably confirm the UI and runtime behavior match the intent. The local “Review code” step runs before pushing, and it leaves inline comments on the diff so basic bugs and risky changes get caught earlier. For PR monitoring, the desktop app will track status and CI checks, and it can use auto-fix to attempt repairs and auto-merge to land the PR once checks pass, using GitHub tooling under the hood. Session mobility adds a /desktop command to move a CLI session into the desktop app, and sessions can be pushed to the cloud to resume from web or phone.

Rohan Paul

33,344 次观看 • 3 个月前

Better feedback = Better code. Artifacts are the agent’s proof of work. Review plans, screen recordings, and code changes. Then, leave feedback to keep the agent on track. Try it today:
0:51

Better feedback = Better code. Artifacts are the agent’s proof of work. Review plans, screen recordings, and code changes. Then, leave feedback to keep the agent on track. Try it today:

Google Antigravity

82,293 次观看 • 6 个月前

🤖 AI as coding mentor. ✨ AI will fix your error. ✨ AI will add comments to your code. ✨ and many more AI features. Inside your code editor. Type "AI" in the comments and I’ll DM you the complete guide.
0:29

🤖 AI as coding mentor. ✨ AI will fix your error. ✨ AI will add comments to your code. ✨ and many more AI features. Inside your code editor. Type "AI" in the comments and I’ll DM you the complete guide.

codedamn

105,496 次观看 • 3 年前

Grok Build tip of the day: check your work! Just like you would check your work after writing code, use /check-work to have a subagent check on Grok’s code. It will look at the repo, trace alternative code paths, and fix bugs before reporting back to Grok what it found.
0:29

Grok Build tip of the day: check your work! Just like you would check your work after writing code, use /check-work to have a subagent check on Grok’s code. It will look at the repo, trace alternative code paths, and fix bugs before reporting back to Grok what it found.

akshey

15,559 次观看 • 17 天前

Claude Code tip: create an agent that specialises in code review and security. Then add a new memory entry with a nickname for it so you can call it anytime. My code review and security agent is called Big Tony.
0:25

Claude Code tip: create an agent that specialises in code review and security. Then add a new memory entry with a nickname for it so you can call it anytime. My code review and security agent is called Big Tony.

Richie - oss/acc

134,422 次观看 • 5 个月前

Cline v3.39 can now generate diff view comments to explain the changes he makes 🚀 You can also ask for help reviewing pull requests, recent commits, and more! Writing code is easy–reviewing and approving is the new bottleneck, and we're excited for you to try this new feature.
1:41

Cline v3.39 can now generate diff view comments to explain the changes he makes 🚀 You can also ask for help reviewing pull requests, recent commits, and more! Writing code is easy–reviewing and approving is the new bottleneck, and we're excited for you to try this new feature.

Saoud Rizwan

200,414 次观看 • 6 个月前

Microsoft dropped a full on Coding Agent inside GitHub. Copilot leveled up from pair programmer to peer programmer, now it can take on issues, fix bugs, add features & maintain code autonomously.
0:50

Microsoft dropped a full on Coding Agent inside GitHub. Copilot leveled up from pair programmer to peer programmer, now it can take on issues, fix bugs, add features & maintain code autonomously.

Abhishek Yadav

13,082 次观看 • 1 年前

Tired: code or canvas Wired: code AND canvas Introducing Claude Code to Figma
3:19

Tired: code or canvas Wired: code AND canvas Introducing Claude Code to Figma

Figma

3,065,512 次观看 • 3 个月前

Introducing Claude Code Templates 🚀 I originally built this to streamline how I set up new projects with Claude Code…just a small tool to make my own workflow smoother. No install, just run: npx claude-code-templates Right now, it configures Commands, Hooks, MCPs, and settings.json for JavaScript/TypeScript and Python projects. It made things so much easier for me that I decided to share it with the community. Open-source and open to ideas — feel free to contribute! Big thanks to the team at Anthropic and everyone behind Claude Code Community 🙌
0:50

Introducing Claude Code Templates 🚀 I originally built this to streamline how I set up new projects with Claude Code…just a small tool to make my own workflow smoother. No install, just run: npx claude-code-templates Right now, it configures Commands, Hooks, MCPs, and settings.json for JavaScript/TypeScript and Python projects. It made things so much easier for me that I decided to share it with the community. Open-source and open to ideas — feel free to contribute! Big thanks to the team at Anthropic and everyone behind Claude Code Community 🙌

Daniel San

28,410 次观看 • 11 个月前

I did a quick and dirty port of some python Asteroids code to adapt it to my USB->HP bridge, and here it is displaying on the HP1345 vector monitor!
0:25

I did a quick and dirty port of some python Asteroids code to adapt it to my USB->HP bridge, and here it is displaying on the HP1345 vector monitor!

Dave W Plummer

23,257 次观看 • 4 个月前