人事小姐姐是我的饭搭子，跟我说年会要搞抽奖，问我有没有好用的在线转盘。
我随手发了几个链接给她，结果她一个个试完来吐槽：
- Wheel of Names：不能同时转多个轮子，她想一边抽人一边抽奖品
- 某国产转盘：广告太多，界面丑，领导看了要皱眉
- 随机数生成器：太干了，没有仪式感
总之就是不体面，我说行吧，周末我给你写一个。
结果这一写，失控了。
刚开始想的很简单，就一个 Canvas 画个轮子，Math.random 选个结果。但写着写着开始较真：
- Math.random 不够随机。查了下发现如果要"公平抽奖"，应该用 crypto.getRandomValues()，这是密码学安全的随机数生成器。既然都做了，那就做对。
- 她要同时抽人+抽奖品。那就支持多轮盘吧，最多 6 个同时转。转完自动记录中奖历史。
- 中奖了的不能重复中。加了淘汰模式，中一个自动移除。
- 另外还加了绿幕模式，一键全屏纯绿底。
- 做了短链，方便分享或者保存自己定制好的转盘，用 Cloudflare Worker 写了个 API ，转盘配置存起来生成短链，发个链接别人就能用。
做完发现功能有点多了：
- 多转盘同时旋转
- 权重设置（买 5 张票的人权重设 5 ）
- 淘汰模式
- 倒计时模式（ 3 、2 、1 开始！）
- OBS 绿幕
- 导入导出 JSON
- 8 种语言
- 本地自动保存
UI 也花了点心思，年会现场投屏效果挺好。暗色模式是青绿色系，亮色是橙粉系，看着挺舒 服的。
技术栈是 Next.js + React + TailwindCSS ，整了个 monorepo 用 Turborepo 管理，状态用 Nuqs 存 URL 参数方便分享。分享功能单独拆了个 Cloudflare Worker ，响应挺快的。
对了，快过年了，除了年会抽奖，其实过年聚会也能用：
- 真心话大冒险：一个轮子选人，一个轮子选"真心话/大冒险"，再来一个轮子选具体问题或任务
- 谁洗碗：吃完年夜饭，全家人名字往里一扔，转
- 今晚吃啥：火锅/烧烤/日料/随便，选择困难症救星
- 该谁发红包了：下一个谁发？转盘决定，公平公正
- 喝酒游戏：转到谁谁喝，配合淘汰模式，喝过的自动移除，雨露均沾
反正我过年准备拿这个整活了，投屏到电视上效果应该不错。
有什么建议欢迎提，毕竟本来只是帮人事做个小工具...
 |
1
Tumblr 13 小时 7 分钟前  1
hmm 。。。看了一下，我的英文名字在上面，随手转了一下，然后抽到了我自己。。。
|
 |
2
zhw2590582 13 小时 1 分钟前
你们的这种场景，Math.random 完成完全没问题
|
 |
