Three.js FPS Weapon Feel (recoil, ADS, touch aim)
/threejs-fps-weapon-feel
A GameSkill original: a learnable recoil pattern whose recovery never undoes the player's own compensation, aim-down-sights with matched sensitivity, spread you can draw as a crosshair, viewmodel bob, sway, kick and flash, and a phone chapter with a move stick, precision look zone and a fire button that aims.
- 许可证
- MIT
- 出品
- GameSkill 出品
我们测过
在 three.js r186 (0.186.1) in Chrome 156 headless 上通过 40/40 项检查（2026-10-28）：能触发、有可运行示例、有截图和自检清单、单一职责、中英文文档齐全。触发检查是把提示词和 skill 描述做匹配，不是真实 agent 运行。
测试报告GameSkill 测过的版本
GameSkill 为 gameskill.dev 原创编写并测过。ZIP 里是完整的 skill：SKILL.md 及中文版、脚本、可运行示例、测试、自检清单和我们的测试报告。
GameSkill 原创，协议 MIT。ZIP 保留 LICENSE 和 CREDITS.md，里面列出了流程灵感来源、CC0 测试素材和第三方库及其协议。
自检清单
- 压枪后停火，准星不会被拉到目标下面 / After compensating and releasing, the aim is not dragged below the target
- 30 帧和 144 帧打出同样的子弹 / 30 fps and 144 fps fire the same shots
- 第一发子弹打在准星上 / The first bullet goes where the crosshair was
- 开镜后灵敏度按 FOV 缩放，屏幕上转速不变 / Aimed sensitivity scales with FOV so on-screen speed stays the same
- 手机上按下视角手指不会跳，开火键能同时瞄准 / On a phone, look does not jump on touch-down and FIRE also aims
- npm test 和 npm run test:browser 都通过 / npm test and npm run test:browser pass
中文指南
这个 skill 做什么
GameSkill 原创（MIT）。第一人称射击的武器手感：玩家能学会的后坐力图案；回复只还“玩家还没压掉的部分”，压枪后停火不会被拉到目标下面；开镜时 FOV 缓动、灵敏度按 FOV 缩放；散布随射击扩大、开镜收紧，并能直接画成准星；枪模晃动、摆动、后坐和枪口焰。全部在固定步长上运行，30 帧和 144 帧打出的子弹完全一样。另有手机章节：浮动移动摇杆、精确瞄准的视角区、能边打边瞄的开火键。
什么时候用
- 在做浏览器 FPS 或任何第一人称射击
- 开枪手感发飘、后坐力不公平、瞄准太灵敏、不同帧率表现不同
- 想让浏览器 FPS 能在手机上玩
怎么装
下载本页的 ZIP，把 threejs-fps-weapon-feel/ 文件夹放进 .claude/skills/（Claude Code）或 .agents/skills/（Codex、Cursor），重启 agent。示例自带 three.js r186，武器和触屏模块没有依赖。
最小示例
示例《码头靶场》：12 米处的图案板会留下每一发弹孔。node test/serve.mjs 后打开 http://localhost:8770/；电脑点击锁定鼠标，左键开火、右键开镜；手机左半屏移动、右半屏转视角。加 ?demo 看对比：红色是腰射扫射，绿色是开镜压枪点射。
我们怎么测的
npm test 跑 15 个 Node 测试：射速、30/144 帧一致、图案可学习、第一发在准星上、回复和压枪不冲突、开镜 FOV 和灵敏度、散布、枪模效果、摇杆死区、触屏分区和精确瞄准。npm run test:browser 在无头 Chrome 里做 11 项检查，包括 WebGL 渲染、演示弹孔、开镜、触屏转视角、按住开火、回复、开镜后视角变慢、摇杆前进、换弹和没有控制台错误。
致谢
思路来自两个 MIT 项目：Hiraeth010 的 BLACKWATER（后坐回复、开镜过渡、晃动、枪口焰）和 xilinnihao-afk 的 SANDLINE（手机双摇杆和精确瞄准）。没有复制代码，代码、数值、场景和文字都是我们写的。
搭配
fps-shooter：FPS 的整体结构（移动、敌人、关卡）web-audio-sfx-synth：合成枪声、弹壳、命中音效game-feel：命中反馈、震屏
安装
告诉你的 AI
Install the skill from https://gameskill.dev/skills/threejs-fps-weapon-feel/install.md
GameSkill 测过的版本
mkdir -p .claude/skills
curl -fsSL https://gameskill.dev/dl/skills/threejs-fps-weapon-feel.zip -o /tmp/gameskill-threejs-fps-weapon-feel.zip
unzip -oq /tmp/gameskill-threejs-fps-weapon-feel.zip -d .claude/skills
rm /tmp/gameskill-threejs-fps-weapon-feel.zip包含内容
- Pier Range: a three.js firing range with a pattern board that keeps every hit, steel plates, desktop and phone controls
- src/weapon.js: recoil pattern, debt-based recovery, ADS blend and sensitivity, spread bloom, bob, sway, kick, flash
- src/touch.js: floating move stick with radial deadzone and curve, precision look zone, fire button that also aims
- Fixed-step firing so 30 and 144 fps fire the same shots
- 15 Node tests and an 11-check headless Chrome test with touch
适合
- Browser FPS and any first-person gun game
- Fixing floaty or unfair recoil, twitchy aiming, frame-rate dependent spray
- Making a browser FPS playable on a phone
不适合
- Enemy AI, level design or netcode
- Ballistics with bullet drop and travel time
试试这条提示词
My three.js shooter feels floaty. Add a learnable recoil pattern, recovery, aim down sights and phone controls.关于这个 Skill
A GameSkill original, written and tested for gameskill.dev under MIT. The demo, Pier Range: a three.js range on a pier where a pattern board keeps every hit, so the recoil pattern is visible. Weapon rules are in src/weapon.js, phone controls in src/touch.js; neither touches the DOM or three.js.
Agent steps
- Look and recoil are separate: apply the player's look, call
update, addviewDelta. - Fixed step with catch-up firing; each shot leaves along the aim before its own kick.
- A learnable pattern with a small seeded random tail.
- Recovery returns only the debt the player has not already pulled down; delay it past the shot interval.
- One eased ADS value drives FOV, recoil, spread, bob, sway and the viewmodel; sensitivity uses the tan ratio.
- Spread is a drawable cone: the crosshair gap comes from the same number.
- Viewmodel juice is cosmetic: it never moves the bullet.
- Phone: floating stick with radial deadzone and curve, look zone without the touch-down jump, precision while aiming, a fire button that also aims.
Common errors it fixes
- Recovery dragging the aim below the target after good compensation.
- Random per-frame recoil that differs at 30 and 144 fps.
- Twitchy aiming because ADS changes FOV but not sensitivity.
Credits
Ideas from BLACKWATER by Hiraeth010 (MIT) and SANDLINE by xilinnihao-afk (MIT). Code, numbers, scene and text are ours.
环境要求
- three.js for the demo (vendored); the rules are plain JavaScript and port to any engine
- Node.js 20+ to run the tests; Chrome for the browser check
相关主题
常见问题
基于 BLACKWATER （作者 Hiraeth010，MIT）的思路。代码和文字由 GameSkill 编写，ZIP 里的 CREDITS.md 列出所有来源。 · 基于 SANDLINE （作者 xilinnihao-afk，MIT）的思路。代码和文字由 GameSkill 编写，ZIP 里的 CREDITS.md 列出所有来源。
搭配使用
作者标注的相关 Skills，或更适合相邻任务的 Skills。
FPS Shooter
Build a first-person shooter: move+mouse-look controller, hitscan or projectile shooting, weapons, health, and enemy AI.
Game Feel & Juice
Add juice to actions: screen shake, hit-stop, eased motion, squash and stretch, knockback and layered audio-visual feedback.
Game Input Systems
Game input architecture: action mapping, rebinding with conflict checks, keyboard, gamepad and touch, deadzones, buffering and coyote time.
Game Camera Systems
Cameras that feel good: 2D follow with deadzone and look-ahead, 3D orbit with collision, first-person look, multi-target framing and shake.
相似 skills
open-game-skills
An MIT pack of about 190 SKILL.md agent skills for game design: combat feel, camera, traversal, world, validation, 2D/Spine and art pipeline, with a dispatcher and adapters for Three.js, PixiJS, Phaser, Cocos, Godot, Unity and Unreal.
Kart Drift Boost (tiers, windows, ramps)
A GameSkill original: arcade kart drift-boost rules that reward skill. Drifts charge three tiers, release opens a 0.85 s window you must press in, counter-steer adds a CUT bonus, ramps give one air and one landing boost, boosts take the maximum instead of stacking, and walls cancel everything pending.
One-button Flight (fair tap-to-flap)
A GameSkill original: the rules of a one-button flight game that is never unfair. Flaps set speed instead of adding it, a fixed-step simulation plays the same at 30 and 144 fps, the hitbox forgives grazes, and a seeded gap generator stays inside the reachable band, checked by an autopilot.
Procedural Low-Poly Buildings (kit, validator, views)
A GameSkill original: build stylised low-poly buildings in code from a small spec, then prove them: plot and height limits, a triangle budget per tier, closed outward meshes, supported parts, level roofs and side-only taper measured from silhouettes, plus front, side, top and 3/4 renders checked against the geometry.