Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

WIP design tool: - generate new types of editable interactive objects - place them on a canvas - publish to web

nateparrott's profile picture

nate parrott

21,310 subscribers

14,457 görüntüleme • 1 yıl önce •via X (Twitter)

Bilim & TeknolojiEğitimSanat
LIVE

Anya Rossi• Live Now

Private livecam show

10 Yorum

Mahdi Farra profil fotoğrafı
Mahdi Farra1 yıl önce

looks fun! i wanna play with this

nate parrott profil fotoğrafı
nate parrott1 yıl önce

soon! in dns hell rn

Jan profil fotoğrafı
Jan1 yıl önce

looks good

Kenny profil fotoğrafı
Kenny1 yıl önce

are you building instagram story builder, but as websites, for the browser? always wanted that

nate parrott profil fotoğrafı
nate parrott1 yıl önce

I’ve been thinking about it as Figma but for html (with generated code mixed in)

Alex Danilowicz profil fotoğrafı
Alex Danilowicz1 yıl önce

Very cool!! Building a canvas is not easy! working on something similar :)

Murat Sutunc profil fotoğrafı
Murat Sutunc1 yıl önce

looks cool :) looking forward to playing with it

EcoTech Aiden profil fotoğrafı
EcoTech Aiden1 yıl önce

great example of empowering creators through interactive design tools! would love to see where this goes

Pung Worathiti profil fotoğrafı
Pung Worathiti1 yıl önce

Cool stuff! Remind me of !

Austin Guevara profil fotoğrafı
Austin Guevara1 yıl önce

Just making your own Webflow from scratch real quick eh?

Benzer Videolar

Introducing Code on Canvas in Pencil.dev AI design tool for Claude and Codex. Design ❤️ Code are officially in a relationship, opening new ways to create on canvas. Ask agent to generate custom design tools inside Pencil on the fly, create interactive components, generative art and more, but still keep the full manual design control. This is just the beginning. Let us know what you think. And let's take it to the next level together. Download the new Pencil update today.
0:57

Introducing Code on Canvas in Pencil.dev AI design tool for Claude and Codex. Design ❤️ Code are officially in a relationship, opening new ways to create on canvas. Ask agent to generate custom design tools inside Pencil on the fly, create interactive components, generative art and more, but still keep the full manual design control. This is just the beginning. Let us know what you think. And let's take it to the next level together. Download the new Pencil update today.

Tom Krcha

79,000 görüntüleme • 2 ay önce

Hundreds of full web apps, all rendered live on a single canvas, delivering the same performance you’d expect from static images. Coming soon to the best design tool near you.
0:31

Hundreds of full web apps, all rendered live on a single canvas, delivering the same performance you’d expect from static images. Coming soon to the best design tool near you.

Pietro Schirano

50,439 görüntüleme • 1 yıl önce

📄 Turning Framer from a web builder into a true design tool with Design Pages. Explore freely without contraints. When you’re ready, publish to the web in a single click. Unlimited projects, unlimited pages. Completely free.
0:54

📄 Turning Framer from a web builder into a true design tool with Design Pages. Explore freely without contraints. When you’re ready, publish to the web in a single click. Unlimited projects, unlimited pages. Completely free.

Framer

322,682 görüntüleme • 9 ay önce

Now you can use AI agents to design directly on the Figma canvas, with our new use_figma MCP tool and skills to teach them. Open beta starts today.
0:37

Now you can use AI agents to design directly on the Figma canvas, with our new use_figma MCP tool and skills to teach them. Open beta starts today.

Figma

17,854,488 görüntüleme • 3 ay önce

BREAKING 🚨: Early preview of Dynamic View on Gemini. Dynamic View (Creative Canvas) will let users render interactive canvas experiences inline within a Gemini Chat. What it can do: - Search the web - Generate Images - Render Games and more! Magic box 🤖
0:26

BREAKING 🚨: Early preview of Dynamic View on Gemini. Dynamic View (Creative Canvas) will let users render interactive canvas experiences inline within a Gemini Chat. What it can do: - Search the web - Generate Images - Render Games and more! Magic box 🤖

TestingCatalog News 🗞

134,703 görüntüleme • 7 ay önce

Art on Contract: last year I wrote an interactive tool to generate ASCII-art for TITLES’s series of smart contracts. A short thread ↓
2:17

Art on Contract: last year I wrote an interactive tool to generate ASCII-art for TITLES’s series of smart contracts. A short thread ↓

ertdfgcvb 𓅰 𓅬 𓅭 𓅮 𓅯

100,487 görüntüleme • 1 yıl önce

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,166 görüntüleme • 3 ay önce

Gave Gemini 3 Deep Think an image of a 3D spider web and asked for an interactive design tool. It generated a full design suite (procedural control, simulation, optimization) with STL export capability. I used it to engineer new metamaterials and a spider-web inspired bridge design, 3D printed it, then validated the structural integrity with a NVIDIA DGX Spark load test. A mind-blowing example of the future of material and architecture design - image in, fabrication-ready design out! Google Gemini
2:02

Gave Gemini 3 Deep Think an image of a 3D spider web and asked for an interactive design tool. It generated a full design suite (procedural control, simulation, optimization) with STL export capability. I used it to engineer new metamaterials and a spider-web inspired bridge design, 3D printed it, then validated the structural integrity with a NVIDIA DGX Spark load test. A mind-blowing example of the future of material and architecture design - image in, fabrication-ready design out! Google Gemini

Markus J. Buehler

96,354 görüntüleme • 4 ay önce

when DePIN teams start protocol design, the public tooling & foundational literature available to them is scarce, esp when compared to verticals like DeFi. to close that gap, we built an interactive tool to get a pulse check on any DePIN network design & test new features quickly
0:41

