Fingerprint scanner / CLIENT PROJECT
A little confidence, built in.
Responsive security onboarding that makes a technical moment feel clear and considered.
ANIMATION BY
Piyush KachaMY ROLE
UI animation · State machines · Data binding
390 × 844
Mobile artboard
18 KB
Rive asset, rounded
Client
Commissioned work
BEHIND THE MOTION
Make the next step feel obvious.
A security flow asks people to trust something they cannot see. This animation uses a clear scanning state and a visible progression to make that moment easier to follow. The original client is kept unnamed in this case study.
Behaviour belongs in the design.
The interaction combines a Rive state machine with data binding. A user action starts the next stage, keeping progression tied to the interface. The file uses a portrait artboard that fits naturally inside a mobile onboarding flow.
Small enough to belong in a product.
The supplied Rive file is approximately 18 KB. It carries the vector animation and its behaviour together, so the implementation can use the same asset across screen sizes. Try the scan below to see the transition in context.
For the developers: animation handoff details
This portfolio preview steps through the export’s original State 1–5 and Final timelines. Its view-model properties (IsStart, isButtonPressed, Current Level, and IsFinished) update in the current runtime, but the supplied state machine stays on its initial frame. The source export is preserved; its state-machine transitions should be checked in Rive before using this export for a production integration.
| Animation | Artboard | State machine / view model | Controls / timelines |
|---|---|---|---|
| Fingerprint scanner | V2 | State Machine 1 | State 1, State 2, State 3, State 4, State 5, Final |
UP NEXT
Archery Master