分享我精心打磨的 Hytale 的工具站

工具站网址： https://hytaletools.io/

目前还只有英文版本，等后续官方出了语言包，再逐步添加中文和其他语言。

缘起

算是第一次正经做游戏相关的网站，之前做过一个 iframe 的，感觉很无聊。

前两周看到 Hytale 发布的消息，觉得有点挑战，决定尝试一下。

定位

我先在网上找了几个别人做的站点来学习。

看到有个做 item id 的站点，主打查找 item 的 ID 和 GIVE 命令，是的，除了这个，它啥功能都没有了。

我觉得 item 是个不错的切入点，先做这个吧。

但是，那么多的 item，收集数据、整理估计要花很长时间吧，有点不确定要怎么做。

调研

我详细的看了几个大网站做的 WIKI，感觉资料还挺多的，而且很多都还处于未完成的状态；官网也没有太多的可用信息，有点犯难了。

还是先体验一下游戏吧！！！

花了 ¥ 82.09 元（ $11.35 ） 买了基础版本，然后就开始敲起来了。

游戏的设置里有个查看数据目录，打开之后，发现了新世界，很多的配置、图片、模型等，我想我要的数据应该都在这里了，不用手工去整理。

分析

打开 claude code，让它帮我分析一下游戏目录，看看有哪些东西，有没有我要的 item 的信息，果然有。

开发

通过 vibe coding，很快就弄好了 item 信息提取脚本。

然后，刷刷刷，很快一个 Next.js 的前端就出来了，简陋，但是 MVP 有了。

至此，2 天时间，我做到了我原来觉得可能会很难搞的事情。

打磨

直接 Vibe Coding 出来的网站很丑，实在没有脸见人，于是找了一些配色/动效感觉还不错的网站，让 AI 帮我改。

找到一版还不错的，就开始修理各种小细节，一天很快就过去了，决定先发一版本。

继续打磨

发布第二天，打开网站，一个功能、一个信息的看过去，发现很多问题：

• 网站太单调，只有 item 一个功能
• item 的布局太拥挤，满屏文字，丑
• 网站配色还是太丑，黑夜模式看不清，白天模式太刺眼

继续改，配色去掉了白天模式，只保留黑夜模式，并且让 AI 帮我出主意，Hytale 适合什么主题/风格。

对于 item 的布局，让 AI 帮我重新设计。我发现 AI 每次就改一点点，有点无奈，我让它大胆点，布局完全重新设计。我和它一起协同，我让它尽量保留最少的元素，但是要传递出原来那么多信息，我们一共改了 10 多个版本，最终选择了一个看着很清晰的。

为了看这专业一点，还给网站做了首页，画了个更多功能的大饼……

处理了常见的 SEO问题，发布了一版本，然后又回到 UI / UX 上，继续折腾。

这次是 item 详情页，这里更乱，内容比较多，卡片也很多；老办法，和 AI 讨论了 10 多轮，也差不多就先定一版本吧，中间改崩了，真怕越改越烂……

还是 TMD 的打磨

又是新的一天，这次不和 UI 杠了，这次总感觉详情页的内容有问题，不够丰富。

扒出原始的配置文件，和 AI 核对，还真漏了很多东西，一个一个让 AI 帮我找出来，添加进去；

然后找一些比较有代表性的 item 来查看效果，嗯，这次内容差不多都有了，但是 UI 也太丑了，文字太多了。

得，又和 UI 干起来了，一调又是半天。

最后

item 的功能终于打磨的差不多了，我自己还是很满意的，没想到我这个前端渣渣，竟然也能做出这么「专业」的游戏站，有点小满足。

但是，打磨的过程真的很痛苦，有点想吐了，让我先缓一缓，过段时间再来完善更多功能。

##

欢迎大家访问 https://hytaletools.io/ ，看一看，点一点，给点宝贵的建议。