我一开始根本没打算建什么“彼岸花游戏官网”。我那阵子刚从一个大项目里抽身出来，整个人都快被掏空了，每天回去躺在床上都觉得天旋地转，不是累的，是心烦的。
一、实践的起因：被逼着找个安静的活儿干
我前东家，一家做供应链SaaS的公司，老板画大饼画得飞起，结果产品迭代速度跟不上，客户抱怨声一片。我当时负责核心模块，写了半年多，代码像堆积木一样，乱七八糟。客户那边炸了，老板连夜开会，把屎盆子扣下来，说我设计架构有问题。我跟他们吵了一架，当天就提了离职，气得我直接收拾东西走人，连工资都没结算完。我当时就想，这帮人真够恶心的。
那段时间，我急需找点事儿做，转移注意力。不能再碰那些复杂的业务逻辑了，得找个简单、纯粹、能让我安静下来的活儿。我随便翻了翻手机里最近玩的游戏，看到了那个画面特别红、特别唯美的独立游戏——《彼岸花》。我一看，行，就它了。我决定，给自己建一个最简洁、最能抓住游戏精髓的非官方展示网站，完全为了自己开心。
二、开始动手：从一张草图到界面搭建
我这个人做事，讲究一个“快”字。既然是自己练习，就没必要上那些重型框架。我打开编辑器，先是敲定了基础的骨架。我给自己定了个规矩：视觉冲击力要强，用户进来一眼就要被那片红抓住。
- 我用Photoshop把游戏里几张核心的宣传图拉出来，暴力裁剪，把它们的颜色饱和度往上提了一截，主色调必须是那种接近血液的深红和幽暗的黑。
- 然后，我开始堆积HTML结构。首页分成了几个部分：顶部一个全屏的英雄区块，中间是新闻动态，底部是截图画廊和版权信息。我没用任何现成的模板，就是一行一行自己敲。
- 接下来是CSS样式处理，这是最花时间的。为了模拟那种独立游戏神秘又带点悲剧色彩的氛围，我大量使用了渐变和阴影。比如，导航栏我用了半透明磨砂玻璃的效果，鼠标滑过按钮的时候，按钮的红色光晕要自然地向外扩散，不能太生硬。我光是调这个扩散的动画效果，就折腾了快一天。
最麻烦的是自适应。现在手机端访问量大，我可不想被人骂。我对着我的iPhone和家里的安卓平板反复测试，不断调整媒体查询（Media Queries）。确保那个红色的主视觉在小屏幕上不会显得太拥挤，所有的文字排版都要能自动缩放。
三、功能实现与部署：把东西跑起来
这个网站的功能不复杂，主要就是展示。但我也加了点好玩的小东西。
我用原生JavaScript实现了一个“雨滴”效果。在首页背景上，时不时会有几滴红色的“雨水”沿着屏幕流下来，增加了那种阴郁的美感。这个效果说起来简单，但优化性能花了我不少力气，不能让它占用太多CPU，导致网页卡顿。
等前端搞定后，我琢磨着怎么把这玩意儿真正部署出去。我可不想费劲巴拉地去租服务器、配Nginx。我直接用了那个大家都在用的静态网站部署平台，把我的代码包一扔，关联了我的代码仓库。平台自动给我生成了域名，整个过程不到十分钟，网站就跑起来了。
看着那个红黑色的网站活生生地出现在浏览器里，我心里那股闷气才算散了不少。这东西虽然简单，但从零到一，每一个像素，每一行代码，都是我亲手堆出来的，比在公司里写那些烂代码舒服多了。
四、的实践才是硬道理
我当时建这个网站，完全是为了发泄，是我的“疗伤”过程。但通过这个过程，我再次确认了一个事：你光是嘴上说自己懂设计模式、懂高性能，没用。真正去实践一个完整的项目流程，从构思到上线，哪怕只是一个简单的官网，你遇到的那些问题才是最真实的。
我的前东家，那个SaaS公司，在把我踢走后，项目还是烂着。前两天我一个还在那里的老同事给我打电话，问我能不能回去帮他们救个火。他说，自从我走了之后，那边的代码库没人能看懂，全线停滞了。
我听完后直接笑了。我跟他说，我现在正在做自己的事情，每天都在写干净的代码，做自己喜欢的设计。我宁可花时间去优化那个“彼岸花”官网的雨滴动画，也不想回去收拾你们的烂摊子。那边的岗位，估计得一直挂着，直到他们找到下一个倒霉蛋去背锅。实践出真知，这回经历教会了我，代码要为自己写，而不是为了那群只会画饼的人写。