news 2026/4/18 8:40:16

年会抽奖还在PPT?使用极空间NAS打造科技感爆棚的3D动态抽奖项目

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
年会抽奖还在PPT?使用极空间NAS打造科技感爆棚的3D动态抽奖项目

年会抽奖还在PPT?使用极空间NAS打造科技感爆棚的3D动态抽奖项目

哈喽小伙伴们好,我是Stark-C~

时间过得真快!这不,又到年底了!而在这岁末的热闹氛围中,最让人期待的,莫过于公司一年一度的年会了。抽奖作为年会的重头戏之一,可以说是所有人最期待的节目。

传统的抽奖环节总是老一套,要么形式单一、缺乏惊喜感,要么操作复杂、效率低下,本来是大家最期待的项目,结束之后总感觉不够尽兴,缺点什么。

所以今天为大家分享一个可以通过NAS部署在本地的科技感爆棚的3D动态抽奖项目『log-lottery』,它拥有炫酷的视觉效果和高度的可配置性,可以为我们带来耳目一新的抽奖体验。

话不多说,开始~

关于log-lottery

🔺log-lottery是咱们一位国人大佬基于 Vue3 和 Three.js 等技术开发的开源 3D 球体动态抽奖应用,拥有炫酷的画面,具备高度可配置可定制化,不仅操作简单,而且我们可以随时根据需求,轻松调整抽奖的细节,可以说是专为各种抽奖场景量身打造的宝藏工具。

项目Github主页:https://github.com/LOG1997/log-lottery

项目亮点:

  • 炫酷 3D 球体效果:抽奖过程以动态的 3D 球体展示,增强视觉冲击力。

  • 本地持久化存储:所有配置和数据都保存在本地,无需担心隐私问题。

  • 多维度配置:支持奖品、人员、界面和图片音乐的详细设置。

  • Excel 导入导出:可以方便地通过 Excel 表格管理参与名单和导出抽奖结果。

  • 多语言支持:内置国际化功能,适应不同地区的用户。

  • Docker 部署:提供容器化支持,便于快速部署和运行。

log-lottery部署

🔺作者虽说给到了构建Docker镜像的Dockerfile,但是他并没有打包成品镜像。所以我也是借花献佛,自己构建了一个公开的镜像提供给大家使用。大家放心拉取,保证是作者源代码构建,没加任何后门,况且我也没那个本事~

🔺项目本身部署起来非常的简单,我们在极空间NAS上直接以Compose的方式构建。打开极空间NAS的“Docker”应用,点击【Compose】 > 【新增项目】。

🔺在新增项目页面自定义项目名称,输入以下 Docker Compose 配置信息后点“创建”按钮:

services: log-lottery: image: stark324/log-lottery:latest container_name: log-lottery ports: - "9279:80" # 项目Web页面打开端口,本地不冲突即可 restart: unless-stopped

以上代码需要修改的就只是端口映射部分,镜像的拉取需要自行解决网络问题,粘贴到自己的NAS这边之前建议使用AI工具优化一下,以防止格式问题造成的部署失败。

🔺部署过程还是很快的,看到容器显示“运行中”就说明项目已经可以使用了。

log-lottery体验

🔺今天的这个项目打开方式比较特别,如何你以常规的【IP:端口号】的方式打开,大概率会出现上图中的情景。

🔺所以它正确的打开方式应该是【IP:端口号/log-lottery/】,可以看到它的首页面还是非常简洁的,同时首页也是抽奖活动的主要入口,包括活动标题、参与人员概览和奖项列表等选项。我们这里可以通过点击按钮快速进入配置界面。

🔺在配置页面这里需要先设置人员配置。项目贴心的给到了一个Excel模板,我们直接将模版下载到本地,然后填写好我们这边的人员信息并重新导入就可以了,非常方便!(我这里演示就直接使用了作者项目默认模版中的人员~)

🔺在奖项配置这里可以自动以添加奖项,名称、抽奖人数和相关图片,图片可以设置成奖品的图片,不过有一个比较不好的地方就是需要我们提前在图片管理中上传图片才可以。

🔺在全局配置这里可以根据自己的需求,设置主标题,人员排列列数,主题或者背景图片相关。

