正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

new skill: improve-ui built to audit interfaces against their own design language, inspired by shadcn's improve skill. it reads your repo's design context: DESIGN.md, CSS, shared components, etc. then finds where the UI breaks its own rules and writes a plan to fix it

Ibelick

11,285 subscribers

99,186 次观看 • 11 天前 •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)

📐Design Systems and DESIGN.md Consistency using Design Systems and DESIGN.md: ✨ Every new design automatically starts with a cohesive design system which GREATLY improves consistency (we heard you!) ✨ Edit the system, and all associated screens can be easily updated ✨ You can extract a design system from any URL ✨ Use DESIGN.md to export your design rules or import your design rules from other products (just ask your agent to create you a DESIGN.md file from your code or other context) ✨ You can start a new design by choosing from popular design systems ✨ Read more about DESIGN.md in the docs (link in thread)

Stitch by Google

219,087 次观看 • 4 个月前

Introducing prompt-kit A set of high-quality, customizable components for building AI interfaces. Built on top of shadcn/ui, starting with PromptInput, a flexible input field for chatting with AI models. New components coming soon!

Introducing prompt-kit A set of high-quality, customizable components for building AI interfaces. Built on top of shadcn/ui, starting with PromptInput, a flexible input field for chatting with AI models. New components coming soon!

Ibelick

104,121 次观看 • 1 年前

I've spent weeks turning ui-craft from a Claude-only skill into a real system — and today v1 ships. 🚀 It now has its own installer. One command and your AI agent — Claude Code, Cursor, Codex, Gemini, OpenCode — designs with actual taste. brew install --cask educlopez/tap/ui-craft 🧵 what's new

I've spent weeks turning ui-craft from a Claude-only skill into a real system — and today v1 ships. 🚀 It now has its own installer. One command and your AI agent — Claude Code, Cursor, Codex, Gemini, OpenCode — designs with actual taste. brew install --cask educlopez/tap/ui-craft 🧵 what's new

Edu Calvo

28,360 次观看 • 27 天前

just updated ui-skills: It's now a collection of the best skills for design engineering

just updated ui-skills: It's now a collection of the best skills for design engineering

Ibelick

67,332 次观看 • 2 个月前

We just added a Sora UI Kit to MagicPath. MagicPath is the only design platform where you can do this today: create high-fidelity, interactive components with AI, in your own style, on an infinite canvas. No other tool even comes close.

We just added a Sora UI Kit to MagicPath. MagicPath is the only design platform where you can do this today: create high-fidelity, interactive components with AI, in your own style, on an infinite canvas. No other tool even comes close.

Pietro Schirano

21,366 次观看 • 9 个月前

it's finally time... this is css clicker, a fully-featured incremental game where your goal is to design your own personal website and get as many views on it as possible the fun part? it's a pure-css game, meaning it has zero javascript or server-side code. have fun!

it's finally time... this is css clicker, a fully-featured incremental game where your goal is to design your own personal website and get as many views on it as possible the fun part? it's a pure-css game, meaning it has zero javascript or server-side code. have fun!

Rebane

128,732 次观看 • 1 年前

We built a better alternative to json-render & A2UI Up to 3x faster rendering & 67% fewer tokens. Far fewer broken outputs. We've been shipping Generative UI interfaces to 10,000+ developers for the past year. We know where JSON-based rendering breaks in production. So we built a new format - one that works with how models actually generate, not against it. And today we're open sourcing it: openui [dot] com

We built a better alternative to json-render & A2UI Up to 3x faster rendering & 67% fewer tokens. Far fewer broken outputs. We've been shipping Generative UI interfaces to 10,000+ developers for the past year. We know where JSON-based rendering breaks in production. So we built a new format - one that works with how models actually generate, not against it. And today we're open sourcing it: openui [dot] com

Rabi Shanker Guha

133,987 次观看 • 4 个月前

Meet #DBRX: a general-purpose LLM that sets a new standard for efficient open source models. Use the DBRX model in your RAG apps or use the DBRX design to build your own custom LLMs and improve the quality of your GenAI applications.

