企业官网建设流程全解析

WorkBuddy 工作台：把"个人效率系统"装进一个网页

一、什么是 WorkBuddy 工作台

WorkBuddy 工作台是一套为不同人群定制的网页版个人数字工作台。你不需要装 App、不用搭服务器，描述一下自己的需求，就能生成一个单文件 HTML，电脑手机都能用，还能一键部署成在线链接、多设备实时同步。

它背后由专门的"工作台搭建师（小台）“负责，沉淀了 48 个真实案例的规范、8 条不可妥协的"铁律”——核心目的就一个：生成的页面真的能用、长期能用、谁拿到都能上手。

二、五大人群，对应典型工作台

每次最多 3–4 个模块，避免功能过载——先把核心跑通，再按需迭代加。

三、一个真实例子：刚搭的「项目进度工作台」

这就是我们上一轮实际做出来的东西，拿来当样例最直观：

场景：你同时盯 7 个项目（model-agent、天梯赛、huber算子、光子agi、电商erp、openbm、mindstudio），各有截止日，需要一个"一眼看清谁快到期"的看板。

拆出来的 3 个模块 + 1 个置顶区：

1. 今天要处理（置顶）：自动列出逾期 + 3 天内到期的项目，标红 + 一键更新进度。
2. 整体概览：手写 SVG 环形图看平均进度，卡片统计总数/紧急数/已完成数。
3. 项目看板：卡片流，滑块直接拖进度，状态徽章自动算（逾期/紧急/临近/进行中/已完成），支持筛选。
4. 数据备份：导出 JSON、导入恢复、清空（二次确认）。

几个硬亮点（也是小台铁律的体现）：

• 自动倒计时：每个项目实时算"剩 N 天"，过了截止日自动变红——刚才 huber算子开发 8/19 到期，今天就已是紧急标红。
• 零外链全内联：图标、图表全是手写 SVG，断网也能用，绝不会因为引用外部库 404 而"功能全废"。
• 移动端原生体验：底部 Tab、按钮 ≥44px、输入框 16px 防放大，手机"添加到主屏幕"就是 App 体验。
• 隐私安全：数据只存本机浏览器，文件/链接给别人也不会泄露你的项目内容。

四、它凭什么"长期能用"——背后的 8 条铁律（节选）

• 今天要处理置顶：打开先看见最该干的，逾期项红色 + 一键处理。
• 全内联零外链：绝不引外部框架/CDN/图表库，图表手写 SVG。
• 移动适配：窄屏单列、按钮够大、防 iOS 缩放。
• 预置示例数据：首次打开就有真实效果，不空白。
• 数据备份强制有：导出/导入 + 清空二次确认。
• 国内习惯：日期 YYYY-MM-DD、记账红支绿收。
• 存储双保险：资料库全托管优先（多设备实时同步）；不可用时自动降级本地单文件 + localStorage。

注：本次环境里资料库 skill 暂不可用，所以走的是本地兜底方案（单文件 HTML + 浏览器存储）。等资料库可用，同一套页面可无缝迁到云端托管，拿到在线链接、多设备自动同步。

五、怎么开始用 / 怎么让别人用

1. 你来描述场景→ 小台推荐 3 个默认模块 → 确认后生成。
2. 拿到项目进度工作台.html→ 双击用浏览器打开，7 个项目已预置好。
3. 日常管理：右上「新增项目」加自己的；看板滑块拖进度；卡片「编辑/删除」。
4. 防丢 / 换设备：「数据备份」导出 JSON；新设备打开网页后「导入恢复」。
5. 手机当 App：手机浏览器打开 → 分享 → 添加到主屏幕。
6. 想多设备实时同步：让小台部署成在线链接即可，不用手动导 JSON。