界面原型 v2:能力社区 初稿 v0.2
按 2026-10-08 第二轮讨论重做。结构:左侧上下两个列表(五个固定板块 + 历史会话),右侧是能力卡片组成的玩法社区(官方发布 + 用户分享),底部常驻一个支持图片与文件的对话入口。新建任务页不留白,用滚动的建议提示词和本周热门玩法引导第一次使用的人。视觉规范改用 shadcn/ui 默认主题(Neutral),见页末 设计规范。
Q1 · 主框架:电脑优化板块(能力社区)
左侧:上方五个固定项,下方历史会话(标题不超过 12 个中文字,超长缩略)。右侧:板块标题、搜索、筛选,然后是能力卡片。每张卡有封面图、标题、一句话说明、发布者(官方或社区用户)、使用人数。底部是常驻对话入口。
电脑优化
268 个玩法 · 本周新增 14Q2 · 新建任务页:不留白
点「新建任务」看到的页面。上方一句问候,中间三行自动滚动的建议提示词(悬停暂停,点一下就填进输入框),下面是本周热门玩法,底部是输入框。第一次用的人不需要想第一句话。
你好,我是小D 🐬 今天想让我帮你做点什么?
不知道怎么说也没关系。点一条试试,或者直接把文件、截图拖进来。
Q3 · 玩法详情(Sheet)
点一张卡片,从右侧滑出详情。先说清它会做什么、需要什么,再给评价,最后是「使用」和「基于它改一个」。
电脑优化
老爸的电脑每周自动清理
- 每周日早上检查启动项和新装软件
- 清理临时文件与更新缓存(不碰文档和下载)
- 发现捆绑软件或新自启项,只通知你,不自动卸载
- 每月发一份简单的报告
Q4 · 使用玩法后的会话
点「使用这个玩法」后进入会话。流程和 v1 的 P2 一样(诊断、让用户选、结果对比),这里换成 shadcn 规范,并在结尾加了「发布到社区」的入口。点步骤按钮切换。
Q5 · 发布玩法
用户点「发布到社区」后看到的表单。标题、简介、步骤由小D 从这次会话自动生成,用户只改改字、选封面和板块。路径、文件名、账号自动脱敏。
2. 清理临时文件与更新缓存(不碰文档、下载)
3. 发现问题只通知
4. 每月一份简单报告
由本次会话自动整理,可以改
Q6 · 游戏辅助板块
同一框架,不同板块。板块顶部可以放一条板块专属的工具条,游戏辅助这里是「游戏模式」开关。
游戏辅助
142 个玩法🎮 游戏模式 Alt+D · 已开启Q7 · 实用工具板块:拖文件
实用工具板块的卡片大多由文件触发。把文件拖到窗口任何位置,右下角出现意图菜单;也可以先选卡片再拖文件。
实用工具
391 个玩法深色模式
shadcn 的 .dark 变量集。客户端已有自动深浅色切换,直接映射。
电脑优化
设计规范(shadcn/ui 默认主题)
以 ui.shadcn.com/docs/theming 的默认主题为准,base color 选 Neutral。客户端是 Svelte 5,生产实现用 shadcn-svelte(同一套 token 与组件 API 的 Svelte 移植),不是 React 版。
Token
| 变量 | 浅色 | 深色 | 用在哪 |
|---|---|---|---|
--background / --foreground | oklch(1 0 0) / oklch(0.145 0 0) | oklch(0.145 0 0) / oklch(0.985 0 0) | 页面底与正文 |
--card | oklch(1 0 0) | oklch(0.205 0 0) | 能力卡、ask 卡、composer |
--primary / --primary-foreground | oklch(0.205 0 0) / oklch(0.985 0 0) | oklch(0.922 0 0) / oklch(0.205 0 0) | 主按钮、官方角标、头像 |
--secondary / --muted / --accent | oklch(0.97 0 0) | oklch(0.269 0 0) | 次按钮、tabs 底、用户气泡、社区角标 |
--muted-foreground | oklch(0.556 0 0) | oklch(0.708 0 0) | 说明文字、使用人数、占位符 |
--border / --input | oklch(0.922 0 0) | oklch(1 0 0 / 10%) / 15% | 卡片边、输入框边 |
--ring | oklch(0.708 0 0) | oklch(0.556 0 0) | 焦点环、推荐选项高亮 |
--destructive | oklch(0.577 0.245 27.325) | 同 | 危险操作卡、停止 |
--sidebar / --sidebar-accent | oklch(0.985 0 0) / oklch(0.97 0 0) | oklch(0.205 0 0) / oklch(0.269 0 0) | 左侧栏底与选中项 |
--radius | 0.625rem;sm = −4px,md = −2px,lg = 基准,xl = +4px | 按钮 md,卡片 lg,composer 与应用框 xl | |
字体与字号
- 字体栈:Geist / Inter 作为拉丁字体,中文回落 PingFang SC、Microsoft YaHei、Noto Sans SC。客户端现有的字间距 0.08em 取消,按 shadcn 默认。
- 正文 13px / 1.5;卡片标题 13px 600;板块标题 16px 600;新建任务问候 22px 600 字间距 −0.02em;说明与元信息 11.5px muted。
组件映射
| 界面元素 | shadcn 组件 | 说明 |
|---|---|---|
| 左侧栏 | Sidebar(SidebarGroup × 2、SidebarMenu、SidebarFooter) | 上组固定 5 项,下组历史列表放在 ScrollArea 里;宽 224px,可折叠为图标栏 |
| 五个固定项 | SidebarMenuButton | 「新建任务」用 outline 变体突出,其余 ghost,选中态 sidebar-accent |
| 历史会话 | SidebarMenuButton size="sm" | 标题不超过 12 个中文字符,超长 text-overflow ellipsis;按今天 / 昨天 / 更早分组;标题由 fast 模型从首轮生成(现有 summarize_tab_title 改为 12 字上限) |
| 能力卡片 | Card + AspectRatio(16/9) + Badge + Avatar | 封面图在上,标题 1 行、说明最多 2 行,底部发布者行;hover 时轻微抬升 |
| 板块筛选 | Tabs | 推荐 / 官方 / 社区 / 最新;实用工具板块按文件类型分 |
| 搜索 | Input + Command(⌘K) | 搜玩法与历史会话 |
| 玩法详情 | Sheet(side="right") | 不离开列表;宽 380px |
| 选择卡 / 意图菜单 | Card + RadioGroup / Checkbox + Button | 推荐项用 ring 高亮并预选;复用现有 ask_user 机制 |
| 对话入口 | Textarea + Button(outline, sm) × 3 + Button | 图片、文件、截屏三个附件入口,支持粘贴与拖放;附件以 Badge 形式显示在输入框上方 |
| 建议提示词 | Badge(outline) 组成的 marquee | 三行,38s / 52s 一轮,方向交替,hover 暂停,prefers-reduced-motion 时改静态 |
| 发布表单 | Dialog + Input + Textarea + Tabs + Toggle | 自动生成文案,用户只改不写 |
| 通知、周报、订阅、游戏浮窗 | Toast / Card / Dialog | 沿用 v1 思路换皮 |
内容规则
- 封面:16:9,官方卡用统一插画风格,社区卡可上传或从模板选;没有图时用板块默认封面。
- 角标:官方用 primary,社区用 secondary,热门与新发布用绿色 / 琥珀色语义色。
- 发布者行:头像(首字)、昵称(最多 6 字缩略)、使用人数;社区卡再加点赞数。
- 玩法是「步骤与意图」,不是脚本。别人使用时由小D 重新执行,脱敏在客户端完成,发布需审核。
待核实
- 社区的审核流程、激励(点赞、使用人数、是否有积分奖励)、举报与下架规则。
- 社区玩法的格式:步骤与意图的结构化定义,以及与现有「技能候选」提取机制的关系。
- 板块顶部是否保留「本机状态」摘要(健康分)。v2 把它收进「开机体检」卡,是否需要常驻展示待定。
- 历史会话标题 12 字的生成规则与分组方式。
- 建议提示词的来源:人工维护的清单、社区热门、还是按本机状态生成,三者如何混合。
- shadcn-svelte 与现有 Svelte 5 代码的接入成本(Tailwind 引入、现有 design-tokens.md 作废)。