Meet #DBRX: a general-purpose LLM that sets a new standard for efficient open source models. Use the DBRX model in your RAG apps or use the DBRX design to build your own custom LLMs and improve the quality of your GenAI applications.

Databricks

327,781 次观看 • 2 年前

Claude Code v2.1.198 ships a new built-in skill: /dataviz It loads chart and dashboard design guidance directly into context: chart type selection, layout rules, and visual hierarchy for data-heavy UIs It also includes a runnable color-palette validator, so Claude can check contrast and accessibility programmatically instead of guessing No install needed, it comes with the CLI 👇

Claude Code v2.1.198 ships a new built-in skill: /dataviz It loads chart and dashboard design guidance directly into context: chart type selection, layout rules, and visual hierarchy for data-heavy UIs It also includes a runnable color-palette validator, so Claude can check contrast and accessibility programmatically instead of guessing No install needed, it comes with the CLI 👇

Daniel San

88,088 次观看 • 25 天前

In 30 minutes I built a chrome extension to improve any prompt before you send it right inside chatgpt I had bolt.new build it, with an express.js backend, then used Cursor to test and fix the issues now just need to roll it out to grok, claude, gemini etc!

In 30 minutes I built a chrome extension to improve any prompt before you send it right inside chatgpt I had bolt.new build it, with an express.js backend, then used Cursor to test and fix the issues now just need to roll it out to grok, claude, gemini etc!

Ian Nuttall

32,669 次观看 • 1 年前

Impeccable 3 natively supports crafting new design with diffusion (e.g. GPT Image 2) in harnesses that support it (e.g. Codex, Gemini w/ nano banana plugin). Impeccable now uses the best mode of operation for net-new vs iterative design: 1) completely new design: diffusion-first, then build w/ best practices for brand or product design (new in 3.0) 2) iterative design (additions/changes): design-system first, discovers your components, reads DESIGN/PRODUCT.md, goes to work. new live mode (new in 3.0) makes it extra convenient. Here's a tutorial documenting the whole workflow (incl. how I made the demo site in the video):

Paul Bakaus

37,577 次观看 • 3 个月前

We call this feature the Graphic Design Generator. To make your own design, just set up a frame, position your text and elements exactly where you want them, type in a prompt, and hit ‘Recraft.’ Voilà — your design is ready! Try it out here: #RecraftAI #red_panda #GraphicDesignGenerator

We call this feature the Graphic Design Generator. To make your own design, just set up a frame, position your text and elements exactly where you want them, type in a prompt, and hit ‘Recraft.’ Voilà — your design is ready! Try it out here: #RecraftAI #red_panda #GraphicDesignGenerator

Recraft

84,344 次观看 • 1 年前

introducing mesurer a tiny tool to measure spacing and align your UI on localhost npm i mesurer

introducing mesurer a tiny tool to measure spacing and align your UI on localhost npm i mesurer

Ibelick

229,138 次观看 • 3 个月前

✨Introducing YesCheff is a web app that helps you learn, cook, and enjoy your favorite recipes through step-by-step cooking guides built from real YouTube content. You can even use your own YouTube links. A small but special project where I brought all my capabilities together, from design (brand & product) to animation, and development. This project came from exploring how Al models parse data into frontend components and the development of generative interfaces. I designed and developed the structure through React components (HTML, CSS, JS) for the frontend and Node.js for the backend. This is a testament of how one could develop digital products in a less frustrating and more flexible way with the use of Al, particularly when it comes to getting the styling and functionality right. Now which foods are you eager to learn? Check it out at #YesCheff #WebApp #AI #Design #FrontendDevelopment #ReactJS #NodeJS #ProductDesign

JEHTOMS 5.0

85,142 次观看 • 9 个月前

