没有人对我的作品集感兴趣,于是我让大家都来玩它。

发布: (2026年1月5日 GMT+8 12:16)
11 min read
原文: Dev.to

请提供您希望翻译的完整文本(除源链接外的正文内容),这样我才能为您准确地进行简体中文翻译。谢谢!

新年,新 你作品集挑战

由 Google AI 提供

控制

键盘 & 鼠标

操作键位 / 输入
移动A/D←/→
跳跃Space
表情窗口Q
放大/缩小鼠标滚轮

网站:

🎮 挑战: 在地图上收集所有散布的收藏卡。全部收集后在评论区上传截图!

为什么我构建了它

“在接下来的5 分钟里,你会看到我为什么花了3 年时间构建自己的网络栈,只是为了让我的作品集更怪异。”

在创意领域工作时,单调的可滚动页面总感觉不对。我想要一种方式来 展示 我的能力,而不仅仅是列出它们。因此,我把旧的作品集网站改造成了一个 在线多人游戏世界,在这里我几乎可以 做任何事 我想做的。

我是一名游戏开发者,坚信技术应该是 引人入胜、互动且突破边界 的。这个作品集凝聚了多年的实验、失败和构建——从简单的后端到复杂的多人系统。

游戏中你会看到的内容

上方嵌入的应用是一个功能完整、跨平台的多人游戏,作为我的交互式作品集。访客不必浏览传统网站,而是通过游戏体验来探索我的作品,并实时查看以下内容:

  • 最新的 YouTube 视频
  • GitHub 活动与贡献
  • 独立游戏项目
  • 开源项目
  • 每日随机 “Dan Facts”

地图上散布着可收集的卡片,每张卡片都会展示我的照片和职业信息。还有一个特殊按钮,真的可以 把我召唤到这个世界(如果我在线),这是传统作品集做不到的。

技术规格

组件细节
游戏引擎(客户端)Unity 6(支持移动端的 WebGL 构建)
网络Dan.Net – 我自定义的 Go + WebSockets 堆栈
部署Google Cloud Run(2 GB 内存,2 vCPU)
AI 助手Google Antigravity 用于工作流优化
APIYouTube Data API、GitHub API
服务器自定义 Node.js HTTP 服务器,带 gzip 处理

注意: 我没有使用现成的多人游戏解决方案。所有内容——从核心游戏逻辑和统计显示到网络层——均由我自行构建,包括完整的网络栈 Dan.Net

趣味事实

我使用 Aseprite 绘制了相当多的艺术资源(除了用于皮肤和瓦片的一些随机 PNG)。音乐是 Toyota Corolla 2008 主题曲——请不要质疑音乐的选择! 😉

旅程时间线(4 年)

年份里程碑
2021开始使用 Photon Engine,制作了一些游戏,但感觉自己只是调用函数,而没有理解底层机制。
2022陷入技术深渊:尝试 Python/Flask,构建了 Leaderboard Creator 工具(现在是 itch.io 上评分最高的之一),尝试 PHP,转向 Node.js 与 WebSockets。到 2022 年底,Dan.Net 的想法诞生。
2023持续奋斗。连续三天调试多线程竞争条件。当它最终成功时,这三天成为我人生中最有成就感的时光。
2025Dan.Net 推向稳定、可投入生产的状态,准备为真实项目提供动力。

多人架构(简体)

  1. 房间系统 – 玩家可以使用房间名创建或加入房间。把房间想象成“玩家池”或“比赛”。
  2. 基于事件的网络 – 重要操作(玩家加入、捡起卡牌、更换皮肤)会向服务器发送缓冲事件。表情符号反应则发送直接事件。服务器将这些事件广播给相关玩家。
  3. 基于流的网络 – 每隔几毫秒,每个玩家会发送当前位置信息。服务器汇总所有位置信息并返回其他玩家的位置更新。

在底层还有插值、延迟补偿、带宽优化——所有让每个人的世界视图保持同步的有趣技术。

在 Cloud Run 上使用 Gzip 部署 Unity WebGL

