在探索Vibe Coding的九个月里，尝试过多种工具组合后，最终沉淀出一套稳定且顺手的工作流。该流程从执行、输入到前后端交流三个层面进行优化，有效解决了指令表达不完整和UI调试繁琐的痛点，旨在提升整体的开发效率与体验。
智能速览
一套经过9个月实践验证的Vibe Coding工作流。
执行层核心选用Claude Code，其Plan Mode与编程能力表现出色。
通过Typeless进行语音输入，可更完整、连续地表达开发指令。
利用Pencil.dev串联前后端，实现了可视化UI调试与修改。
此工作流显著减少了沟通成本，提升了开发的流畅度。
精华内容
这套工作流并非简单的工具堆砌，而是将不同工具的优势有机结合，形成了从想法到产品的顺畅通道。下面将分层解析这套工具链的构成与价值。
执行核心
工作流的执行层，核心工具是Claude Code。在经过长达半年的多款coding agent对比使用后，最终选择回归Claude Code。其近两个月的更新显著提升了Plan Mode的规划能力和整体编程水平，使其成为当前市面上综合表现最佳的coding agent，为整个工作流的稳定运行提供了坚实基础。
交互革新
输入层的革新来自于Typeless这款语音输入工具。传统打字方式容易让人将复杂指令拆解成零散的短句，而语音交流则模拟了真人对话的场景，能够激发使用者更完整、连贯地阐述想法。这种“动动嘴皮子”就能驱动AI工作的体验，极大地增强了指令输入的效率和自然度。
UI桥梁
前后端交流层的关键是Pencil.dev，它充当了UI助理的角色，将前端与后端开发真正串联起来。以往调试UI，需要在浏览器和代码编辑器间反复切换，并通过截图或不专业的术语描述问题。Pencil.dev则将UI修改功能直接集成到开发流程中，如同在Claude Code里嵌入了一个Figma，让开发者可以直接在生成的界面上进行可视化调整，省去了大量沟通成本。
关键评论
有网友认为，用Cursor内置浏览器可直接点击页面元素跳转代码，实现“指哪打哪”，也是一种高效的UI修改方式。
语音输入能避免打字时的懒惰，促使人完整表达想法，同时直接修改UI的功能省去了截图的麻烦。
有读者好奇Typeless和Pencil是否可以结合Cursor一起使用，探索更多工具组合的可能性。
有使用者表示，这套工作流与自己当前正在使用的一模一样，引发了强烈共鸣。