Impeccable 3.7 brings linting to design. Until now it was a skill you asked for help. Now it's a design-system-aware feedback loop that runs while your agent builds, catching slop and design drift before they land. 🪝 Design hooks for Claude, Codex, and Cursor They run after every UI edit and quietly nudge your agent to fix slop and drift. The output isn't another wall of lint: it separates new findings from already-seen ones, flags clean scans, and asks the agent to use judgment. Fix real issues, leave intentional demos alone, save exceptions to config instead of littering your source. 🎨 Slop detection is now project-aware Reads your actual design system from DESIGN.md, your typography, palette, radius scale, and tokens, and flags drift from your system, not just generic AI slop: • this font isn't in your design system • this color is outside your documented palette • this radius doesn't match your rounded scale The same engine powers both the hooks and the CLI, and it's where we're investing next. 🖥️ Live Mode, ready for real projects Svelte/SvelteKit now preview variants as temporary framework components with live params, then accept cleanly back into your source component. Manual text edits got evidence / apply / discard routes, insertions preserve their anchors, and mapped lists and JSX slots clean up far more reliably. ⚡ Leaner core, sharper detector Rule-level evals across 3 providers and 4 niches cut guidance with no measurable lift and dropped examples that taught models bad patterns. The detector now skips hidden and screen-reader-only elements, understands OKLCH alpha and Sass-like inputs, and tightened checks for repeated kickers, oversized H1s, clipped overflow, and cramped padding. 🛠️ CLI caught up impeccable detect loads DESIGN.md by default, motion findings name the exact token or cubic-bezier instead of just "bounce," and impeccable ignores gives real CRUD for exceptions. Hooks and CLI share the same ignores. No split-brain config. Plus a much-improved interactive installer with hooks setup built in. Upgrade: npx impeccable install npm i -g impeccable

Impeccable 3.7 brings linting to design. Until now it was a skill you asked for help. Now it's a design-system-aware feedback loop that runs while your agent builds, catching slop and design drift before they land. 🪝 Design hooks for Claude, Codex, and Cursor They run after every UI edit and quietly nudge your agent to fix slop and drift. The output isn't another wall of lint: it separates new findings from already-seen ones, flags clean scans, and asks the agent to use judgment. Fix real issues, leave intentional demos alone, save exceptions to config instead of littering your source. 🎨 Slop detection is now project-aware Reads your actual design system from DESIGN.md, your typography, palette, radius scale, and tokens, and flags drift from your system, not just generic AI slop: • this font isn't in your design system • this color is outside your documented palette • this radius doesn't match your rounded scale The same engine powers both the hooks and the CLI, and it's where we're investing next. 🖥️ Live Mode, ready for real projects Svelte/SvelteKit now preview variants as temporary framework components with live params, then accept cleanly back into your source component. Manual text edits got evidence / apply / discard routes, insertions preserve their anchors, and mapped lists and JSX slots clean up far more reliably. ⚡ Leaner core, sharper detector Rule-level evals across 3 providers and 4 niches cut guidance with no measurable lift and dropped examples that taught models bad patterns. The detector now skips hidden and screen-reader-only elements, understands OKLCH alpha and Sass-like inputs, and tightened checks for repeated kickers, oversized H1s, clipped overflow, and cramped padding. 🛠️ CLI caught up impeccable detect loads DESIGN.md by default, motion findings name the exact token or cubic-bezier instead of just "bounce," and impeccable ignores gives real CRUD for exceptions. Hooks and CLI share the same ignores. No split-brain config. Plus a much-improved interactive installer with hooks setup built in. Upgrade: npx impeccable install npm i -g impeccable

Impeccable

231,169 次观看 • 1 个月前

A basic version of Vercel built in v0 – there's no doubt I'd start this way if I was rebuilding the dashboard from scratch shadcn has made it possible to start quickly and then make the design & identity your own

A basic version of Vercel built in v0 – there's no doubt I'd start this way if I was rebuilding the dashboard from scratch shadcn has made it possible to start quickly and then make the design & identity your own

Guillermo Rauch

156,853 次观看 • 1 年前

We finally have a "Figma for AI agents." It's called Awesome-design-md. A curated collection of UI systems extracted from 50+ top websites, formatted specifically for coding agents. Instead of parsing screenshots or messy design files, you drop a DESIGN.md straight into your project. It upgrades your AI's UI skills instantly. > Unlocks 50+ elite design systems: Cursor, Vercel, Stripe, Spotify, SpaceX, and more > Structured into 9 clear sections: typography, spacing, elevation, rules > Includes light/dark previews for quick visual checks > Uses Google Stitch's native plain-text format for LLMs Every file also comes with an Agent Guide, ready-to-use prompts included. 100% Free. Open Source.

