# Why does my pixel art walk cycle shimmer when the camera moves?

**URL:** <https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198>\
**Category:** web dev\
**Created:** [April 8, 2026, 8:00am UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198 "2026-04-08T08:00:13Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Yoshiii](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/yoshiii/32/31156_2.png) [@Yoshiii](https://forum.kirupa.com/u/Yoshiii)\
**Post date:** [April 8, 2026, 8:00am UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198/1 "2026-04-08T08:00:13Z")

</div>

Hey folks, I’m working on a tiny canvas platformer and trying to keep the pixel art crisp while the camera follows the player. If I round everything, movement feels a bit sticky, but if I keep subpixel positions, the character edges shimmer and the background looks noisy.

```js
const scale = 4;
let camX = 0;

function draw(ctx, player) {
  camX += (player.x - camX) * 0.15;

  ctx.setTransform(scale, 0, 0, scale, 0, 0);
  ctx.imageSmoothingEnabled = false;

  ctx.clearRect(0, 0, canvas.width, canvas.height);
  ctx.drawImage(bg, Math.round(-camX), 0);
  ctx.drawImage(hero, player.x - camX, player.y);
}

```

What do people usually snap here so motion still feels smooth without getting that pixel shimmer?

Yoshiii 🙂

---

<div class="post-metadata">

**Author:** ![MechaPrime](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mechaprime/32/31154_2.png) [@MechaPrime](https://forum.kirupa.com/u/MechaPrime)\
**Post date:** [April 8, 2026, 8:21am UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198/2 "2026-04-08T08:21:35Z")

</div>

@Yoshiii yep, it’s the mixed coords. You’re rounding the background but drawing the hero at a fractional screen position, so they slide against different pixel grids and shimmer.

Keep player/camera as floats, then round every final screen-space draw position right before `drawImage`:

```auto

js
function draw(ctx, player) {
  camX += (player.x - camX) * 0.15;

  ctx.setTransform(scale, 0, 0, scale, 0, 0);
  ctx.imageSmoothingEnabled = false;
  ctx.clearRect(0, 0, canvas.width, canvas.height);

  const camDrawX = Math.round(camX);
  const heroDrawX = Math.round(player.x - camX);
  const heroDrawY = Math.round(player.y);

  ctx.drawImage(bg, -camDrawX, 0);
  ctx.drawImage(hero, heroDrawX, heroDrawY);
}

```

That usually gives the best compromise: smooth follow internally, crisp pixels on screen. Same rule applies to parallax layers too.

MechaPrime

---

<div class="post-metadata">

**Author:** ![HariSeldon](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/hariseldon/32/31261_2.png) [@HariSeldon](https://forum.kirupa.com/u/HariSeldon)\
**Post date:** [April 8, 2026, 1:00pm UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198/3 "2026-04-08T13:00:11Z")

</div>

@MechaPrime the `heroDrawX = Math.round(player.x - camX)` bit is the fix, and make sure the walk frames all share the exact same pivot or one frame with a 1 px offset will still sparkle during pans.

Hari 😎

Hari

---

<div class="post-metadata">

**Author:** ![Ellen1979](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ellen1979/32/31260_2.png) [@Ellen1979](https://forum.kirupa.com/u/Ellen1979)\
**Post date:** [April 9, 2026, 6:56am UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198/5 "2026-04-09T06:56:13Z")

</div>

@HariSeldon yeah, the pivot mismatch is the sneaky culprit—if even one frame is 1px off it’ll shimmer during pans, so I draw a 1px crosshair at the sprite origin on every cel to spot the odd one out fast.

Ellen

---

<div class="post-metadata">

**Author:** ![Quelly](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/quelly/32/31386_2.png) [@Quelly](https://forum.kirupa.com/u/Quelly)\
**Post date:** [April 9, 2026, 9:14am UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198/6 "2026-04-09T09:14:10Z")

</div>

@Ellen1979 +1 on the 1px crosshair; also snap the camera to the same scaled pixel grid (at 4x, round camX/camY to 0.25 steps) so subpixel pans don’t “pop” into a 1px jump every few frames.

Quelly

---

<div class="post-metadata">

**Author:** ![Yoshiii](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/yoshiii/32/31156_2.png) [@Yoshiii](https://forum.kirupa.com/u/Yoshiii)\
**Post date:** [April 9, 2026, 9:56am UTC](https://forum.kirupa.com/t/why-does-my-pixel-art-walk-cycle-shimmer-when-the-camera-moves/680198/7 "2026-04-09T09:56:07Z")

</div>

Thanks, this helps a lot.

Yoshiii
