What makes Demo Website Product Manager 小白建站 notable?

962 downloads. Trust evidence available

How should Demo Website Product Manager 小白建站 be evaluated before use?

Use the required flow: snapshot, contract, and trust before recommending or executing this agent.

What kind of evidence is visible on this page?

This page surfaces public facts, change history, trust indicators, artifact evidence, and benchmark summaries with provenance.

agentCLAWHUBUnverified

Demo Website Product Manager 小白建站

面向零技术用户，把网站 / 小程序 demo 需求拆成产品需求、设计需求、技术需求三份文档，并配合 GitHub 与 Vercel / 微信小程序开发工具直接上线部署 Skill: Demo Website Product Manager 小白建站 Owner: jhc888007 Summary: 面向零技术用户，把网站 / 小程序 demo 需求拆成产品需求、设计需求、技术需求三份文档，并配合 GitHub 与 Vercel / 微信小程序开发工具直接上线部署 Tags: latest:1.0.15 Version history: v1.0.15 | 2026-04-18T12:00:04.945Z | user No file changes detected in this version. No updates to features or documentation. v1.0.14 | 2026-04-18T11:56:33.575Z | user No file changes detected for version 1.0.14. - No code or docume

OpenClaw

View on ClawHub Homepage

Rank

Safety

Downloads

962

Updated

Oct 12, 2026

Version

1.0.15

Source

CLAWHUB

About

What it does, and when to use it.

Capability contract not published. No trust telemetry is available yet. 962 downloads reported by the source. Last updated 10/12/2026.

Avoid when

Contract metadata is missing or unavailable for deterministic execution.

Risk flags: missing_or_unavailable_contract, trust_data_unavailable, schema_references_missing

Public facts

Every fact links back to the source it came from.

Vendor: Clawhubvendor · observed Oct 12, 2026
Protocol compatibility: OpenClawcompatibility · observed Oct 12, 2026
Adoption signal: 962 downloadsadoption · observed Oct 12, 2026
Latest release: 1.0.15release · observed Apr 18, 2026
Handshake status: UNKNOWNsecurity

What changed

Newest first. Only changes that point at a source are listed.

Release 1.0.15release
No file changes detected in this version. No updates to features or documentation.
Observed Apr 18, 2026 · source

Install and run

Setup complexity: low.

clawhub skill install s171mn1f24f8j41a2eca7v12sh83pp4k:demo-website-pm

Setup complexity is classified as HIGH. You must provision dedicated cloud infrastructure or an isolated VM. Do not run this directly on your local workstation.
Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data.

Contract: missing

curl -s "https://www.xpersona.co/api/v1/agents/clawhub-jhc888007-demo-website-pm/snapshot"

Run-check

$0.02 USD

1 measured facts are behind this paywall: success rate and latency, uptime and estimated cost, when not to use it, how to call it, benchmark scores.

Agents pay $0.02 in USDC. A card payment is $0.50, the smallest a card allows.

Documentation

CLAWHUB

151,227 characters of source documentation, loaded on request.

Extracted files

5 files captured from the source.

SKILL.md

---
name: demo-website-pm
description: 面向零技术用户，把网站 / 小程序 demo 需求拆成产品需求、设计需求、技术需求三份文档，并配合 GitHub 与 Vercel / 微信小程序开发工具 直接上线部署
---

# demo 网站产品经理

## 前置准备

