无限画布对比设计
首图和页面设计阶段,所有方案铺在一张可缩放的画布上。拖拽摆放、双击预览、点心标记,多平台多版本一眼看清。
端到端盖出能跑的 Web 应用、iOS/Android 原生 App 或 PC 桌面应用,不只是设计页面——从调研、视觉,到数据库、API、前后端全栈,再到部署上线。每个阶段都有产物、有进度、有可以拍板的节点。
竞品分析、核心矛盾梳理,产出产品 brief 与竞品矩阵。
看板抓参考图、整页截图,登记成可点选的参考清单。
看板批量出首图方案,铺到无限画布上缩放、点心、对比。
画布每个页面 × 每个平台的设计稿排到画布,页面地图盯版本。
画布模块清单、ER 图、表结构 DDL、API 契约,定清楚再动手。
看板脚手架、Web 全栈 / 原生 App / 桌面应用,TDD 测试,实现界面对着设计稿一一比对。
看板Web 走本地 Docker、Cloudflare 或单机;iOS 上 TestFlight、Android 上 Google Play;PC 桌面应用打包成安装包,上线即出交付报告。
看板对话是主通道,操作台是另一只眼睛。两边共享同一份状态,你随时看进度、翻产物、给 agent 留言、在画布上拍板。
首图和页面设计阶段,所有方案铺在一张可缩放的画布上。拖拽摆放、双击预览、点心标记,多平台多版本一眼看清。
右侧收件箱常驻所有阶段。你写反馈,agent 回复,有未读会亮角标。
agent 不确定时,顶部浮出选择条,给你几个具体选项点一下,它再继续。
预览图上画个框、加句话,把标注过的局部发给 agent,比打字描述准得多。
首页一排卡片,7 段进度条显示每个项目走到第几步。
把右边这段提示词复制,粘进 Claude Code(或 Claude 桌面端)。它会自己装好或更新到最新、再启动操作台,全程不用你手动分步。
/productflow-init、/productflow-start 走已经装过了?再贴一次这段就会检查并更新到最新(会报告版本变化、补上新增的 skill);或直接在操作台点版本号、跑 /productflow-update——都不用重装。必需:Python3 + Claude Code + 一个 OpenAI 生图 key(③首图/④页面 AI 生图用,生图 skill openai-image-gen 随 ProductFlow 一起装好);Playwright / Docker 可选,缺了只降级不挡主流程。
请帮我在这台电脑上安装或更新并启动 ProductFlow(一个把"做互联网产品"变成 7 阶段流水线、配本地操作台的 Claude Code 工具,从落地页到带后端数据库的 Web 应用、iOS/Android 原生 App、PC 桌面应用都能做)。**没装过就装;已经装过就检查并更新到最新**。下面每步你来执行,做完告诉我怎么用:
1. 装好或更新代码(装过就拉最新并报告版本变化):
DIR=~/.local/share/productflow
if [ -d "$DIR/.git" ]; then
OLD=$(cat "$DIR/productflow/VERSION" 2>/dev/null)
git -C "$DIR" pull --ff-only
echo "ProductFlow 已更新:$OLD → $(cat "$DIR/productflow/VERSION" 2>/dev/null)"
else
git clone https://github.com/hongnono-wdh/productflow.git "$DIR" && echo "ProductFlow 已安装 $(cat "$DIR/productflow/VERSION")"
fi
2. 把全部 skill 软链进 Claude Code 的 skills 目录(已存在会覆盖更新,自动补上新增的 skill):
mkdir -p ~/.claude/skills
for s in "$DIR"/*/; do [ -f "$s/SKILL.md" ] && ln -sfn "${s%/}" ~/.claude/skills/"$(basename "$s")"; done
3. 一并装好 Playwright + chromium(②找参考截图、⑥端到端测试要用——建议安装时就装上,免得到时缺、体验差;装不上也没关系,相关阶段会降级):
pip install playwright && playwright install chromium
4. 跑自检(查依赖 + 跑测试,确认装对/更新对了;会顺带迁移老项目数据):
python3 "$DIR/productflow/scripts/setup.py"
自检会硬性检查(缺了报致命、挡安装):claude 在 PATH、生图 skill openai-image-gen 已装(随本仓库软链上去)、~/.config/openai/env 里有 OpenAI key(③首图/④页面 AI 生图必需)。**没配 OpenAI key 就提醒我去配 OPENAI_API_KEY / OPENAI_BASE_URL。** Docker 是可选项(⑦本地部署用到再装),缺了只降级不挡主流程。
5. 启动操作台:
sh "$DIR/productflow/scripts/start.sh"
然后告诉我操作台地址 http://127.0.0.1:7717/、当前版本号,以及"以后再贴这段、或在操作台点版本号 / 跑 /productflow-update,就能再检查更新"。
必需:Python3 + Claude Code + OpenAI 生图 key(openai-image-gen skill 随仓库一起装);Playwright / Docker 可选。
从落地页到带数据库后端的 Web 应用,到 iOS(SwiftUI+SwiftData)/ Android(Compose+Room)原生 App,再到 PC 桌面应用(Tauri),端到端盖出能跑的完整产品。
操作台只监听 127.0.0.1,项目、key、部署凭证全在本机,不上云、不暴露公网。
选参考、挑首图、确认理解这些拍板动作留给你,agent 跑流程、你定方向。
productflow 主流程、/productflow-init 自检、/productflow-start 启动、/productflow-update 升级。
没 Playwright、没 Docker?这些可选项缺了相关阶段自动降级,主流程照样走完。(核心三件套:Python3 / Claude Code / OpenAI 生图 key。)
操作台检测到新版会在 7717 横幅提示;网页一键或 /productflow-update 都行——git pull + 自动迁移,项目数据原样保留。
v2.14 操作台重写为 React + 全局 WebSocket 实时推送(端上零 Node、直接跑编译产物、局部渲染无闪烁)。v2.6–2.7 新增 iOS / Android 原生 App(SwiftUI+SwiftData / Compose+Room)与 PC 桌面应用(Tauri),与 Web 四端区分构建上架。v2.1 已由 3 个用户视角端到端走完 ①调研 → ⑦部署、三个项目本地 Docker 上线、E2E 全绿(含 React e2e 6/6)。