Unity 的 WebGL 构建使用 gzip 压缩,这本来很棒,直到你尝试部署它们。浏览器需要特定的 HTTP 头来正确解压这些文件,而 Cloud Run 默认并不会设置这些头。

Solution: 我构建了一个自定义的 Node.js HTTP 服务器,能够:

  • 检测 .gz 文件并设置 Content‑Encoding: gzip
  • 为 WebAssembly、JavaScript 和数据文件保持正确的 MIME 类型
  • 正确处理跨域请求的 CORS
  • 使用合适的缓存策略高效地提供 36 MB 的构建文件

Google Antigravity 为我节省了大量时间,帮助我调试头部配置并优化服务器设置。

Antigravity 如何帮助

  • Dan.Net 改进: 优化了 Unity 客户端与我的 Go 后端的通信方式,特别是在 WebSocket 连接处理和状态同步方面。
  • Cloud Run 调试: 排查了 Unity 构建未加载的原因(是头部信息导致的)。Antigravity 帮助我理解 Unity 的压缩、HTTP 头部与浏览器要求之间的关系。
  • API 集成: 安全地实现了 YouTube 和 GitHub API,避免泄露密钥或产生漏洞。没有正确的 API 设置,显示我最新视频和贡献的动态面板将无法工作。

要点

创建我自己的基于 Go 的网络解决方案,并成功将其与 Unity 集成以实现跨平台多人游戏,展示了从底层网络协议到高层游戏开发的 full‑stack capabilities

查看 Dan.Net 以查看代码并了解此交互式作品集背后的技术栈。

作品集愿景

这不仅仅是展示我已经完成的工作——更是展示我能够做到的事。一个真正的作品集不应是静态页面;它应该是一种 体验,能够体现你的技能和个性。当我说我可以在这里做 任何事 时,我是认真的。

动态功能

  • 实时看板 – 根据我的活动自动更新(最新的 YouTube 视频、最近的 GitHub 提交)。世界始终充满活力且保持最新。
  • “Dan 每日趣闻” – 每天更换,让访客始终看到新鲜内容,无需手动更新。
  • 可收集卡片 – 在探索时揭示信息,增加互动层次。
  • 号召性按钮 – 点击后我将加入世界(如果我有空)。 😉

技术亮点

  • Unity 6 Web 支持 – 游戏在桌面、移动设备和网页浏览器上无缝运行。
  • 由 Dan.Net 驱动 – 展示了不仅前端技能,还对以下方面有扎实掌握:
    • 网络协议
    • 状态管理
    • 分布式系统
    • 后端架构

创作者建议

“分享你的作品,记录你的旅程。”

  • 为你已经构建的东西 以及 仍在构建的东西感到自豪。
  • 不要犹豫把自己展示出来。

分享的重要性

  • 通过观察学习: 当你分享——包括那些凌乱的部分——你就给了他人尝试的许可。
  • 灵感: 你的故事可能正是某人迈出第一步所需要的。
  • 动力: 看到有人弄明白了,可能会激发“我也可以做到”的想法。

你学到的东西永远不会真的浪费掉。它只会在下一个疯狂的想法中出现。

我的作品集是 多年实验、失败项目和学习时刻 的结晶——所有这些汇聚成我真正自豪的东西。

加入我们

  • 试一试,并在评论中告诉我你的想法!
  • 对游戏开发、网络系统、开源开发感兴趣,或只是想闲聊吗?
    • 通过我的 Discord 服务器 联系我——我很乐意与你交流!

想了解更多?

  • 关于这个不断演进的作品集世界的 幕后内容、奇怪的原型和开发日志 可在我的:
    • YouTube 频道
    • GitHub

感谢浏览我的作品集,期待收到你的来信!

Back to Blog

相关文章

阅读更多 »

🎮 学习游戏开发 – 第4天

我的 Unreal Engine 第一天 使用体验 这篇文章是我在游戏设计与开发每日学习旅程的一部分。我每天分享所学——基础知识,……