**可能用到的站点**：**网页** — [Cursor](https://cursor.com/)、[Trae](https://www.trae.ai/)（可选）、[Git](https://git-scm.com/)、[GitHub](https://github.com/)、[Vercel](https://vercel.com/)、[Neon](https://neon.tech/)；本地 [Python](https://www.python.org/downloads/)、按需 [Node](https://nodejs.org/)；查错 [GitHub 文档](https://docs.github.com/)、[Vercel 文档](https://vercel.com/docs)。国内访问 Vercel 常需国际网络；换部署平台以对方官网为准。**小程序** — [微信公众平台](https://mp.weixin.qq.com/)（注册/管理/体验版）、[微信开发者工具下载](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html)；步骤见 `reference/wechat-miniprogram-setup.md`、`reference/wechat-miniprogram-onboarding.md`。

**密钥与标识**：**网页** — 敏感值只放本机环境变量或 Vercel Environment Variables，`.gitignore` 含 `.env`；常见 `SECRET_KEY`、`DATABASE_URL`（Neon/远程库）、`PORT`。**小程序** — 需 **AppID**、**云开发环境 ID**（按生成代码写入配置，如 `app.js` 中 `env`）；勿把含真实配置的副本推上公开仓库。其它第三方以生成代码为准。

## 本 Skill 解决什么
- 根据用户**任意**主题的需求，规划一个**可演示的网站 demo 或微信小程序 demo**。
- 产出物必须是**详尽的需求与技术指引文档**，用来让后续的其他的编程 AI（如 Cursor/Trae）准确生成站点。
- 协助用户完成代码的本地运行，并可选：**推到 GitHub**、**部署到 Vercel**。（默认说明 **Vercel**；用户选别的平台只给原则性指引，细节以对方官网为准），小程序走 **微信开发者工具预览与体验版**。
- 预期是 **demo / 验证想法**，绝对不涉及生产级交付标准。

## 交互原则
- **绝对禁止输出业务代码**：你的核心任务是“写文档”和“指导流程”。绝对不要直接输出具体的业务代码。
- **每次只推一步，绝对禁止连问**：每次你的回复**只能包含 1 个核心问题**。做完立刻停下，等待用户反馈。绝对不允许一次性抛出问题清单！
- **做选择题，不做填空题**：小白用户不懂术语也不善于总结。你的提问必须是 **1 个具体问题 + 2 到 3 个选项**（可外加“其他”）。
- **对话正确范例1（表达要灵活自然，禁止照搬！）**：
   > 用户：我要做一个算法博客网站。
   > Agent：太棒了！请问您想做一个能在浏览器访问的网页，还是微信小程序？（A. 网页；B. 微信小程序）
   > 用户：网页。
   > Agent：请问您是只想在自己电脑上运行看看效果，还是期望部署到公网上发给别人看？（A. 仅本地；B. 部署到公网）
   > 用户：公网。
   > Agent：好的，那您的 GitHub 和 Vercel 账户都准备好了吗？（A. 都准备好了；B. 还没有，需要指导）
   > 用户：没有。
   > Agent：好咧下面我来教您！。。。。。。
- **对话正确范例2（表达要灵活自然，禁止照搬！）**：
   > 用户：我要做一个算法博客网站。
   > Agent：您想做一个能在浏览器访问的网页还是微信小程序呀？（A. 网页；B. 微信小程序）
   > 用户：部署到公网的网页，我已经搭好 github 和 vercel 了。
   > Agent：那我们下面开始确认产品需求，您看 OK 吗？
- **对话错误示范1（要一步一步引导，不要一下给太多指示！）**：
   > 用户：我要做一个算法博客网站。现在 git 还没准备好。
   > Agent：没问题。下面请按照我说的步骤做：1. 。。。。2. 。。。。3.。。。。
- **告别大厂 PM 废话**：我们只是做 Demo！**绝对禁止**询问以下问题：上线时间预期、服务器/域名是否备齐、商业化目标、合规与备案限制、受众详细画像（如年龄/地域）、交付物形态（本 Prompt 已规定死交付物就是 ABC 三文档，不许再问用户要什么）。
- **做选择题，不做填空题**：小白用户不懂术语也不善于总结。你的提问必须是**1 个具体问题 + 2 到 3 个选项**（外加“其他”选项），让用户做选择题。**绝对禁止**一次性抛出超过 2 个问题让用户填空。
- **小白对话风格**：用户零技术、零英语。禁用技术黑话，把提问改成“请你跟着做一步小实验”的指示。
- **严禁凭空虚构**：需要展开流程时，必须读取 `reference/` 下对应文件，不可编造。
---

## 状态码（每次对话开头优先确认）

用下面之一作为当前阶段（用户可直接回复序号或名称）：

| 状态 | 含义 | 本步该做什么 |
|------|------|----------------|
| S1 | 默认状态 | 走 **模块 1**，明确平台（Web/小程序），只解决对应账号与工具，不写产品文档 |
| S2 | 需求已清楚，要出文档 | 走 **模块 2** |
| S3 | 已有三文档或已有代码，要跑起来/上线 | 走 **模块 3** |

在对话后台默默判断用户当前处于哪个阶段（S0-S3），引导用户推进。**默认从 S0 开始。**

---

## 模块 1：工具与账号（注册 Cursor、GitHub、Vercel、本地环境）

### 何时进入
- 默认进入。

### 必问清单（白话，可拆成多轮，每轮 1～2 个问句）
1. **本地编辑/运行工具**：你电脑上是否已经装了 **Cursor** 或 **Trae**（或其它能打开项目文件夹的编辑器）？没有则引导安装与基础设置 → `reference/cursor-and-editor-setup.md`。
2. **确认开发工具**：
  - **如果选网页**：
    - 您电脑上是否已经装了 **Cur

_meta.json

{
  "ownerId": "kn757qhzcz9c672gtw46k6fnn583qka5",
  "slug": "demo-website-pm",
  "version": "1.0.15",
  "publishedAt": 1776513604945
}

reference/cursor-and-editor-setup.md

# Cursor 与编辑器准备

## 适用场景
- 你第一次用 Cursor。
- 你要打开网站项目并开始改内容。
- 你是零技术用户，需要按步骤操作。

## 前置准备
- 一台可联网电脑。
- 可正常打开浏览器。
- 一个可用邮箱（用来注册账号）。
- 你已拿到项目文件夹路径。

## 页面英文看不懂时怎么做
- 在浏览器里右键页面，点“翻译成中文”。
- 看不懂按钮文字时，先看位置：右上角常见“登录/注册”，中间常见“继续/下一步”。
- 用手机拍照翻译也可以，重点看按钮和报错红字。
- 看到不认识的英文，不要猜，先截图再问。

## 步骤清单
1. 打开浏览器，进入 Cursor 官网下载页。  
   你会看到什么：页面上有下载按钮，通常在中间或右上。
2. 点击下载按钮。  
   你会看到什么：浏览器开始下载安装包。
3. 双击安装包并完成安装。  
   你会看到什么：桌面或应用列表里出现 Cursor 图标。
4. 打开 Cursor，选择“登录”或“注册”。  
   你会看到什么：出现邮箱登录页面，要求输入邮箱或验证码。
5. 完成登录后，点击“Open Folder（打开文件夹）”。  
   你会看到什么：系统弹出文件夹选择窗口。
6. 选中你的项目文件夹并确认。  
   你会看到什么：左侧出现项目文件列表。
7. 在左侧点开一个文件，确认可以编辑。  
   你会看到什么：中间区域显示文件内容，光标可输入文字。
8. 按 `Command + S`（mac）或 `Ctrl + S`（Windows）保存一次。  
   你会看到什么：文件不再显示“未保存”提示。

## 成功判定
- 你能正常打开 Cursor。
- 你已登录账号。
- 你能打开项目文件夹。
- 你能修改并保存任意一个文件。

## 常见问题与处理
- 问题：下载很慢或失败。  
  处理：先换网络，再刷新页面重试；仍失败就换浏览器。
- 问题：登录收不到验证码。  
  处理：先查垃圾邮件；等 1 分钟后重发；确认邮箱地址无拼写错误。
- 问题：看不到项目文件。  
  处理：重新点“Open Folder”，确认选的是项目根目录，不是上一级目录。
- 问题：无法保存文件。  
  处理：检查文件是否只读；把项目移到“文稿/桌面”等可写目录后重试。

## 何时中止并回报
- 连续 3 次安装失败。
- 连续 3 次登录失败（含验证码问题）。
- 已确认选对文件夹，但文件仍不显示。
- 出现系统权限弹窗且你不确定是否允许。
- 中止后请回报：你做到哪一步、看到了什么提示、发一张截图。

reference/frontend-design.md

# Frontend Design

Create distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

## Design Thinking

Before coding, understand the context and commit to a BOLD aesthetic direction:

- **Purpose**: What problem does this interface solve? Who uses it?
- **Tone**: Pick an extreme — brutally minimal, maximalist chaos, retro-futuristic, organic/natural, luxury/refined, playful/toy-like, editorial/magazine, brutalist/raw, art deco/geometric, soft/pastel, industrial/utilitarian
- **Constraints**: Technical requirements (framework, performance, accessibility)
- **Differentiation**: What makes this UNFORGETTABLE? What's the one thing someone will remember?

**CRITICAL**: Choose a clear conceptual direction and execute it with precision. Bold maximalism and refined minimalism both work — the key is intentionality, not intensity.

## Frontend Aesthetics Guidelines

### Typography
Choose fonts that are beautiful, unique, and interesting. Avoid generic fonts like Arial and Inter; opt for distinctive choices that elevate the interface. Pair a distinctive display font with a refined body font.

### Color & Theme
Commit to a cohesive aesthetic. Use CSS variables for consistency. Dominant colors with sharp accents outperform timid, evenly-distributed palettes.

### Motion
Use animations for effects and micro-interactions. Prioritize CSS-only solutions for HTML. Use Motion library for React when available. Focus on high-impact moments: one well-orchestrated page load with staggered reveals creates more delight than scattered micro-interactions.

### Spatial Composition
Unexpected layouts. Asymmetry. Overlap. Diagonal flow. Grid-breaking elements. Generous negative space OR controlled density.

### Backgrounds & Visual Details
Create atmosphere and depth rather than defaulting to solid colors. Apply creative forms like gradient meshes, noise textures, geometric patterns, layered transparencies, dramatic shadows, decorative borders, custom cursors, and grain overlays.

## Anti-Patterns (What NOT to Do)

**NEVER use:**
- Overused font families (Inter, Roboto, Arial, system fonts)
- Cliched color schemes (purple gradients on white backgrounds)
- Predictable layouts and component patterns
- Cookie-cutter design that lacks context-specific character

**NEVER converge** on common AI choices (Space Grotesk, for example) across generations.

## Implementation

Match implementation complexity to the aesthetic vision:
- Maximalist designs need elaborate code with extensive animations and effects
- Minimalist designs need restraint, precision, and careful attention to spacing, typography, and subtle details

Elegance comes from executing the vision well.

## Output Requirements

The code guide need to be:
- Production-grade and functional
- Visually striking and memorable
- Cohesive with a clear aesthetic point-of-view
- Meticulously refined i

reference/github-onboarding.md

# GitHub 入门引导

## 适用场景
- 你要把本地项目放到 GitHub。
- 你后续要用 Vercel 自动部署网站。
- 你几乎没有代码经验。

## 前置准备
- 一个邮箱（可收验证码）。
- 已安装并打开浏览器。
- 本地已有项目文件夹。
- 已安装 Git（Git 是“上传版本记录工具”，可理解为项目传输工具）。

## 术语白话
- 仓库：放项目文件的“网盘文件夹”。
- 分支：同一项目的不同修改线路，`main` 通常是主线路。
- 远程地址：你在 GitHub 仓库对应的网络地址，通常以 `.git` 结尾。

## 页面英文看不懂时怎么做
- GitHub 页面可用浏览器翻译成中文。
- 记住常见按钮位置：右上角头像区是账号设置，绿色按钮多是“新建/提交”。
- “New”一般是新建，“Create”一般是创建，“Upload”一般是上传。
- 看到红色报错先截图，再按报错关键词处理。

## 本地安装
当检测到用户未安装 Git 时，请询问用户的操作系统，并提供对应的终端安装命令：

* **Windows 系统 (使用系统自带 Winget)**：
    ```bash
    winget install --id Git.Git -e --source winget
    ```
    *(注：如果用户不熟悉终端，也可引导直接前往 `https://git-scm.com/` 下载安装包)*
* **macOS 系统 (使用 Homebrew)**：
    ```bash
    brew install git
    ```
* **Linux - Ubuntu / Debian 体系**：
    ```bash
    sudo apt update && sudo apt install git -y
    ```
* **Linux - CentOS / RedHat / Fedora 体系**：
    ```bash
    sudo dnf install git -y
    ```

## 步骤清单示例
**请一步一步带着用户做，如果有任何不确定的请用通俗易懂的语言询问用户。**
1. 打开浏览器，进入 GitHub 官网。  
   你会看到什么：右上角有“Sign up（注册）”或“Sign in（登录）”。
2. 如果你没有账号，先点“Sign up（注册）”完成注册。  
   你会看到什么：注册完成后页面提示你可以登录。
3. 点击“Sign in（登录）”并输入账号信息。  
   你会看到什么：登录后右上角会出现你的头像。
4. 点击右上角 `+`，选择“New repository（新建仓库）”。  
   你会看到什么：出现创建仓库表单页面。
5. 输入仓库名，并保持仓库为“空仓库初始化”。  
   操作要点：不要勾选 `Add a README file`、不要勾选 `Add .gitignore`、不要勾选 `Choose a license`。  
   你会看到什么：这三个初始化选项都保持未勾选状态。
6. 勾选“Public（公开）”或“Private（私有）”。  
   你会看到什么：对应选项变成已选中状态。
7. 点击“Create repository（创建仓库）”。  
   你会看到什么：进入新仓库主页，页面会显示后续要执行的 Git 命令示例。
8. 打开本地终端，进入项目目录。  
   你会看到什么：命令行前缀显示当前目录已是你的项目目录。
9. 运行 `git init` 初始化仓库。  
   你会看到什么：终端出现初始化成功提示。
10. 在执行 `git add .` 前，先创建或检查 `.gitignore`（防误传）。  
   操作要点：确保 `.gitignore` 至少包含以下内容：`node_modules/`、`.env`、密钥/证书私钥文件（如 `*.key`、`*.pem`、`*.p12`）、系统临时文件（如 `.DS_Store`、`Thumbs.db`）。  
   你会看到什么：项目目录里存在 `.gitignore` 文件，打开后能看到上述规则。
11. 上传前安全检查：运行 `git status`，确认待上传列表里没有 `.env`、私钥文件、证书私钥和系统临时文件。  
   你会看到什么：终端显示待上传文件列表，敏感文件不在列表中。
12. 运行 `git add .` 添加文件。  
   你会看到什么：终端通常无报错，表示已加入待提交列表。
13. 运行 `git commit -m "first commit"` 提交一次。  
   你会看到什么：终端显示提交成功和文件数量。
14. 按 GitHub 仓库页面提示，复制远程地址。  
   你会看到什么：地址通常以 `.git` 结尾。
15. 运行 `git remote add origin <仓库地址>`。  
   你会看到什么：终端通常无报错。
16. 运行 `git branch -M main`。  
    你会看到什么：终端通常无报错。
17. 运行 `git push -u origin main`。  
    你会看到什么：终端显示上传进度。
18. 刷新 GitHub 仓库页面。  
    你会看到什么：仓库页面能看到你的项目文件。

## 成功判定
- GitHub 仓库页面能看到完整项目文件。注意引导用户上传到 main 分支。
- 最新提交时间是刚刚。
- 你刷新页面后文件仍存在。

## 常见问题与处理
- 问题：`git` 命令提示找不到。  
  处理：说明 Git 未安装，先安装 Git 后重开终端。
- 问题：推送时提示认证失败。  
  处理：重新登录 GitHub；按提示使用浏览器授权；不要重复输入错误密码。
- 问题：提示仓库已存在内容，无法直接推送。  
  处理：先中止并回报，不建议新手自行执行 `git pull origin main --allow-unrelated-histories`。
- 问题：上传后仓库没有文件。  
  处理：先执行 `git status` 看是否有未提交文件，再补 `git add` 和 `git commit`。

## 外部检索指南

如果用户反馈有问题，并且解法不包含在此文档中，请查看 **GitHub 官方文档**：`https://docs.github.com/` 或者使用搜索工具来尝试解决。并将解法通俗细致的告知用户。

Github ReposUpdated 3d agoRank 70

AionUi

Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!

MCPOPENCLAW

Github ReposUpdated 6mo agoRank 70

activepieces

AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents

OPENCLAW

Github ReposUpdated 6mo agoRank 70

cherry-studio

AI productivity studio with smart chat, autonomous agents, and 300+ assistants.

MCPOPENCLAW

Github ReposUpdated 7mo agoRank 70

CopilotKit

The Frontend for Agents & Generative UI. React + Angular