跳转到主内容
DIAGONAL
←返回首页
制作说明 / 作者

制作说明Colophon

XANTHANL — 20 个项目 · 全部已部署上线

01

关于制作者

XANTHANL

自述

XanthanL,本站的设计与开发者。写前端,也写游戏、小工具和两个 Android 应用;大部分东西开源在 GitHub,能跑在浏览器里的一律部署上线,点开就能用。

他反复琢磨一个有点偏执的问题:一个 HTML 文件到底能走多远?于是有了塞进单文件的光线投射恐怖游戏、45 KB 的生存射击,以及把同一句话交给十一个 coding agent 后收到的十一部像素舞台剧。

本站是他做的另一件事:一个从东北到西南的长期艺术项目的线上档案。这和他自己的行走并不矛盾——那条对角线的走向,最早出现在他自己的旅行时间线上。

「一个 HTML 文件到底能走多远?」

另有两件无法在浏览器里跑的东西未公开:Protocol Extract(Godot 4.5)与一个 Minecraft Fabric 模组。

03

作品索引

18 项 · 按性质分组

游戏

07
01
奇点回响游戏

惯性漂移的星域 roguelike 弹幕射击:三艘船体拖着彗尾出击,27 种模块升到 LV6 触发镀金质变,每 5 波巨像降临,第 30 波肃清后可无尽漂移。屏外目标在边缘留下同色亮点,进度自动缓存、关页可续。内置粒子引擎与 WebGL 星云——跑不动会自己降档。

260 KB 单页 · 键鼠 / 触屏

↗
02
微软大战代码游戏

梗图改编的恶搞塔防:把植物大战僵尸的元游戏整套搬进程序员世界——离线机房、冲突水道、祖传迷雾、只有抛过去的 bug 报告才打得动的跨域高墙。★ 经济 + npm 商店(鸭店主)+ 每行 Ctrl+Z,手机可玩。

5 章 10 关

↗
03
植物大战僵尸游戏

完整复刻:23 关 6 世界、2 个 Boss、阳光经济与波次节奏。美术全部由矢量代码绘制——仓库里没有一张游戏图片,是机制研究与零素材重写。

23 关 · 26 植物 · 17 僵尸

↗
04
强渡火星游戏

杀戮尖塔式卡牌构筑:30 张卡 / 12 件遗物 / 6 种药水 / 4 个职业,从火星地表下潜到 2000 米地核,有真实结局。

Phaser 3 · 中英双语

↗
05
咒 · 怨宅游戏

第一人称中式恐怖:一个 HTML 文件里的 DDA 光线投射引擎。怨灵会 BFS 寻路、有视野锥,仪式推进后听觉越来越灵。衣柜躲藏、屏息机制、程序化 WebAudio,手机可玩。

单文件 · 5 章 6 图

↗
06
欧陆风云 · 1444游戏

浏览器大战略:手绘欧洲 / 北非 / 安纳托利亚地图,60 多个国家 1444 开局,经济、外交、战争、围城与历史事件。无构建步骤。

60+ 国家 · 纯静态

↗
07
Vampire 2D游戏

顶视角自动攻击生存:5 种武器 6 种被动,升级三选一,180 秒起遭遇 Boss 并有鲜血狂潮事件,同屏 220 只。

45 KB 单文件

↗
04

本站版本说明

对角线计划 · 线上档案

框架
Next.js 14(App Router)+ TypeScript,全站静态导出
样式
Tailwind CSS;动效统一走自定义曲线令牌
字体
Inter(正文)· JetBrains Mono(标签与数值)· Newsreader + 思源宋体(标题)
图像
构建期生成多档 WebP 变体;远程图由 Cloudinary 协商格式
三维
天车、门楼两座子站为独立 vanilla Three.js 静态站,由单一登记表同步
编辑
自建后台 + TipTap 富文本,中英双语分栏撰写
语言
客户端 i18n,选择持久化于本地,路径不随语言变化
部署
GitHub Pages + 自定义域 www.diagonal-art.com

本站亦是 Xanthan 观测站星系中的 02 号天体——一颗气态巨星。

网站设计与开发 — XANTHANL / 对角线计划