🔺当然还可以设置抽奖界面的背景音乐,作者已经在项目中预置了11首音乐,可以拿来即用。

🔺最后的成品界面还是很惊艳的,图中其实不管是图片还是背景其实都是动态展示的,并且还可以点击右侧边的播放按钮播放预设的音乐,点击下方的“进入抽奖”按钮即可一键进入抽奖环节。

🔺抽奖的界面是个大大的动态旋转的3D球体,实际的展示效果非常炫酷,在配上后台的背景音乐,在年会上的氛围感绝对拉满,直接点“开始”按钮即可正式抽奖!

🔺抽奖的时候3D球体会快速旋转,同时右上角还会显示当前抽奖的类别,点击“抽取幸运儿”,3D球体就会停止转动。

🔺同时显示出中奖者的卡片。然后点“继续”,开始进行下一个奖项,以此类推。

🔺最后所有的中奖人员都可以在后台设置中看到。

PS:别问我可不可以内定,我也在研究这个,毕竟公司每年的年会都是我在安排~~

最后

今天的这个项目还是很Nice的,它不仅适用于普通年会,包括一些社群互动,商业活动也都用的上。通过这个项目,传统单调乏味的抽奖瞬间变得炫酷有趣,3D 动态效果和高度可配置性让每一次抽奖都充满惊喜。而且通过NAS部署在本地之后,还能获得高度的定制自由,最重要的是,抽奖环节所有的数据都在本地,也确保了公司信息的绝对私密与安全,有需要的小伙伴赶快动手部署体验吧!

目前年终大促正在火热进行中,极空间NAS不管是新品还是之前在售的畅销型号都有专属的优惠,并且还能叠加国补、平台优惠等福利,享受180天换新以及2年质保服务 ,更有抽奖、晒单等活动,喜欢的小伙伴赶快冲吧!

好了,以上就是今天给大家分享的内容,我是爱分享的Stark-C,如果今天的内容对你有帮助请记得收藏,顺便点点关注,咱们下期再见!谢谢大家~

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/18 8:18:07

WonderTrader终极指南:一站式量化交易策略开发框架

在金融科技快速发展的今天,量化交易已成为投资领域的重要趋势。WonderTrader作为一款开源、跨平台的金融交易策略开发框架,为您提供了从策略研发到实盘交易的全链路解决方案。无论您是量化交易初学者还是专业开发者,都能在这个平台上找到适合…

作者头像 李华
网站建设 2026/4/18 4:30:29

SM3-PHP终极指南:PHP开发者的国密加密实战手册

SM3-PHP终极指南:PHP开发者的国密加密实战手册 【免费下载链接】SM3-PHP 国密标准SM3的PHP实现 项目地址: https://gitcode.com/gh_mirrors/sm3/SM3-PHP 你是否曾在PHP项目中遇到这样的困境:需要实现国密标准的加密算法,却苦于找不到合…

作者头像 李华
网站建设 2026/4/18 4:32:08

Great Expectations数据验证终极指南:从基础到实战应用

Great Expectations数据验证终极指南:从基础到实战应用 【免费下载链接】great_expectations Always know what to expect from your data. 项目地址: https://gitcode.com/GitHub_Trending/gr/great_expectations 在数据驱动的业务环境中,数据质…

作者头像 李华
网站建设 2026/4/18 4:29:48

如何快速配置Nexe:Node.js应用打包的完整指南

如何快速配置Nexe:Node.js应用打包的完整指南 【免费下载链接】nexe 🎉 create a single executable out of your node.js apps 项目地址: https://gitcode.com/gh_mirrors/ne/nexe Nexe是一个强大的Node.js应用打包工具,能够将你的整…

作者头像 李华
网站建设 2026/4/18 4:29:49

弋阳县某gov -伪造的cf 盾逆向分析

url aHR0cDovL3d3dy5qeHl5Lmdvdi5jbi95eXhmZ3cvcHpmd3h4L3l5endna194eGdrbGlzdC5zaHRtbA打开这个网站,首先会出现这个界面,搞的和那个盾太像了,其实并不是。 观察发现请求了两次这个html页面,第一次返回412的状态码&#…

作者头像 李华