MotionX
Fluid navigation, built to move.
Overview
MotionX is designed to modernize bottom navigation in Flutter applications. Standard navigation components often suffer from rigid layouts, limited indicator shapes, or abrupt state transitions. MotionX addresses these limitations with a single frame-synchronized rendering architecture that computes floating indicator translation and background notch cutout geometry continuously from a single offset driver (animationOffset).
Why It Exists
Bottom navigation is everywhere in mobile apps, but the experience often feels static. MotionX was built to make navigation feel more alive—without forcing developers to build complex animations from scratch.
Key Features
Modern Design Language: Built ground-up to support elevated floating circles, background capsules, top pill bars, bottom underline strips, and custom geometry.
Continuous Frame Synchronization: Synchronizes floating indicators and background notch cutouts frame-by-frame during user drag gestures and programmatic animations.
Granular Customization: Complete control over shapes, proportional scaling, depth, Bezier shoulder radii, haptics, and padding.
Flexible Badge Engine: Positioning system supporting preset anchors, pixel-precise offsets, follow-motion toggles, and customizable container/content metrics.
Decoupled Controller Architecture: First-class integration with PageController and TabController for synchronized PageView dragging without layout recalculations.
Production Accessibility: Complete Right-to-Left (RTL) localization support, screen-reader semantics tags, and Material 3 compliance.
Core Stack
Bring your vision to life.
Flawlessly.
Whether you need a robust technical architecture or a beautiful product built from scratch, I partner with visionaries to turn complex problems into elegant software.
Excellent work attracts excellent opportunity.