Flutter Visual Effects

Translate an intended material or optical behavior into a maintainable Flutter rendering stack without treating an effect package as a design system.

Scope

Own effect fidelity, layer composition, blur and refraction implementation, shader or CustomPainter selection, effect grouping, platform/backend fallbacks, and rendered effect verification.

Route whether the product should use the effect to flutter-ui-design. Route timing, choreography, springs, Hero, and interruption behavior to flutter-animation; measured jank diagnosis to flutter-performance; and native views or platform channels to flutter-platform-integration.

Preflight

1. Inspect pubspec.yaml, Flutter/Dart constraints, enabled platforms, existing graphics packages, and the rendering code around the target surface.
2. Inspect the supplied reference at equivalent content, background, state, and viewport. An isolated translucent rectangle is not enough evidence for a backdrop-dependent effect.
3. State the optical behavior that matters: blur, tint, edge highlight, depth, refraction, shape blending, glow, noise, or responsive deformation.
4. Establish required platform coverage, acceptable fidelity loss, accessibility fallbacks, and whether representative hardware can be profiled.
5. Start from the project's current rendering solution and dependencies. Preserve an adequate existing effect implementation; do not replace it with core code or another package merely for stylistic preference.

Choose by evidence, not ideology