[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"tag-ai-design-tool":3},{"tag":4,"articles":11},{"id":5,"name":6,"slug":7,"article_count":8,"description_zh":9,"description_en":10},"1cfcdf9f-a2e5-4548-989e-00c10b4d39b5","AI design tool","ai-design-tool",4,"AI 設計工具把提示詞、版型與設計系統接到同一條工作流，讓原型、簡報、提案頁與行銷素材能從程式碼庫或既有元件快速生成並持續迭代，重點在於縮短設計與開發之間的來回。","AI design tools connect prompts, layouts, and design systems in one workflow, so teams can generate prototypes, slide decks, landing pages, and marketing assets from codebases or existing components, then refine them with comments and direct edits.",[12,21,29,37],{"id":13,"slug":14,"title":15,"summary":16,"category":17,"image_url":18,"cover_image":18,"language":19,"created_at":20},"c360e670-2cca-4abf-b1ad-421babbfa13c","claude-design-codebase-aware-system","The Core Tech Behind Claude Design: Building Design Systems from Your Codebase","Claude Design's most under-discussed feature is codebase-aware onboarding: Claude scans your repo and design files to automatically build a design system of colors, typography, and components that every future project inherits. For developers, this marks an AI agent's leap from \"writes code\" to \"understands design tokens and systems.\" This article unpacks what that means for AI agents and design engineering.","ai-agent","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1776609017783-3tvs.png","en","2026-04-19T13:59:57.150764+00:00",{"id":22,"slug":23,"title":24,"summary":25,"category":26,"image_url":27,"cover_image":27,"language":19,"created_at":28},"1101e3d5-4696-48f1-99e4-11ef80d1a08c","claude-design-features-guide","Inside Claude Design: From Prompt to Slide Deck in One Conversation","What sets Claude Design apart isn't the initial output; it's the refinement. Users can iterate via chat, drop inline comments on specific elements, edit text directly, or drag real-time adjustment sliders (spacing, color, layout) that Claude itself generates. This guide walks through Claude Design's five output types, four refinement channels, and export options to help you decide if it fits your workflow.","tools","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1776609016113-z9k9.png","2026-04-19T13:58:42.151769+00:00",{"id":30,"slug":31,"title":32,"summary":33,"category":34,"image_url":35,"cover_image":35,"language":19,"created_at":36},"4c6580e5-60d6-4390-8d9f-1cea84f0fae5","claude-design-vs-figma-canva","Figma Stock Dips as Claude Design Redraws the Design Tool Battlefield","Figma's stock dropped the day Anthropic launched Claude Design. Figma is defending collaborative-design territory, Canva chose partnership (Claude Design exports directly to Canva), and Adobe leans on Firefly for generative design. The AI-native design tool era has arrived—and the design industry must grapple with workflows being redefined, not just a new tool on the shelf.","industry","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1776609022393-87x3.png","2026-04-19T13:57:34.211844+00:00",{"id":38,"slug":39,"title":40,"summary":41,"category":42,"image_url":43,"cover_image":43,"language":19,"created_at":44},"9245be69-14ae-4bf3-91ef-d2366b08e460","claude-design-anthropic-launch","Claude Design Launches: Anthropic's AI Design Tool Enters Beta","Anthropic Labs launched Claude Design on April 17, letting users generate prototypes, slides, one-pagers, and marketing collateral through conversation. Powered by Opus 4.7 and available to Pro, Max, Team, and Enterprise subscribers as a research preview, Claude Design reads a team's codebase and design files during onboarding to auto-build a design system of colors, typography, and components that every subsequent project inherits.","model-release","https:\u002F\u002Fxxdpdyhzhpamafnrdkyq.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Fcovers\u002Finline-1776605423840-xgho.png","2026-04-19T12:48:27.45788+00:00"]