年会抽奖被迫营业，写了个转盘轮子，最后失控了

人事小姐姐是我的饭搭子，跟我说年会要搞抽奖，问我有没有好用的在线转盘。

我随手发了几个链接给她，结果她一个个试完来吐槽：

• Wheel of Names：不能同时转多个轮子，她想一边抽人一边抽奖品
• 某国产转盘：广告太多，界面丑，领导看了要皱眉
• 随机数生成器：太干了，没有仪式感

总之就是不体面，我说行吧，周末我给你写一个。

结果这一写，失控了。

刚开始想的很简单，就一个 Canvas 画个轮子，Math.random 选个结果。但写着写着开始较真：

1. Math.random 不够随机。查了下发现如果要”公平抽奖”，应该用 crypto.getRandomValues()，这是密码学安全的随机数生成器。既然都做了，那就做对。
2. 她要同时抽人+抽奖品。那就支持多轮盘吧，最多 6 个同时转。转完自动记录中奖历史。
3. 中奖了的不能重复中。加了淘汰模式，中一个自动移除。
4. 另外还加了绿幕模式，一键全屏纯绿底。
5. 做了短链，方便分享或者保存自己定制好的转盘，用 Cloudflare Worker 写了个 API ，转盘配置存起来生成短链，发个链接别人就能用。

做完发现功能有点多了：

• 多转盘同时旋转
• 权重设置（买 5 张票的人权重设 5 ）
• 淘汰模式
• 倒计时模式（ 3 、2 、1 开始！）
• OBS 绿幕
• 导入导出 JSON
• 8 种语言
• 本地自动保存

UI 也花了点心思，年会现场投屏效果挺好。暗色模式是青绿色系，亮色是橙粉系，看着挺舒 服的。

技术栈是 Next.js + React + TailwindCSS ，整了个 monorepo 用 Turborepo 管理，状态用 Nuqs 存 URL 参数方便分享。分享功能单独拆了个 Cloudflare Worker ，响应挺快的。

地址：gospinwheel.com

对了，快过年了，除了年会抽奖，其实过年聚会也能用：

• 真心话大冒险：一个轮子选人，一个轮子选”真心话/大冒险”，再来一个轮子选具体问题或任务
• 谁洗碗：吃完年夜饭，全家人名字往里一扔，转
• 今晚吃啥：火锅/烧烤/日料/随便，选择困难症救星
• 该谁发红包了：下一个谁发？转盘决定，公平公正
• 喝酒游戏：转到谁谁喝，配合淘汰模式，喝过的自动移除，雨露均沾

反正我过年准备拿这个整活了，投屏到电视上效果应该不错。

有什么建议欢迎提，毕竟本来只是帮人事做个小工具…