diff --git a/app/src/App.tsx b/app/src/App.tsx
index 75e568afe..1f7fede92 100644
--- a/app/src/App.tsx
+++ b/app/src/App.tsx
@@ -685,6 +685,7 @@ export default function App() {
               loop={roomConfig["scene"]["animation_loop"]}
               length={length}
               selectedFrames={selectedFrames}
+              stepSize={1}
             />
             <Line3D
               points={points}
diff --git a/app/src/components/particles.tsx b/app/src/components/particles.tsx
index 8718497c5..0ae8073e0 100644
--- a/app/src/components/particles.tsx
+++ b/app/src/components/particles.tsx
@@ -33,6 +33,7 @@ interface PlayerProps {
   loop: boolean;
   togglePlaying: (playing: boolean) => void;
   selectedFrames: IndicesState;
+  stepSize: number;
 }
 
 export const Player = ({
@@ -44,6 +45,7 @@ export const Player = ({
   loop,
   togglePlaying: setPlaying,
   selectedFrames,
+  stepSize,
 }: PlayerProps) => {
   useFrame(({ clock }) => {
     const a = clock.getElapsedTime();
@@ -62,7 +64,7 @@ export const Player = ({
         } else {
           if (selectedFrames.indices.size > 0 && selectedFrames.active) {
             const nextFrame = Array.from(selectedFrames.indices).find(
-              (frame) => frame > step,
+              (frame) => frame >= step + stepSize,
             );
             if (nextFrame) {
               setStep(nextFrame);
@@ -70,7 +72,7 @@ export const Player = ({
               setStep(Math.min(...selectedFrames.indices));
             }
           } else {
-            setStep(step + 1);
+            setStep(step + stepSize);
           }
         }
       }