Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add djblack1209-coder/OpenClaw-Bot --skill ux-walkthroughgit clone --depth 1 https://github.com/djblack1209-coder/OpenClaw-BotWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/djblack1209-coder/openclaw-bot/ux-walkthrough)<a href="https://agentmods.dev/skills/djblack1209-coder/openclaw-bot/ux-walkthrough"><img src="https://agentmods.dev/badge/skills/djblack1209-coder/openclaw-bot/ux-walkthrough/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/djblack1209-coder/openclaw-bot/ux-walkthrough"><img src="https://agentmods.dev/badge/skills/djblack1209-coder/openclaw-bot/ux-walkthrough.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00072 | $0.01975 |
| Opus 5.5 | $0.00029 | $0.00790 |
| Sonnet 5.5 | $0.00014 | $0.00395 |
| Haiku 4.5 | $0.00007 | $0.00198 |
Grade A, and why
ux-walkthrough-skill scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 291 lines — stays where its author put it; the contents beside it link to each section on GitHub.
UX Walkthrough Skill
以资深用户体验专家的视角，系统性走查产品中的体验问题，并生成详细的问题报告。
核心能力
- 阅读 PRD 理解产品目标和核心用户流程
- 以用户视角模拟完整的使用流程
- 识别 UI/UX 问题（一致性、可用性、可访问性）
- 识别功能流程中断点和错误处理问题
- 生成结构化的问题报告
适用场景
- 产品上线前的体验质量检查
- 新功能开发后的走查验收
- 定期的产品体验审计
- 用户反馈问题的系统性排查
使用方法
基础用法
"帮我做一次 UX 走查"
"检查一下这个产品的体验问题"
指定范围
"走查评测到课程的完整流程"
"检查仪表板页面的体验问题"
指定重点
"重点检查错误处理和边界情况"
"关注移动端的体验问题"
实现流程
Step 1: 理解产品
-
阅读 PRD（
docs/PRD.md）- 理解产品目标和核心价值
- 识别目标用户群体
- 梳理核心用户流程
-
阅读项目结构
- 了解页面结构（
app/目录） - 了解组件结构（
components/目录）
- 了解页面结构（
-
输出理解摘要
产品目标：[一句话概述] 目标用户：[用户画像] 核心流程：[流程1] → [流程2] → [流程3]
Step 2: 定义走查范围
根据产品结构，确定走查的页面和流程：
| 流程 | 涉及页面 | 优先级 |
|---|---|---|
| 新用户引导 | 首页 → 评测 → 结果 | P0 |
| 日常学习 | 仪表板 → 课程 → 完成 | P0 |
| 进度查看 | 仪表板 | P1 |
Step 3: 执行走查
按以下维度检查每个页面/流程：
3.1 页面加载体验
- 加载状态是否清晰？
- 加载失败是否有友好提示？
- 加载时间是否在合理范围？
3.2 视觉一致性
- 颜色使用是否一致？
- 字体大小层级是否清晰？
- 间距和对齐是否统一？
- 图标风格是否一致？
3.3 交互体验
- 按钮状态（hover/active/disabled）是否清晰？
- 表单输入是否有适当反馈？
- 点击区域是否足够大？
- 操作结果是否有反馈？
3.4 流程连贯性
- 流程中断时是否有挽回机制？
- 步骤之间的衔接是否自然？
- 用户是否知道当前在哪里、接下来做什么？
- 是否有不必要的步骤可以省略？
3.5 错误处理
- 错误信息是否清晰易懂？
- 错误发生后是否有恢复路径？
- 网络错误是否有重试机制？
- 是否有防止用户犯错的设计？
3.6 边界情况
- 空状态是否有引导？
- 数据过多时是否有分页/加载更多？
- 极端数据（很长的文字等）显示是否正常？
- 首次使用和重复使用体验是否都顺畅？
Step 4: 汇总问题
按以下格式整理发现的问题：
## UX 走查报告
### 📊 概览
- 走查范围：[范围描述]
- 发现问题：共 X 个（P0: X / P1: X / P2: X）
- 走查日期：[日期]
### 🔴 P0 严重问题（必须修复）
影响用户完成核心任务的问题
#### 问题 1: [问题标题]
- **位置**: [页面/组件]
- **现象**: [问题描述]
- **影响**: [对用户的影响]
- **建议**: [修复建议]
- **截图/代码**: [如有]
### 🟠 P1 重要问题（应该修复）
影响用户体验但不阻塞任务的问题
#### 问题 X: [问题标题]
...
### 🟡 P2 建议优化（可以改进）
体验优化建议
#### 建议 X: [建议标题]
...
### ✅ 做得好的地方
- [好的设计1]
- [好的设计2]
### 📝 后续建议
- [建议1]
- [建议2]
Step 5: 验证修复
如果用户修复了问题，可以帮助验证：
- 检查修复是否解决了原问题
- 检查修复是否引入了新问题
- 更新问题状态
本项目走查指南
核心用户流程
根据 PRD，本产品的核心流程是：
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 1mo ago First seen · 291 lines · 72 tokens per session scan A 4e3207cfb901
ux-walkthrough-skill is a skill published in the GitHub repository djblack1209-coder/OpenClaw-Bot (5 stars, last pushed 4d ago), licensed Apache-2.0. It adds 72 tokens to every session and 1,975 once invoked, about $0.0003 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
kortix-ui
Build React UI with @kortix/ui, the Kortix component library and the whole Kortix session experience as modules (session workspace, thread, composer, side panel, files, file viewer, terminal, project sidebar and home, customize pages): Kortix Apps, white-label hosts, custom dashboards on @kortix/sdk and apps/web. Load…
overwatch-slidedeck
Build interactive live slide decks with Vite + React 19, TanStack Router, WebGPU shaders, Framer Motion orchestration, 1920x1080, access-gated SPA. 39 components (layout, interaction, graphics, chrome, navigation), direction-aware slide transitions, presenter mode with speaker notes and BroadcastChannel sync…
mindnode-ui
Build MindNode-inspired mind mapping interfaces — 8 node shapes, 27+ themes, layout algorithms (horizontal, vertical, radial with D3), keyboard shortcuts, focus mode, dual view. React + xyflow/react v12 + Zustand + Tailwind. Triggers on mind map, visual thinking tool, node-based diagram, brainstorm canvas, MindNode.
paper-design
Design and prototype in Paper Design (app.paper.design) — read/write designs via MCP, convert to React/Tailwind code, import HTML/CSS, sync design tokens. Also covers Paper Shaders (@paper-design/shaders-react) — 30+ shader React components (mesh gradient, fluted glass, liquid metal, god rays, halftone, grain…
channels-setup
Use when a developer wants to build their first CopilotKit Channels agent and get it answering in Slack or Microsoft Teams: "set up a channel", "connect my agent to Slack", "get my agent into Teams", or starting from nothing and wanting a working channel end to end. Covers the whole path: inspecting or scaffolding the…
frontend-feature
Build a new page, view, or data-driven feature in the Next.js frontend. Use when adding a route under the dashboard/marketing area, wiring UI to a backend endpoint, adding client state, or creating a localized page. Covers App Router, data fetching, Zustand stores, and i18n.