feat: add yellow mascot bum dance animation#1603
Merged
senamakel merged 1 commit intoMay 13, 2026
Merged
Conversation
Contributor
📝 WalkthroughWalkthroughThis PR introduces a new animated mascot component for Remotion that renders an SVG character performing a three-phase sequence: front-facing idle pose, a 180-degree turn-around with scaling effects, and back-facing dancing with jiggling cheek animations. The component is then registered in the Remotion root as a playable composition. ChangesYellow Mascot Bum Dance Animation
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches⚔️ Resolve merge conflicts
Tip 💬 Introducing Slack Agent: The best way for teams to turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
remotion/src/Root.tsx (1)
100-103: ⚡ Quick winReuse
SHAREDfor composition dimensions/fps to avoid config drift.This composition hardcodes the same values already defined in
SHARED. Using...SHAREDkeeps all comps consistent if defaults change later.Suggested cleanup
<Composition id="yellow-MascotBumDance" component={YellowMascotBumDance} durationInFrames={270} - fps={30} - width={1080} - height={1080} + {...SHARED} defaultProps={{}} />🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@remotion/src/Root.tsx` around lines 100 - 103, The Composition in Root.tsx is hardcoding durationInFrames/fps/width/height instead of reusing the shared constants; replace these explicit props by spreading the existing SHARED object into the Composition (e.g., <Composition {...SHARED} ...>) so all comps inherit the canonical fps, dimensions and duration, and if any prop must remain different keep it after the spread to override; reference the SHARED constant and the Composition element in Root.tsx when making the change.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@remotion/src/Mascot/YellowMascotBumDance.tsx`:
- Around line 35-45: Split visibility from dance activation: keep showBack =
frame >= 68 to control which side is shown, but introduce a new boolean (e.g.,
backDanceEnabled = frame >= 76 or frame > 75) used to drive energetic motion.
Replace uses of showBack for bobFreq, bobAmp, bob, sway and any arm/energetic
behavior (references: bobFreq, bobAmp, bob, sway and arm motion code around
lines 62-75) so those use backDanceEnabled instead of showBack; leave showBack
only for rendering/visibility decisions.
- Around line 14-17: The timeline header and nearby comments in
YellowMascotBumDance are out of sync with the implemented frame boundaries;
update the documentation comments (top header and the comments around lines
26-27) to reflect the actual phase ranges used in the code: 0–59 for front idle,
60–68 for the first turn-around squish, 68–76 for the expand/turn continuation,
and 76–269 for the back-view dancing, so the comment labels match the runtime
logic in the YellowMascotBumDance component.
---
Nitpick comments:
In `@remotion/src/Root.tsx`:
- Around line 100-103: The Composition in Root.tsx is hardcoding
durationInFrames/fps/width/height instead of reusing the shared constants;
replace these explicit props by spreading the existing SHARED object into the
Composition (e.g., <Composition {...SHARED} ...>) so all comps inherit the
canonical fps, dimensions and duration, and if any prop must remain different
keep it after the spread to override; reference the SHARED constant and the
Composition element in Root.tsx when making the change.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: d94ebbd2-ac67-4ca1-b807-3a5c1bf062e0
📒 Files selected for processing (2)
remotion/src/Mascot/YellowMascotBumDance.tsxremotion/src/Root.tsx
Comment on lines
+14
to
+17
| * 0–59 : Front idle (gentle bob + head drift) | ||
| * 60–89 : Turn-around transition — scaleX squishes front to 0 | ||
| * 90–119 : Turn-around transition — scaleX expands back from 0 | ||
| * 120–269: Back view dancing — energetic bob, side sway, bum jiggle |
Contributor
There was a problem hiding this comment.
Timeline comments are out of sync with frame logic.
The header/docs still describe 60–89, 90–119, and 120–269, but runtime logic uses 60–68, 68–76, then back view. Please align comments with the implemented phase boundaries to prevent future regressions.
Also applies to: 26-27
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@remotion/src/Mascot/YellowMascotBumDance.tsx` around lines 14 - 17, The
timeline header and nearby comments in YellowMascotBumDance are out of sync with
the implemented frame boundaries; update the documentation comments (top header
and the comments around lines 26-27) to reflect the actual phase ranges used in
the code: 0–59 for front idle, 60–68 for the first turn-around squish, 68–76 for
the expand/turn continuation, and 76–269 for the back-view dancing, so the
comment labels match the runtime logic in the YellowMascotBumDance component.
Comment on lines
+35
to
+45
| const showBack = frame >= 68; | ||
|
|
||
| // ── Body bob ─────────────────────────────────────────────────────────────── | ||
| const bobFreq = showBack ? 2.8 : 1.2; | ||
| const bobAmp = showBack ? 22 : 12; | ||
| const bob = Math.sin((frame / fps) * Math.PI * bobFreq) * bobAmp; | ||
|
|
||
| // ── Side sway (back dancing only) ────────────────────────────────────────── | ||
| const sway = showBack | ||
| ? Math.sin((frame / fps) * Math.PI * 1.4) * 18 | ||
| : 0; |
Contributor
There was a problem hiding this comment.
Back-dance motion is enabled during the turn phase.
showBack currently controls both visibility and “energetic back dance” motion, so high-amplitude bob/sway/arm behavior starts at Line 68 while the turn-around still runs until Line 76. Split visibility from dance activation so the second half of the turn remains smooth.
Suggested fix
- const showBack = frame >= 68;
+ const backRevealStart = 68;
+ const backDanceStart = 76;
+ const showBack = frame >= backRevealStart;
+ const isBackDancing = frame >= backDanceStart;
- const bobFreq = showBack ? 2.8 : 1.2;
- const bobAmp = showBack ? 22 : 12;
+ const bobFreq = isBackDancing ? 2.8 : 1.2;
+ const bobAmp = isBackDancing ? 22 : 12;
- const sway = showBack
+ const sway = isBackDancing
? Math.sin((frame / fps) * Math.PI * 1.4) * 18
: 0;
- const bumPhase = ((frame - 120) / fps) * Math.PI * 5.0;
+ const bumPhase = ((frame - backDanceStart) / fps) * Math.PI * 5.0;
- const danceArmL = Math.sin((frame / fps) * Math.PI * 2.4) * 22 + 20;
- const danceArmR = Math.sin((frame / fps) * Math.PI * 2.4 + Math.PI) * 22 - 20;
+ const danceArmL = isBackDancing
+ ? Math.sin((frame / fps) * Math.PI * 2.4) * 22 + 20
+ : 20;
+ const danceArmR = isBackDancing
+ ? Math.sin((frame / fps) * Math.PI * 2.4 + Math.PI) * 22 - 20
+ : -20;Also applies to: 62-75
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@remotion/src/Mascot/YellowMascotBumDance.tsx` around lines 35 - 45, Split
visibility from dance activation: keep showBack = frame >= 68 to control which
side is shown, but introduce a new boolean (e.g., backDanceEnabled = frame >= 76
or frame > 75) used to drive energetic motion. Replace uses of showBack for
bobFreq, bobAmp, bob, sway and any arm/energetic behavior (references: bobFreq,
bobAmp, bob, sway and arm motion code around lines 62-75) so those use
backDanceEnabled instead of showBack; leave showBack only for
rendering/visibility decisions.
New YellowMascotBumDance composition (270 frames at 30fps): - Front idle with gentle body bob, head drift/squash, and arm sway - Fast turn-around transition (16 frames, scaleX flip) - Back profile with energetic dancing bob, side sway, and alternating bum-cheek jiggle — two ellipses animating at opposite phases Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
NeilDesign1
force-pushed
the
feat/yellow-mascot-bum-dance
branch
from
825f5e2 to
571d5bb
Compare
AusAgentSmith
pushed a commit
to AusAgentSmith/openhuman
that referenced
this pull request
May 23, 2026
Co-authored-by: Neel Mistry <neelmistry@Neels-MacBook-Pro.local> Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
YellowMascotBumDanceRemotion composition (remotion/src/Mascot/YellowMascotBumDance.tsx)yellow-MascotBumDanceinremotion/src/Root.tsxAnimation breakdown
Test plan
yellow-MascotBumDance🤖 Generated with Claude Code
Summary by CodeRabbit