Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

Continuing the silliness in Claude Code. Keeping with the Wireframe Design Studio theme and added these cyan grid/content indicators that snap to the content.

James McDonald

105,368 subscribers

17,023 views • 5 months ago •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

Built a WordPress plugin that lets teams edit page content directly from the front end, just click any text and start typing. Really simple way to let people update content without breaking the design. Kind of like synced patterns, but no set up needed. Uses the WordPress Interactivity API under the hood, while keeping the block markup intact in the backend. Built the whole thing with Claude Code in WordPress.com Studio. Want to try building something yourself? npm i -g wp-studio@next && studio code

Built a WordPress plugin that lets teams edit page content directly from the front end, just click any text and start typing. Really simple way to let people update content without breaking the design. Kind of like synced patterns, but no set up needed. Uses the WordPress Interactivity API under the hood, while keeping the block markup intact in the backend. Built the whole thing with Claude Code in WordPress.com Studio. Want to try building something yourself? npm i -g wp-studio@next && studio code

Jamie Marsland - Head of WordPress YouTube ❤️

13,518 views • 2 months ago

Spent a few hours in Claude Code again this morning working on a new design for Wireframe Design Studio. I didn't write a single line of code.

Spent a few hours in Claude Code again this morning working on a new design for Wireframe Design Studio. I didn't write a single line of code.

James McDonald

35,290 views • 4 months ago

Claude Code Weekly Roundup Last week we added support for Azure, let you use "&" in the CLI to send tasks to the background, added image upload to Claude Code Web, improved Claude Code's ability to look up its docs and we're continuing to make hooks and subagents more powerful.

Claude Code Weekly Roundup Last week we added support for Azure, let you use "&" in the CLI to send tasks to the background, added image upload to Claude Code Web, improved Claude Code's ability to look up its docs and we're continuing to make hooks and subagents more powerful.

Thariq

70,840 views • 7 months ago

Spent all of today in Claude Code again. Working on a redesign of Wireframe Design Studio This animation has taken me about 4 hours. LOL

Spent all of today in Claude Code again. Working on a redesign of Wireframe Design Studio This animation has taken me about 4 hours. LOL

James McDonald

20,725 views • 5 months ago

I'm obsessed with Tim Walz singing the Menards theme song and then ranting about keeping your receipts to get the rebate. Incredible content.

I'm obsessed with Tim Walz singing the Menards theme song and then ranting about keeping your receipts to get the rebate. Incredible content.

Mike Nellis

1,960,973 views • 1 year ago

Tinkered with this some more. Got some of the timings and animations running smoother. 😁 Wireframe Design Studio

Tinkered with this some more. Got some of the timings and animations running smoother. 😁 Wireframe Design Studio

James McDonald

11,688 views • 3 months ago

At last, Wireframe Design Studio is live 🎉 For the last few months, I’ve been designing and building a new home for Wireframe Design Studio—marking a new chapter for what the studio is. Collaborating with great people and working on fun projects. It’s very much a work in progress—and will continue to be. I’ve built some really unnecessary things on the site, but it’s been so much fun along the way. ↓

At last, Wireframe Design Studio is live 🎉 For the last few months, I’ve been designing and building a new home for Wireframe Design Studio—marking a new chapter for what the studio is. Collaborating with great people and working on fun projects. It’s very much a work in progress—and will continue to be. I’ve built some really unnecessary things on the site, but it’s been so much fun along the way. ↓

James McDonald

39,476 views • 3 months ago

Added some extra things. You can now change the stroke width on the pen tool. It also has a subtle animation going to and from the centre of the tool tray when different tools are selected. Wireframe Design Studio

Added some extra things. You can now change the stroke width on the pen tool. It also has a subtle animation going to and from the centre of the tool tray when different tools are selected. Wireframe Design Studio

James McDonald

11,444 views • 4 months ago

Claude Design + Shopify is f*cking ridiculous 🤯 You can now publish pages from Claude Design → Claude Code → Shopify. Built 100% with Claude Design, Claude Code, and the Shopify CLI. Perfect for DTC brands and agencies who want to skip the design → dev handoff entirely. Here's how it works: → Design any landing page in Claude Design → Export as a zip and drop it into Claude Code → Install the Shopify + Shopify AI Toolkit plugins → Prompt Claude to convert the HTML into a Shopify page template + push to live theme → Claude uploads the images, deploys the files, and creates a published page No more handing designs off to a dev and waiting 2 weeks for a Shopify page. What you get: - A workflow that turns any Claude Design page into a real Shopify page template - Editable sections so your marketing team can swap copy, images, and CTAs without code - Images uploaded straight to Shopify Files automatically - A files-only deploy that only touches what's new in your live theme - A repeatable pipeline you can use every time you design a new landing page This is essentially the design-to-deploy pipeline brands have been waiting for. I put together a step-by-step playbook for going from Claude Design → published Shopify page. Every install, every plugin, every command, and the exact prompt that runs the whole thing. Want the playbook for free? > Like this post > Comment "SHOP" And I'll send it over (must be following so I can DM)

