无原创，纯转发https://localhosthttps://localhost/posts/113https://localhost/posts/113Sun, 08 Feb 2026 09:20:51 GMT<b>WebClaw：OpenClaw 的轻量快速 Web 客户端（Beta）</b><br /><br />WebClaw 是一个面向 <b>OpenClaw</b> 的快速 Web 客户端，主打轻量、上手快，适合想用浏览器直接连接 OpenClaw Gateway 的用户与开发者。目前项目处于 <b>Beta</b> 阶段。<br /><br /><b>你可以用它做什么</b><br /><br />• 在浏览器里访问/使用 OpenClaw（通过 Gateway 连接）<br />• 本地快速启动，便于二次开发与调试<br /><br /><b>本地安装（快速开始）</b><br /><br />• 克隆项目并启动开发环境：<br /> • <code>gh repo clone ibelick/webclaw</code><br /> • <code>cd webclaw</code><br /> • <code>pnpm install</code><br /> • <code>pnpm dev</code><br /><br /><b>关键配置（连接 Gateway）</b><br />在 <code>apps/webclaw/.env.local</code> 中配置：<br /><br />• <code>CLAWDBOT_GATEWAY_URL</code><br />• 认证二选一（推荐 Token）：<br /> • <code>CLAWDBOT_GATEWAY_TOKEN</code>（推荐）或 <code>CLAWDBOT_GATEWAY_PASSWORD</code><br /><br />默认 Gateway 地址为：<code>ws://127.0.0.1:18789</code><br />相关文档：<code>https://docs.openclaw.ai/gateway</code><br /><br />链接：<br /><br />• <a href="https://webclaw.dev/" target="_blank">https://webclaw.dev/</a><br />• <a href="https://github.com/ibelick/webclaw" target="_blank">https://github.com/ibelick/webclaw</a><br /><br /><a href="/search/result?q=%23OpenClaw">#OpenClaw</a> <a href="/search/result?q=%23WebClaw">#WebClaw</a> <a href="/search/result?q=%23%E5%BC%80%E6%BA%90%E9%A1%B9%E7%9B%AE">#开源项目</a> <a href="/search/result?q=%23TypeScript">#TypeScript</a> <a href="/search/result?q=%23Web%E5%AE%A2%E6%88%B7%E7%AB%AF">#Web客户端</a><a href="https://webclaw.dev/" target="_blank"> <div>webclaw.dev</div> <img class="link_preview_image" alt="webclaw.dev" src="https://memo.miantiao.me/static/https://cdn4.telesco.pe/file/aqmtXlYmhyf_hA4NOdWZxijdzrVX4wOqdXmAApgZRg7vfpdlzjcNZeDAkkKiMQn5Jf0lO7VVjYEdj-5gEYtgCAZJck33Y4IufTmncvBQJ94nhdHpgW87gd0JDdteX0920Lk5EP2SckVkn-B8HjzdQNyvyF1f7tSylTt2XRGeIvF1H5iP2RBuS0tQCXcuwY8P6kKFVk1OOmFbLuS2y5E3o1fbIAKPmnIdB0oQcpHiHXKwZaWOMCLu3Zo4mnpGLOr_Kfajm8Q2T_ZRnZW8d4TxaHncmCAJCBK4Ex1A134KTvzcY-i8kMTbtiiPn2TjApliBTag1XxMG0HakRkxmkVpKQ.jpg" width="1200" height="630" loading="eager" /> <div>Fast web client for OpenClaw.</div> </a>https://localhost/posts/41https://localhost/posts/41Thu, 27 Nov 2025 10:32:54 GMT<b>如何更好地使用 AI 进行 UI 设计？Lovable 的 Prompt 指南</b><br /><br />这是一篇关于如何在使用 AI UI 构建工具 Lovable 时，写出更有效 Prompt 的实用指南。核心思想是通过结构化、系统化的方式与 AI 沟通，从而获得高质量、可控的设计成果。<br /><br />一个非常有效的技巧是让 AI 主动提问。在你的需求后面加上一句：“为了完全理解我的需求，请向我提问”，这样可以提前澄清细节，避免后期反复修改。<br /><br />指南将整个过程分为四个阶段：<br /><br /><blockquote> <b>1. 奠定基础</b><br /> 在动手前先做好规划，明确产品功能、目标用户和核心操作。从一开始就确定好整体的设计风格，是后续所有工作的基础。<br /></blockquote><br /><blockquote> <b>2. 系统化思考</b><br /> 不要一次性生成整个页面，而是像搭积木一样，按组件（如导航栏、卡片）进行构建。使用真实内容而非占位符，并使用具体的 UI 术语（按钮、模态框）和风格关键词（如“极简”、“电影感”）来精确传达你的意图。<br /></blockquote><br /><blockquote> <b>3. 精确构建</b><br /> 为常用布局创建可复用的 Prompt 模式以提高效率。通过 URL 直接添加图片或视频素材，并善用“编辑”功能进行微调，而不是每次都从头开始。<br /></blockquote><br /><blockquote> <b>4. 迭代与发布</b><br /> 在设计阶段就考虑后端逻辑（如用户登录状态），并有意识地对设计进行版本管理，让迭代过程清晰可控。<br /></blockquote><br />这套方法论不仅适用于 Lovable，对我们与其他 AI 工具进行高效协作也极具启发。<br /><br />原文链接：<a href="https://docs.lovable.dev/prompting/prompting-one" target="_blank">https://docs.lovable.dev/prompting/prompting-one</a><br /><br /><a href="/search/result?q=%23AI">#AI</a> <a href="/search/result?q=%23%E6%8F%90%E7%A4%BA%E5%B7%A5%E7%A8%8B">#提示工程</a> <a href="/search/result?q=%23UIDesign">#UIDesign</a> <a href="/search/result?q=%23Web%E5%BC%80%E5%8F%91">#Web开发</a> <a href="/search/result?q=%23Lovable">#Lovable</a><a href="https://docs.lovable.dev/prompting/prompting-one" target="_blank"> <div>Lovable Documentation</div> <img class="link_preview_image" alt="Prompting best practices - Lovable Documentation" src="https://memo.miantiao.me/static/https://cdn4.telesco.pe/file/Nq_tpkj-1lV-_m6wwtYwvaGAh4k8mV9TLtXo0UhMq83ZHKwhJe_FGn1Izmj6dypuYe8_54HCvYfIrYlVFYkFbRE6_Zo3yK9fQ1jbow-qaexeOGJxmeoNZ4GXSkaq69FLJX7u_NbaHWOPOGDD1AYgglyFzeDenQXD_a28wvALzo0hrH8kdgAoDMVs1jio8aKbtCgQKrjXBXTPlfj6z15plAq7E0TzMEfhbqPtwJUzKN8W3vIEDgoAYdaxI-kgYdWpSXI9ufwy0eoWmzDqVwPjMgCYHU_ywnpvXFfP3f7IBZG54z5MldMI-zAdTK4cLcUnxMJVsbATw4SXkzHFXN4m3Q.jpg" width="1200" height="630" loading="eager" /> <div>Prompting best practices - Lovable Documentation</div> <div>Plan before you prompt, build by component, use real content, and apply design buzzwords to get consistent, high-quality results.</div> </a>