Aitrainee | 公众号：AI进修生
Hi，这里是Aitrainee，欢迎阅读本期新文章。
之前谷歌出来了一个 Stitch，感觉挺牛。但最近又发现个新工具，也挺猛。
这玩意儿叫 Magic Path，是 Claude Engineer (就是那个专门给 Claude 用的 Aider 类工具，效果很不错) 团队搞出来的新活。
可惜不是开源的，但有免费额度，而且挺好用。
▲ Pietro Schirano | 搞出 Claude Engineer、DesignerGPT 的那个大佬（以前在 Brex、Uber、Facebook 带过 AI 团队) 发布了 MagicPath。
号称是"设计的 Cursor 时刻"，要用 AI 在无限画布上搞创作、优化、探索。
Magic Path 到底是啥？
简单说，就是个 AI 驱动的 UI 设计工具，用起来跟 Figma 有点像。有个大画布，能拖来拖去。
但它跟 Figma 不一样，不是让你从头搭组件。它是 AI 先行，你给个简单的提示词，它就直接给你生成组件，产出的是 React 代码。
生成的组件，你可以直接拿去用，嵌入到任何地方。组件或者网页搞定后，还能改文字、字体、颜色、大小、样式这些。各种 UI 都能生成，手机端、Web 端都行。
MagicPath 亮点速览：
每个组件都是一场对话： 不管是手动编辑还是让 AI 改，都能不断优化。好的设计就是不断做好决定，MagicPath 让你在画布上随便复制粘贴互动组件，尽情探索和完善你的想法。
所见即所得，直接能跑： 你在画布上创造的一切，都是一个功能齐全的网站。可以直接在画布里跟你的产品互动。调整下大小，看看设计怎么自适应。满意了，不光能分享整个项目链接，单个画板也能单独分享。
一键生成多种方案 (Variants)： 用这个功能，能快速生成不同的设计方案，探索各种可能性，方便跟团队分享和测试。
首个同类设计工具： 让创作者不用写一行代码，就能在无限画布上做出漂亮应用。天天有人说写代码要消失了，但没人真正把代码抽象掉，MagicPath 就要干这个。
设计开发无缝衔接： 它提供生产级别的代码，你或者你队友可以直接拿去用。MagicPath 相信设计仍然是创作过程的核心，它要打造设计师和开发者之间的终极交接体验。
图片转设计/代码能力超强： Pietro Schirano 对这个功能特别自信，觉得是市面上最好的，很期待大家去玩玩。
找回 AI 的乐趣： 他说，刚接触 AI 领域时，能感受到那种无限可能的力量。但现在 AI 变得太功利了，大家好像忘了 AI 本身还有很多魔法等着被探索和解锁。MagicPath 想把这种乐趣带回来。
想试试？直接去 https://magicpath.ai创造魔法吧。
上手体验
左边是侧边栏，显示你创建的项目。每个项目都有自己的画布和组件，方便管理。免费版每天有 5 次生成机会（5个组件，每个组件可迭代提问）。
画布本身没啥特别的，跟普通画布一样能滚动操作。顶部有个分享按钮，可以把画布分享给别人。
怎么生成 UI？
点底部那个"添加"按钮，画布上会出现一个 800x600 的框，右边弹出 AI 助手面板。
生成之前，可以点个小图标，选要生成的分辨率：平板、手机、浏览器。选好后，框框会自动调整大小。当然，你也可以手动拖拽调整。
它生成的设计通常是响应式的，框框变小，内容也会跟着调整，这点挺好。然后，就可以在 AI 助手面板里输入提示词了，也能上传图片当灵感。
比如，让它搞个音乐播放器 App。
生成速度挺快，比 Stitch 甚至 Bolt 都强。UI 交互也不错，会显示规划步骤，然后开始生成组件。一会儿工夫，组件就出来了。看着还行，设计不算惊艳，但也挺好了。
牛逼之处：生成的 UI 是能用的
跟 Stitch 那种只能看不能用的设计不一样，Magic Path 生成的 UI 是完全可用 的。
不满意？点聊天图标，可以继续跟 AI 对话，让它修改。
还能可视化编辑 ，直接在生成的 UI 上选 DOM 元素，改内外边距、宽高、文字、对齐这些，不用再跟 AI 扯皮，挺方便。
"流程 (Flows)" 功能：页面串联
这个功能也挺酷，能帮你生成跟当前页面相关联的新页面。比如，你做好了主页面，想加个登录页。点"流程"选项，主页面上会出现四个点。
想在主页面前加页面，点左边的点；想在后面加，点右边的点。点了之后，它会问你想要啥样的页面。比如，让它搞个简单的登录页。
一会儿，登录页就生成好了，还会自动连条线，表示它俩关联上了。而且，新页面的设计风格会跟原来的保持一致。
代码导出和分享
有代码视图，能直接拿到 React 代码，下载到本地用。也能在新标签页里打开设计，或者分享给别人。
缺点和展望
提出的功能太系统复杂了的话，他可能生成不出来。跟提示词有关。所以提示词可以简洁一些。
比如下面这个提示词，Magic Path中没生成出来：
好吧，我想你也看到了本文的排版有些不一样了，其实我正在写这样的排版工具。
这个提示词在Bolt、V0中的效果：
总的来说，Magic Path 作为一款免费的 AI UI 设计工具，功能和体验都可圈可点。虽然还有进步空间，但潜力不小。
One More Thing
本号知识星球（汇集ALL订阅频道合集和其他）：
星球里可获取更多AI实践和资讯：
🌟 知音难求，自我修炼亦艰，抓住前沿技术的机遇，与我们一起成为创新的超级个体（把握AIGC时代的个人力量）。
参考链接：
[1] https://x.com/i/status/1927434397373825127
[2] https://www.youtube.com/watch?v=ZNwV\_hshreU
[3] https://x.com/i/status/1927434390843359402
点这里👇关注我，记得标星哦～