when DePIN teams start protocol design, the public tooling & foundational literature available to them is scarce, esp when compared to verticals like DeFi. to close that gap, we built an interactive tool to get a pulse check on any DePIN network design & test new features quickly

mustafa

137,497 görüntüleme • 1 yıl önce

People often ask if Rive is a design tool, an animation tool, or a competitor to Figma, After Effects, or Lottie. It’s none of those. Rive is a new way to design, build, and ship user interfaces with animation. It combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. This end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build award-winning interactive experiences across apps, games, websites, products, and vehicles.
0:20

People often ask if Rive is a design tool, an animation tool, or a competitor to Figma, After Effects, or Lottie. It’s none of those. Rive is a new way to design, build, and ship user interfaces with animation. It combines an interactive design tool, a new stateful graphics format, a lightweight multi-platform runtime, and a blazing-fast vector renderer. This end-to-end pipeline brings interfaces to life with motion. It gives designers and devs the tools to build award-winning interactive experiences across apps, games, websites, products, and vehicles.

Guido Rosso

59,850 görüntüleme • 11 ay önce

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 görüntüleme • 4 ay önce

We just shipped a major design update to Base44 - built to help you make something that's truly yours. Collaborate on a shared canvas, restyle your app's entire look in seconds, and generate assets right where you need them. It's a new playing field for designing with AI.
1:10

We just shipped a major design update to Base44 - built to help you make something that's truly yours. Collaborate on a shared canvas, restyle your app's entire look in seconds, and generate assets right where you need them. It's a new playing field for designing with AI.

Base44

551,314 görüntüleme • 1 ay önce

design tool experiments: ✍️ make design components graphically 🧑‍💻 generate code, using those components as a little design system (the idea is that you'll be able to build complicated interfaces by mocking them up in several artboards and 'attaching' them to your prompt)
0:25

design tool experiments: ✍️ make design components graphically 🧑‍💻 generate code, using those components as a little design system (the idea is that you'll be able to build complicated interfaces by mocking them up in several artboards and 'attaching' them to your prompt)

nate parrott

10,550 görüntüleme • 1 yıl önce

New interactive map tool🌎 We created a tool to illustrate the extent to which US restrictions on Ukraine’s use of ATACMS constrain Ukraine’s ability to strike important military infrastructure in Russia. Link to tool:
1:17

New interactive map tool🌎 We created a tool to illustrate the extent to which US restrictions on Ukraine’s use of ATACMS constrain Ukraine’s ability to strike important military infrastructure in Russia. Link to tool:

George Barros

496,347 görüntüleme • 1 yıl önce

Excited to launch Pencil INFINITE DESIGN CANVAS for Claude Code > Superfast WebGL canvas, fully editable, running parallel design agents > Runs locally with Claude Code → turn designs into code > Design files live in your git repo → Open json-based .pen format
1:19

Excited to launch Pencil INFINITE DESIGN CANVAS for Claude Code > Superfast WebGL canvas, fully editable, running parallel design agents > Runs locally with Claude Code → turn designs into code > Design files live in your git repo → Open json-based .pen format

Tom Krcha

1,496,013 görüntüleme • 5 ay önce

The new o1 canvas is quite impressive: "create an interactive tool that visually shows me how correlation works, and why correlation alone is not a great descriptor of the underlying data in many cases. make it accessible to nonmath people and highly interactive and engaging"
1:24

The new o1 canvas is quite impressive: "create an interactive tool that visually shows me how correlation works, and why correlation alone is not a great descriptor of the underlying data in many cases. make it accessible to nonmath people and highly interactive and engaging"

Ethan Mollick

137,714 görüntüleme • 1 yıl önce

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,325,914 görüntüleme • 4 ay önce

New Pi extension: pi-design-deck, a tool for visual design decision making. Opens a multi-slide deck in your browser with live previews of each option. Compare, pick, or generate more options. pi install npm:pi-design-deck
1:10

New Pi extension: pi-design-deck, a tool for visual design decision making. Opens a multi-slide deck in your browser with live previews of each option. Compare, pick, or generate more options. pi install npm:pi-design-deck

Nico Bailon

87,174 görüntüleme • 4 ay önce

The DESIGN.md upgrade is officially live in Stitch! 🚀 Yesterday we open-sourced the spec, and today we are giving you more tools to use it: 📄 Start with DESIGN.md: Attach a DESIGN.md right at the start of a project. Don't have one? Our new wizard will help you extract one from your code base or the web. 🔄 DESIGN.md to Design System: Upload a DESIGN.md file to generate a Design System on the canvas. 🧩 Token Support: Design Systems now support design tokens from DESIGN.md! Add them to your file and Stitch will seamlessly incorporate them. 🗑️ Clean Up: (You asked, we listened) You can now easily delete a design system. We’re excited to build the open design standard together. 👇
0:33

The DESIGN.md upgrade is officially live in Stitch! 🚀 Yesterday we open-sourced the spec, and today we are giving you more tools to use it: 📄 Start with DESIGN.md: Attach a DESIGN.md right at the start of a project. Don't have one? Our new wizard will help you extract one from your code base or the web. 🔄 DESIGN.md to Design System: Upload a DESIGN.md file to generate a Design System on the canvas. 🧩 Token Support: Design Systems now support design tokens from DESIGN.md! Add them to your file and Stitch will seamlessly incorporate them. 🗑️ Clean Up: (You asked, we listened) You can now easily delete a design system. We’re excited to build the open design standard together. 👇

Stitch by Google

194,380 görüntüleme • 2 ay önce

Something new is coming to the design canvas
0:50

Something new is coming to the design canvas

Figma

1,019,915 görüntüleme • 9 ay önce