We finally have a "Figma for AI agents." It's called Awesome-design-md. A curated collection of UI systems extracted from 50+ top websites, formatted specifically for coding agents. Instead of parsing screenshots or messy design files, you drop a DESIGN.md straight into your project. It upgrades your AI's UI skills instantly. > Unlocks 50+ elite design systems: Cursor, Vercel, Stripe, Spotify, SpaceX, and more > Structured into 9 clear sections: typography, spacing, elevation, rules > Includes light/dark previews for quick visual checks > Uses Google Stitch's native plain-text format for LLMs Every file also comes with an Agent Guide, ready-to-use prompts included. 100% Free. Open Source.

Simplifying AI

12,824 次观看 • 6 天前

What if your model handled its own tuning? ⚙️ With NVIDIA TAO 7, just prompt your coding agent what you want in plain language and let it do the rest. • Agent skills plug into your coding agent and improve accuracy. • AutoML removes the guesswork from hyperparameters. LLM-guided tuning finds strong configs up to 2x faster. • Fine-tune any Hugging Face CV or VLM model on local NVIDIA GPUs. • Data enhanced fine-tuning helps your agent identify why the model fails, then fix it. Try TAO skills ➡️

What if your model handled its own tuning? ⚙️ With NVIDIA TAO 7, just prompt your coding agent what you want in plain language and let it do the rest. • Agent skills plug into your coding agent and improve accuracy. • AutoML removes the guesswork from hyperparameters. LLM-guided tuning finds strong configs up to 2x faster. • Fine-tune any Hugging Face CV or VLM model on local NVIDIA GPUs. • Data enhanced fine-tuning helps your agent identify why the model fails, then fix it. Try TAO skills ➡️

NVIDIA AI

41,902 次观看 • 26 天前

Burned 200k tokens just for "animations" and still AI couldn't do it well. I tried one of the expert animation design engineer's, Emil Kowalski's Agent Skill on my website to improve animation using Grok 4.5 It analyzed the UI, found issues, came up with a good plan, and iterated multiple times. The end result actually made parts of the UX worse. Also, it never suggested the animation experience I had in mind. So I explained exactly how I wanted it to feel. It got much closer, but still missed details like applying the same animation during keyboard navigation between cards. That silly. The lesson isn't about the model or the Agent Skill. But it's about, "Even the strongest models can't infer your taste yet." They can't and won't suggest it. AI only executes. You have to define the experience with enough details for it to execute. Otherwise, you'll end up with something that's almost okay, but still not what you wanted

Burned 200k tokens just for "animations" and still AI couldn't do it well. I tried one of the expert animation design engineer's, Emil Kowalski's Agent Skill on my website to improve animation using Grok 4.5 It analyzed the UI, found issues, came up with a good plan, and iterated multiple times. The end result actually made parts of the UX worse. Also, it never suggested the animation experience I had in mind. So I explained exactly how I wanted it to feel. It got much closer, but still missed details like applying the same animation during keyboard navigation between cards. That silly. The lesson isn't about the model or the Agent Skill. But it's about, "Even the strongest models can't infer your taste yet." They can't and won't suggest it. AI only executes. You have to define the experience with enough details for it to execute. Otherwise, you'll end up with something that's almost okay, but still not what you wanted

The Bugged Dev

25,340 次观看 • 14 天前

We tested a lot of design skills in Codex and other AI agents. They fix the old AI slop. But they often create a new one: the “taste skill look.” - Same premium sections. - Same editorial typography. - Same generated-design smell. Open Design does not rely on one taste prompt. It combines skills, systems, critique loops, and local harnesses to make AI pages feel less generated and more designed. This page was generated directly in Open Design.

We tested a lot of design skills in Codex and other AI agents. They fix the old AI slop. But they often create a new one: the “taste skill look.” - Same premium sections. - Same editorial typography. - Same generated-design smell. Open Design does not rely on one taste prompt. It combines skills, systems, critique loops, and local harnesses to make AI pages feel less generated and more designed. This page was generated directly in Open Design.

Open Design

44,061 次观看 • 1 个月前