技术架构
界面和交互
用的 React，可以参考前面的两篇文章，《使用 React 做一扇门》 和《使用 React 做一个抽屉》 。
动效部分采用了 motion .
另外支持了多语言，用的是 i18next 搭配 Jotai, 使用 atom 来获取翻译内容。
美术
用 Tailwind CSS 拼凑出各种场景。如果 CSS 不够用，就上 SVG，比如那个梯形的垃圾桶，还有植物的叶子。
值得一提的是，这些 SVG 的部分是用之前写的 SVG Maker 画出来的。
数据
场景切换用的是 React Router，并且 demo 中没有隐藏 route.
状态管理用的 Jotai，个人感觉这种一地零散的变量——像是是否获得某个道具，是否开启某个抽屉——用 Jotai 特别合适。
第一章的流程设计
- 起始只有书桌和时钟，其它墙壁都是空的。
- 书桌上摆着日记，但是有密码锁。
- 时钟「翻转」可以得到三位的数字密码，是「日记」的密码。（可能会藏更隐蔽一点，比如时钟的电池可以取下来）
- 日记，会有一些残页，阅读之后才会出现对应的场景，会有几条谜题反复强调这个信息。
- 日记，会有一页提到「窗户」，阅读后才会出现，窗户。
- 垃圾桶可以得到一个纸团，纸团几次点击后会完全展开，消失，出现在日记本中。这个书页会提示书架的存在，书架出现。
- 书架前面地上的书，可以捡起来放回书架，会有文字提示「为什么掉在地上」以及「少了一本书」，给出一个「很慌乱」的暗示。
- 书架下面的柜子可以打开，里面有密码箱。首次点击密码箱会回想「密码记在哪里了」，引导回去看日记。书中多出一页，提示「某个时间的招租信息」。
- 调整时钟到特定时间，打开窗户可以看到外面的电话号码，是「书」的排列顺序，得到密码盒的密码。
- 打开密码盒得到抽屉钥匙。
- 拿钥匙打开抽屉，得到「证件」，角色名从「？？？」变成黑块，意味着回响起了有名字但是玩家不知道。
然后就没有更多了。
试玩 DEMO
DEMO: PROJECT ???