今天给大家伙儿分享一下我最近在搞的横版网页游戏，纯属个人瞎琢磨，大神勿喷。

一开始就是心血来潮，看着人家做的横版游戏挺有意思，手痒痒也想自己整个活儿。先是到处搜资料，看了不少教程，什么 HTML5 Canvas ，JavaScript ，反正就是硬着头皮啃。别问我为啥不用更成熟的引擎，问就是想挑战一下自己。

搭环境那会儿，就差点把我劝退。各种编辑器，插件，版本问题，搞得我头昏脑胀。还是咬咬牙，一步一个脚印，总算是把基本的框架给搞定了。深刻体会到，万事开头难！

有了框架，接下来就是往里面填东西了。先是主角，一个像素小人，丑是丑了点，但好歹能动了。然后是地图，自己瞎画的，反正就是各种平台和障碍物。美术功底不行，就只能靠数量来凑了。

让主角动起来，这可是个大工程。要监听键盘事件，控制角色的移动、跳跃。还要处理碰撞检测，避免角色穿墙或者掉到地图外面。这里面涉及到的数学知识，差点把我给送走。什么向量、三角函数，全都翻出来重新学了一遍。

主角能动了，就开始加敌人。搞了几个简单的怪物，会左右移动，碰到主角就掉血。然后又加了些子弹，主角可以发射子弹攻击敌人。这部分逻辑相对简单，但是调试起来也很麻烦，经常出现各种奇奇怪怪的 BUG。

为了增加游戏的趣味性，还加了一些收集元素，比如金币和道具。金币可以用来购买更强的武器，道具可以给主角增加各种 BUFF。这些东西做起来不难，但是需要考虑到游戏的平衡性，不能让玩家太容易获得。

接下来就是关卡设计了。我把游戏分成了几个关卡，每个关卡的地图都不一样，难度也逐渐增加。关卡设计是个体力活，需要反复测试，不断调整，才能找到最佳的平衡点。

就是一些细节的优化了。比如增加背景音乐和音效，优化游戏的性能，修复一些 BUG。这些细节虽然不起眼，但是可以大大提升玩家的游戏体验。

整个过程下来，真的是累并快乐着。虽然做的东西很粗糙，BUG 也很多，但是每解决一个问题，都会有一种成就感。感觉自己又掌握了一项新的技能，以后可以继续搞事情了。

现在游戏还只是个半成品，还有很多地方需要改进。比如增加更多的关卡，更多的敌人，更多的武器和道具。还要优化游戏的性能，让它在各种浏览器上都能流畅运行。路漫漫其修远兮，吾将上下而求索。

• 代码： 主要用 HTML5 Canvas 和 JavaScript 写的。
• 美术： 自己瞎画的像素画，凑合能看。
• 音乐： 网上找的免费素材。



• 工具： VS Code + Chrome 浏览器。