菜单
Look at any web UI you build or change — render it headless with `botference see` and read the screenshots — because layout and design failures produce NO errors or warnings. Use after every UI change, before declaring done, and whenever a human says something "looks wrong".
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | see-ui |
| description | Look at any web UI you build or change — render it headless with `botference see` and read the screenshots — because layout and design failures produce NO errors or warnings. Use after every UI change, before declaring done, and whenever a human says something "looks wrong". |
Layout and design failures are invisible to your normal loop: the DOM is valid, the CSS applied, the console silent — and the page is still broken to a human eye (a chart squashed into 5% of its width renders "successfully"). Code and logs cannot catch "technically correct but looks wrong". Pixels can, and you can read pixels.
botference see <target> [label] [--viewport WxH]... [--basic-auth U:P] [--out DIR]
<target>: a URL, a bare :port (localhost), or the NAME of a
running botference service — its listening port is discovered from
the live process, you never need to know it.390x844 (phone — real mobile layout, since
responsive CSS answers to viewport width) and 1440x900 (desktop).wrote: <path>.png lines. Read those images. That is
the entire point — do not run the command and skip looking..botference/shots/ (gitignored by convention).390x844),
and compare with what they see. Do not reason about CSS from source
alone.--basic-auth helps only for HTTP
basic auth, not form gates.--virtual-time-budget is applied so client-drawn charts finish
rendering before the shot.botference see detects
that and hands the job to the see-broker service automatically,
printing the same wrote: paths. Do not retry Chrome by hand and do
not ask a human for pixels. If it reports "no see-broker service is
alive", relay exactly this to the machine owner:
botference service start see-broker -- botference see --servebotference service list shows what is running if you are unsure of
a service name.Set up and run the botference document-review interface (Google-Docs-style comments on rendered LaTeX/Markdown, bots replying in threads, apply/commit of accepted changes) in any repo — and follow the round protocol when the user asks for a review round or tags you from the review page.
Render any document the user needs to review (design docs, plans, story bibles, proposals, reports) as a self-contained HTML page with Google-Docs-style commenting — highlight text, attach notes, export feedback. Use whenever producing or updating a document whose primary purpose is for the user to READ AND REACT TO, whenever the user asks for "a review doc", or when they hand back a *.feedback.md file. The user has standing instructions that all review documents get this treatment.
Ideate and critique data visualizations using Edward Tufte's principles from "The Visual Display of Quantitative Information." Use this skill when: (1) Designing new data visualizations or charts (2) Critiquing or improving existing visualizations (3) Reviewing dashboards or reports for graphical integrity (4) Deciding between visualization approaches (5) Reducing chartjunk or improving data-ink ratio (6) Planning small multiples or high-density displays Applies principles: data-ink ratio, chartjunk elimination, graphical integrity, lie factor, small multiples, and data density.
Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me" or "grill-me".