謎塔魔女官方网站

实践记录：从零开始构建《謎塔魔女官方网站》

我终于把这个《謎塔魔女官方网站》的实践记录整理出来了。这玩意儿我动手搞了快一周，主要就是为了测试几个新的前端小功能，顺便找点乐子。这网站本身是瞎编的，但搭建的过程倒是实打实的记录。

我决定做这个项目的时候，脑子里想的是要做出那种九十年代末，甚至世纪初日本独立游戏工作室的感觉。就是那种简陋、粗糙，但又充满激情的美术风格。

• 第一步：选定工具和风格。我没用那些花里胡哨的框架，直接上手敲。我选择了最基础的HTML和CSS，用最笨的办法来模拟那种年代感。
• 第二步：背景和字体。我研究了半天CSS怎么把背景搞成平铺的低分辨率图案，还特意把图块做得有点错位。字体必须是像素风，我花了半天时间才调出那个锯齿感，然后锁定了几个Web Safe的旧字体防止显示错乱。
• 第三步：核心功能实现。这网站的灵魂就是那个闪烁的公告板。我没去写什么复杂的JavaScript，直接用最笨的办法，做了一个死循环的GIF，让它一卡一卡地闪，模拟早期BBS的公告效果。所有的图片资源我都是在网上随便抓的，裁剪得粗糙点，分辨率压得低低的，这样才显得真实。

我写完了所有的静态页面，调试了手机端，发现完全没法看，布局全乱了。但我转念一想，这种老网站在手机上看就是应该崩掉的，索性就放着没管了。我把所有的代码扔到了我的私人服务器上跑着，虽然没啥流量，但看着它那个粗糙劲儿，心里倒是挺痛快。

为啥我会花时间搞这种没什么用的网站？

这说起来就更气了。之前我接了一个大活，给一家做教育培训的设计一套新的用户管理系统。我埋头苦干了快三个月，天天熬夜，连架构图都画得清清楚楚，原型也交上去了。结果上周，甲方突然说他们领导觉得我的界面太“工业风”，要求我把所有的数据图表都换成手绘的卡通风格，连柱状图都得画成小怪兽，还要求所有的提示音都换成那种日式动漫的“喵呜~”。

我解释了半天这跟后台系统的逻辑是冲突的，他们就是不听。我脾气本来就不当场就把电话挂了，发了封邮件说这活老子不干了，爱找谁找谁去。

但是，活儿停了，钱也没结清。我手里捏着个半成品，气得好几天没睡好觉。为了不让手生，也为了找个地方发泄一下，我才决定自己弄个小项目转移注意力。这个“謎塔魔女”网站就是我用来平复心情的。那个甲方还在到处找人擦屁股，据说他们新的外包团队已经崩溃了。我倒是乐得清闲，继续记录我的实践成果去了。