HOME / 第 7 部分 · 完整游戏项目实战 / 第 80 课
MODULE 7 · 完整游戏项目实战

第 80 课 · 像素风游戏实战（一）：搭建与素材

⏱ 预计时长 50 分钟📊 难度 进阶📚 模块 第 7 部分 · 完整游戏项目实战

🎯 本课学习目标

从本课起做一个完整像素风横版小游戏（3 课完成）。先搭项目与画面。

📖 详细教学步骤

游戏设计设计

目标：一个「像素勇者」横版小游戏

  • 玩家：像素小人，左右移动 + 跳跃
  • 地图：瓦片地形
  • 敌人：巡逻史莱姆
  • 目标：收集宝石到达终点

素材：用 Kenney.nl / itch.io 的免费像素包，或用像素画软件（Aseprite）自制。

创建项目与像素设置操作

  1. 新建项目 pixel_adventure
  2. 项目设置 → Display → 窗口：分辨率设 320×180（低分辨率像素感）
  3. 项目设置 → Rendering → Texture Filter 设为 Nearest（关键！像素不模糊）
  4. 项目设置 → Display → Window → Stretch：Mode=canvas_items、Aspect=keep

💡 Nearest 过滤 + 小分辨率 + Stretch 拉伸 = 经典像素风。

导入像素素材操作

  1. 下载/绘制：角色 16×16、瓦片 16×16、宝石 8×8
  2. 拖入 assets/images/
  3. 瓦片导入时：点击文件 → Import 面板 → 设置过滤为 Nearest

💡 所有像素图都要 Nearest，否则边缘模糊。

搭建地图（TileMap）实操

  1. 新建 main.tscn，根 Node2D
  2. 加 TileMapLayer，配置瓦片集（第 29 课）
  3. 画出地面与平台（用草/土瓦片）
  4. 加装饰层（花、草，无碰撞）

设置相机实操

  1. 玩家场景加 Camera2D
  2. Limit 边界对齐地图（第 23 课）
  3. 勾选 Position Smoothing 让跟随平滑
  4. 可选：相机 Zoom = (3,3) 放大像素细节

背景与氛围实操

  1. 加 ColorRect/Parallax2D 做背景（第 43 课星空风同理）
  2. 像素游戏用「视差背景」：远处山/云随镜头缓慢移动
  3. Parallax2D 可做多层视差（第 81 课细讲）
  4. 场景氛围：用 CanvasModulate 调暖色

🎉 像素画面骨架完成，下一课做角色与敌人。

⚠️
像素图模糊？

项目设置 Texture Filter 必须是 Nearest，且每个导入的图片也要 Nearest。

⚠️
窗口拉伸变形？

Stretch Mode 用 canvas_items、Aspect 用 keep，保持像素比例。

🧪 动手试一试

🏋️ 课后练习

完成像素项目搭建：320×180 分辨率、Nearest 过滤、一块瓦片地面、一个相机（Zoom 3x、Limit 边界）。

关键三项：分辨率 + Nearest + Stretch 配置。

💡

低分辨率 + Nearest = 像素风，这是美术向的关键技巧。

💡

像素素材要选无版权/可商用的（Kenney、itch.io free 标签）。

🎓 本课小结

像素风项目：320×180 低分辨率 + Nearest 纹理过滤 + Stretch 拉伸 + 瓦片地图 + 相机缩放；视差背景增加纵深感。