Claude Design + Shopify is f*cking ridiculous 🤯 You can now publish pages from Claude Design → Claude Code → Shopify. Built 100% with Claude Design, Claude Code, and the Shopify CLI. Perfect for DTC brands and agencies who want to skip the design → dev handoff entirely. Here's how it works: → Design any landing page in Claude Design → Export as a zip and drop it into Claude Code → Install the Shopify + Shopify AI Toolkit plugins → Prompt Claude to convert the HTML into a Shopify page template + push to live theme → Claude uploads the images, deploys the files, and creates a published page No more handing designs off to a dev and waiting 2 weeks for a Shopify page. What you get: - A workflow that turns any Claude Design page into a real Shopify page template - Editable sections so your marketing team can swap copy, images, and CTAs without code - Images uploaded straight to Shopify Files automatically - A files-only deploy that only touches what's new in your live theme - A repeatable pipeline you can use every time you design a new landing page This is essentially the design-to-deploy pipeline brands have been waiting for. I put together a step-by-step playbook for going from Claude Design → published Shopify page. Every install, every plugin, every command, and the exact prompt that runs the whole thing. Want the playbook for free? > Like this post > Comment "SHOP" And I'll send it over (must be following so I can DM)

Mike Futia

54,988 views • 1 month ago

Spent last night playing around with a new idea for Wireframe Design Studio

Spent last night playing around with a new idea for Wireframe Design Studio

James McDonald

26,604 views • 3 months ago

Figma design vs Claude Code output Here's my workflow: → Built the component on shadcn/ui foundations → Wrote a SKILLS.md file that systematized design-token extraction (included inputs, extraction protocol, tech selection, tailwind rules, layout etc) → Fed Claude the Figma CSS + 2x-scaled component PNGs (halved the measurements) → Iterated bit-by-bit in Claude Code until I as satisfied with the output

Figma design vs Claude Code output Here's my workflow: → Built the component on shadcn/ui foundations → Wrote a SKILLS.md file that systematized design-token extraction (included inputs, extraction protocol, tech selection, tailwind rules, layout etc) → Fed Claude the Figma CSS + 2x-scaled component PNGs (halved the measurements) → Iterated bit-by-bit in Claude Code until I as satisfied with the output

CJ @ Jackie Brown

27,054 views • 2 months ago

Sometimes you want to overwrite text in the editor instead of inserting it. We recently added overtype mode in Visual Studio Code to let you do just that ⌨️

Sometimes you want to overwrite text in the editor instead of inserting it. We recently added overtype mode in Visual Studio Code to let you do just that ⌨️

Visual Studio Code

409,425 views • 1 year ago

Today we're launching new ways to learn in Claude Code and the Claude app. First up: Claude Code now lets you customize communication styles with /output-style

Today we're launching new ways to learn in Claude Code and the Claude app. First up: Claude Code now lets you customize communication styles with /output-style

Claude

705,420 views • 10 months ago

Spent the last day designing this using only Claude Code aside from the shader which was made in Paper. Didn't draw a single rectangle. Forcing myself to only design with Claude going forward 🫡

Spent the last day designing this using only Claude Code aside from the shader which was made in Paper. Didn't draw a single rectangle. Forcing myself to only design with Claude going forward 🫡

Steve Schoger

165,591 views • 4 months ago

The hardcover book of GPT-1’s weights that Claude Code designed, produced, and sold (including the cool cover which visualizes the numbers in the volume) actually came in the mail today and it looks really nice. I never touched any code or did any design or any API to make this.

The hardcover book of GPT-1’s weights that Claude Code designed, produced, and sold (including the cool cover which visualizes the numbers in the volume) actually came in the mail today and it looks really nice. I never touched any code or did any design or any API to make this.

Ethan Mollick

475,843 views • 4 months ago

The Grid and Snap To Grid are optional. You can adjust the position, rotation, tile size (scale), height and type (hex/square) of the grid. At any time.

The Grid and Snap To Grid are optional. You can adjust the position, rotation, tile size (scale), height and type (hex/square) of the grid. At any time.

Canvas of Kings | Might of Merchants

113,972 views • 1 year ago

We've launched Claude Code contribution metrics to help you track PRs and lines of code contributed with the help of Claude Code.

We've launched Claude Code contribution metrics to help you track PRs and lines of code contributed with the help of Claude Code.

Thariq

408,824 views • 4 months ago

Claude Code 2.1.90 just dropped with a new /powerup command Run it and you get interactive lessons that teach you how to use Claude Code right inside the tool. It's solid and has a lot of potential for learning directly in the terminal. Curious how the UI will look in VSCode and Claude Code Desktop. Going to keep digging into this new release!

Claude Code 2.1.90 just dropped with a new /powerup command Run it and you get interactive lessons that teach you how to use Claude Code right inside the tool. It's solid and has a lot of potential for learning directly in the terminal. Curious how the UI will look in VSCode and Claude Code Desktop. Going to keep digging into this new release!

Daniel San

271,017 views • 2 months ago

claude design is my all time favorite anthropic drop this year, even more than opus 4.7 its actually really really good at design and the "handoff to claude code" makes it basically copy/paste ui to the actual working product claude design made the entire ui for merl (full video on merl soon)

claude design is my all time favorite anthropic drop this year, even more than opus 4.7 its actually really really good at design and the "handoff to claude code" makes it basically copy/paste ui to the actual working product claude design made the entire ui for merl (full video on merl soon)

ashen

364,480 views • 1 month ago

Claude can now write and run code. We've added a new analysis tool. The tool helps Claude respond with mathematically precise and reproducible answers. You can then create interactive data visualizations with Artifacts. Enable the feature preview:

Claude can now write and run code. We've added a new analysis tool. The tool helps Claude respond with mathematically precise and reproducible answers. You can then create interactive data visualizations with Artifacts. Enable the feature preview:

Anthropic

792,683 views • 1 year ago