In India, a payment success screen is not only feedback. Shopkeepers glance at it, and users screenshot it as proof. A good animation builds trust; a misleading one destroys it.
Model the states
UPI payments can succeed, fail or stay pending for a while. Design each one: a processing state that shows progress without fake percentages; a success state; a pending state that explains what happens next; a failure state with a clear reason and next step; and a timeout state.
Only animate truth
Trigger the success animation from the confirmed server response, not when the user taps Pay. If the status is unknown, show pending. Celebrating a payment that later fails is worse than a slow screen.
The success moment
A short check or tick, about 600 ms to 1 s, then a still screen with the amount, payee name, date and time and UPI reference ID. Keep text static while it animates so screenshots are readable. Haptics and a short sound, if used, should be subtle and respect the phone's silent mode.
Accessibility
Announce the result to screen readers, do not rely on colour alone (green vs red), and use plain words: "Paid ₹250 to Ravi Stores".
Building it
This is a natural fit for a state machine: inputs such as status set by your code drive which animation plays. Rive and ExodeUI both work this way, so the designer's states and the developer's status values match. We make ExodeUI, which is built in India.