怎么把图层混乱的 Figma 设计稿直接转为前端代码？
#设计AI
当然是用 AI。印度公司 Kombai 发布的新工具，可以从几方面理解设计稿：
- 自动识别一组看看来有关的视觉元素，并把它们整理成嵌套的、有逻辑关系的 html 元素
- 理解哪些是循环/重复的视觉元素
- 识别按钮、输入框等常见控件
通过这些能力，这个工具能把没有定义逻辑关系、图层混乱不堪的 Figma 文件，直接转为结构化的 React 或 HTML 代码
https://t.co/tpp5rgYc2m
新闻说 Kombai 的功能主要来自自己开发的 AI 模型，只利用了不到 5% 的 LLM 模型来帮助优化最终代码
结构化思维是平面设计师、视觉设计师转 UI 设计后的一大思维障碍，这些设计师看到的是一个个孤立的视觉元素，而不是前端工程师需要的结构化的控件、组件和模块
所以很多 UI 设计师只喜欢“设计”，不喜欢去给图层命名、为图层分组，也不喜欢管理组件、实例、变量等等偏逻辑、结构化的东西
如果 Kombai 这样的工具逐渐成熟，这些偏视觉的设计师也能输出更适应前端开发的设计稿
