HOURLINE 是我们以概念形式设计并开发的在线预约平台，通过一个虚构的商家来展示：Maison Hourline，在莫斯科、迪拜和伦敦有三家高端门店和九位技师，提供按摩、面部护理、美发、美甲和理疗。顶部栏的开关可以在产品的两面之间切换：客人看到的预约页面，以及门店日常使用的后台。

我们给自己定的任务是：用手机预约只需几秒；可约时间必须真实计算出来，而不是一张摆设的时间表；客人一下单，门店就能立刻看到。一切都在访客的浏览器中运行：演示数据为每位访客单独生成，保存在 localStorage 中，不会发送到任何地方。

客人的流程是：选择门店、服务和技师，在日期条和时间格中选时间，填写姓名和电话，然后得到确认。每家门店都显示自己的当地时间和营业状态。推荐标签会给出最早可约时间、根据过往到访学到的“常用时间”，以及常约技师的空档；“和朋友一起约”会找出同一开始时间都有空的两位技师。确认页是一张 Wallet 风格的凭证，并在浏览器中生成真实的 .ics 日历文件；预约可以沿技师当天的时间轴拖动改期，也可以按门店政策取消。

每一个可选时间背后都是同一个可用性引擎：每位技师的每周工作时间和休息、已有预约、每次服务后的整理缓冲、最短提前时间和可预约范围，全部按门店自己的时区计算，包括伦敦的夏令时切换。门店日历使用同一个引擎：日视图和周视图，拖动即可移动，拖动下边缘调整时长，点击空白处新建；如果拖放违反规则，预约块会抖动着弹回原位，并说明原因。

门店一侧加入了我们所说的演示 AI，页面上明确标注为“浏览器中的规则加统计”：为每个即将到来的预约计算爽约风险——一个在浏览器中用演示数据自身历史训练的朴素贝叶斯模型，会解释各项因素并给出建议操作；以及“填补空档”，把日程中的空闲时段与模拟的候补名单进行匹配。此外还有带利用率热力图的仪表盘、带标签和历史记录的客户库，以及修改后立即作用于预约页面的设置。没有使用框架：纯 JavaScript 和 CSS，用 esbuild 打包，两款自托管字体 Cormorant 和 Manrope，奶油色与石色的配色加上茄紫色点缀。

这个概念运行在 /demos/hourline/，共有七个视图：客人一侧两个、门店一侧五个，支持英语和俄语。2026 年 9 月 28 日，我们在 MacBook 上用无界面（headless）Chrome 亲自做了测量，并把演示时钟固定在 2026 年 10 月 1 日 15:40：在 390 px 宽的手机屏幕上用脚本完成一次预约、每次点击后停顿 0.9 秒，按演示自带的秒表，从第一次点击到确认用时 6 秒（14 次运行的中位数，范围 6–16 秒）。在一个标签页中完成的预约，出现在了另一个标签页里打开的门店日历中。

一个独立的穷举检查重新核对了引擎在十天内、三家门店、九项服务中给出的全部 658 个可选时间，逐一对照工作时间、休息、含缓冲的已有预约、最短提前时间以及时区往返换算：没有一个错误时段，没有重复预约，也没有违反缓冲；在跨越 10 月 25 日伦敦夏令时切换的时间段里做同样的检查，同样没有发现问题。全部 JavaScript 和 CSS 经 gzip 压缩后共 95 KB。在线上地址上，Lighthouse 13.5 每种设备运行五次（测量时 MacBook 的平均负载为 3–9），性能中位数为移动端 94、桌面端 100，无障碍和最佳实践均为 100，页面传输 0.2 MB。