3
corcre 12 小时 58 分钟前
还有一个功能是点击开始然后老板在上面 bb 半天再次点击才开始停下来
如果还能设置奖项然后记录每次抽奖的奖项并且限定奖项的数量的话应该就是我老东家想要的了(但是我已经领大礼包了🐶 |
 |
4
needpp 12 小时 56 分钟前
很好，刚好有个域名 下班了鞭策 ai vibe 一个
|
 |
5
pol 12 小时 55 分钟前 2
失控你，我以为在年会上出 bug 炸了，白高兴你
 |
 |
6
myarsenal 12 小时 54 分钟前
中奖后生成的图片应该能显示奖品是什么。所以你应该增加选项在抽奖前输入本次奖品。
|
 |
7
bobox 12 小时 52 分钟前
交给 ai ，几分钟就写好了
|
 |
8
iddddg 12 小时 48 分钟前 1
域名江苏跳反诈了
|
 |
9
cheng812 12 小时 46 分钟前
十几年前给某前十市电视台写过一个类似的抽奖玩意，可以提前设置中奖人，那时候流行楼盘开盘时电视直播抽奖😩
|
 |
10
liushengxian1230 12 小时 43 分钟前
功能太多了 需要砍一砍需求。。
|
 |
11
tutouguai 12 小时 42 分钟前
佬 想问下音频文件去哪里整呢
|
 |
12
lxqxqxq 12 小时 40 分钟前
|
 |
13
daybreakfangyang 12 小时 39 分钟前 1
本来进来想吃瓜🍉
|
 |
15
94nb 12 小时 34 分钟前
不是，这都不重要，重要的最后你中奖了嘛。。。。
|
 |
16
rekulas 12 小时 34 分钟前 1
还有一点,特等奖一定不能抽中技术员工-特别是你
要真中了可有得你解释的 |
 |
17
hi2hi 12 小时 33 分钟前
我们 60 个人抽奖，最低有阳光普照奖，还有部分人玩游戏赢了多抽一次；
|
 |
18
pingdog 12 小时 26 分钟前 via iPhone
软件实现的随机算法都是称为伪随机，真随机要专用硬件
|
 |
19
itenyh 12 小时 21 分钟前
小姐姐的魅力果然大
|
 |
20
abc0123xyz 12 小时 20 分钟前
op 在本贴抽个奖😘
|
 |
21
imik 12 小时 6 分钟前
标题成功
|
 |
22
guiys 12 小时 3 分钟前 via Android 1
对开发者来讲，功能很全面。
对使用者来讲，太难用了。 |
 |
23
Fechin OP PRO @zhw2590582
确实，用 Math.random 谁也挑不出毛病 |
 |
24
pulutom40 11 小时 58 分钟前 via iPhone
以前我们部门干活这活，老板让我们写一个年会的抽奖程序，后面大家一听是我们写的，纷纷完全开源，大家一起 review
|
|
25
Fechin OP PRO |
 |
26
seatifa 11 小时 57 分钟前
需要增加一个导入 excel 或者 word 名单的功能，不然几百人的公司用起来，人事小姐姐要累死。
|
 |
27
muchun 11 小时 57 分钟前
以前也给公司写过抽奖程序，后台可以配置必中奖人和必不中奖人😁
|
 |
29
white1222 11 小时 54 分钟前
你这地址链接已经失控
|
 |
31
19cm 11 小时 54 分钟前
还少了后门功能啊, 不管咋滴大奖得留给研发部啊
|
 |
32
eratpfus7 11 小时 53 分钟前
怎么点开到了江苏反诈网
|
 |
33
Robot9527 11 小时 49 分钟前
年会现场代码 review
|
 |
34
ovtfkw 11 小时 48 分钟前 via iPhone
给公司做的工具为什么不先排期再做？
|
 |
35
luxin325 11 小时 48 分钟前
看得晃眼，在线的不要圆圈转盘了，换个形式
|
 |
36
killva4624 11 小时 47 分钟前
@muchun 笑死，真的有黑幕
|
 |
37
NickX 11 小时 46 分钟前
“人事小姐姐是我的饭搭子”
这关系感觉不简单 |
 |
38
sssfff 11 小时 43 分钟前
+1 但是我直接拒绝了，因为我写的没有公信力，万一我抽中了大奖怎么办
|
|
39
sssfff 11 小时 41 分钟前
话说你的导入导出居然是 json ，肯定得用 excel 啊
|
 |
40
ovovovovo 11 小时 39 分钟前
更关心人事小姐姐怎么反馈
|
 |
42
scyuns 11 小时 35 分钟前
没有指定谁中奖的程序 不是好程序
|
 |
43
bearbest PRO @killva4624 确实，我也搞过，一般还需要配置外包员工不能中一二等奖，总监之类的也不能中奖，某些奖项抽给某些工作组之类的
|
 |
44
lswlray 11 小时 26 分钟前
真实需求：
1 、某人必须中； 2 、某人必须抽不中； |
 |
45
sumeoy 11 小时 20 分钟前
奖品能增加图片显示就好了。
|
 |
46
94 11 小时 11 分钟前
看到 OP 的描述，抽奖细节、权重、淘汰、倒计时，突然感觉自己回到 2020 年之前。
当时前司营收爆表，年年都搞超大规模的年会，抽奖程序就是自己搞的。各种 3D 的抽奖画面、扫码签到动画、互动小游戏发红包什么的。 |
 |
47
haidaomihuan 11 小时 7 分钟前
目测是编的故事
 |
 |
48
t822876884 10 小时 39 分钟前 1
跳反诈了
|
 |
49
rainfox 10 小时 36 分钟前
|
 |
51
Cyron 10 小时 17 分钟前 via iPhone
体验不错，以后就用你这个了
|
 |
52
mrfunnypiggy11 10 小时 12 分钟前
好好玩哈哈，谢谢啦
|
 |
53
safari9 9 小时 32 分钟前
有点意思奥，五颜六色的
|
 |
54
ft99 9 小时 25 分钟前
是随机的吗？ 抽了 7 次 小陈-小陈-小明-小杨-小陈-小张-小陈
小陈出现了 4 次...... 只看结果 好像并不随机 |
 |
55
flytsuki 9 小时 13 分钟前
我也做过抽奖,不过是用户信息表有个字段中奖金额,我直接拿了出来就行了
 |
 |
56
tonytonychopper 9 小时 12 分钟前
可以做成 3d 的，这样还能把头像放进去，有代入感
|
 |
57
windmoonwind 8 小时 56 分钟前
比较关注 饭搭子有没有失控变成床搭子？
|
 |
58
nuomi196500 8 小时 56 分钟前
不要自己写，功能不好用怪你，没有被抽中的所有人都骂你，抽中你自己别人会觉得有猫腻，费力不讨好，淘宝上买一个几十块钱的事，出任何事不用担责
|
 |
59
PeiXyJ 8 小时 56 分钟前
https://imgur.com/wH7fgsc
我做了一个球球大作战的抽奖程序,抽完后到还有个大决战模式，最后胜家还能得到个红包。 |
 |
60
csoarx 8 小时 40 分钟前
倒计时模式连点空格有 bug
 |
 |
61
lchkid 8 小时 23 分钟前
测试了一下，首先人数过多转盘显示效果就不行了，其次最后出结果有一次很明显的偏移
|
 |
62
Dispatcher 8 小时 21 分钟前
一边抽人一边抽奖品
———————————————— 不许打人啊…… |
 |
63
dfourc 8 小时 18 分钟前
@haidaomihuan #47 不用怀疑，就是
|
 |
64
tangping 8 小时 16 分钟前
老板问 可以加 指定中奖吗 😄
|
|
68
Fechin OP PRO |
 |
70
liuidetmks 8 小时 9 分钟前
人一多，就转盘就太密了
|
 |
71
windowlife 8 小时 8 分钟前
这个技术是很好的，可是不实用，
|
|
73
windowlife 8 小时 8 分钟前
一是大奖不能是技术人员，二是要能指定奖品指定人员
|
 |
74
RandomJoke 8 小时 6 分钟前
这东西，AI 应该能干的很好了吧。。。
|
 |
76
Exia 8 小时 3 分钟前
赞一个～
|
 |
77
MarsMTC 7 小时 37 分钟前
轮盘名称怎么编辑呢
|
 |
78
lizhizhuangb 6 小时 57 分钟前
|
 |
79
Hoothin 6 小时 47 分钟前
这很容易被举报啊，人家创建一个打倒 xxx 或者 xxx 新葡京创建短链，然后举报这个页面，域名就没了。最好加个密码保护吧。
|
 |
80
hahiru 6 小时 47 分钟前
产品：现实中轮盘是动态摩擦随机，跟目前随机数先确认结果再模拟动画不是一个概念。
是不是可以设置一个公式。初始随机一个动能，然后随机毫秒随机衰减，最后停止。 要有角速度、加速度、摩擦力、转动惯量、空气阻力。 辛苦熬夜改一下，明天早上给我看一下初版。 |
 |
81
shaozelin030405 6 小时 46 分钟前
小姐姐好看不
|
 |
82
wosilusheng 6 小时 35 分钟前
访问 https://gospinwheel.com/zh-Hans/about 报 500 错误了
|
 |
83
SakuraYuki 6 小时 33 分钟前
还以为失控是指年会出 bug 了，大家全都摇到了一等奖
|
|
84
Fechin OP PRO |
|
85
Fechin OP PRO |
 |
86
panlista 6 小时 2 分钟前
我还以为给所有人都抽到了一等奖呢，原来不是 bug
|
 |
87
Cassius 5 小时 41 分钟前
obs 不用绿幕 obs 自己引用浏览器源就是直接去除 background 透明化 主流的 web 包装都这样的
|
 |
88
teasick 5 小时 28 分钟前
当轮中奖的结果最好也显示在转盘边上
以及可以配置背景图、奖品图 |
 |
89
cheese 4 小时 56 分钟前
好的别人夸，我做坏人挑挑刺。
右边的配置面板太繁琐。转盘的阻尼感太假，动画太生硬，特别是转起来的时候。 整体的配色 UI ，AI 味太浓，像科技网站 UI ，不太像年会那种气氛。 |
 |
90
onecookie PRO 这帖子标题写得挺好👍🏻 让我失控了体验了一把，感受是首页像产品+落地页的杂糅，有一点奇怪。
另外好奇怎么盈利？还是不考虑，纯兴趣吗 |
 |
91
Tink PRO 牛逼
|
 |
92
felixwang 4 小时 18 分钟前
马克，也许能用到
|
 |
93
RexKang 4 小时 12 分钟前
数年前，年会抽奖，要求一定要公平，一定要公平……
现场，要求指定谁谁中奖…… 但是必须看起来是公平的…… |
 |
94
Crystal8899 2 小时 40 分钟前
@Tumblr 我感觉哪里不对，我也是改成自己名字，然后就抽到了
|
 |
95
HankAviator 54 分钟前
建议加点喜庆的音效，像是空气喇叭或者当季鲜梗
|
 |
96
darkengine 52 分钟前
妖，我还以为年会抽奖抽飞了呢
|
 |
97
CRH 42 分钟前
转轴不在圆盘的正中心……转起来晃来晃去的
或者是故意做的这个效果？ |
 |
98
fortitudeZDY 41 分钟前
@iddddg 本来没打算点,结果看了你这个,忍不住测试了一下,竟然看到了传说中的反诈网站,楼主这不会是用了 http 吧...
|
 |
99
kinghly 1 分钟前 via iPhone
这些功能都比较简单，给 ai 讲明白就可以了，最后再打磨提下 UI 交互就差不多了
|
Select Language