New App Onboarding with Rive & SwiftUI

The problem

ET Money’s onboarding had a drop-off problem — static screens that felt transactional, not inviting. In fintech, first-run isn’t branding fluff. It’s the moment members decide whether this app understands money or just wants their PAN.

Parallel to onboarding, core actions like invest and goal-lock needed motion that communicated trust — not decoration beside a form.

What I owned

As Lead Product Designer, I led Rive-driven onboarding and microinteraction work — from first-run education through feedback across core investment surfaces. Motion had to teach and respond to input, not autoplay beside it.

Onboarding

Instead of decorative illustrations, I used Rive so each step responds to input. When you enter your name, the greeting animates. When you set a goal, the visual reflects it. Every animation is input-driven — motion feels like a response, not a video beside the form.

SwiftUI integration — Rive’s iOS runtime bound state machine inputs to @State, so animation and forms shared one source of truth.

Microinteractions

In fintech, the transition communicates reliability. Each interaction is a self-contained Rive component — idle, active, success, error — so the app sets an input and the animation resolves itself.

Button confirmations — the invest control morphs into a checkmark with a slight bounce (~400ms), removing the need for a separate confirmation screen.

Toggle locks — locking a savings goal clicks into place with a snap that communicates permanence.

Pull-to-refresh — the indicator ties into Rive listeners so animation speed matches gesture velocity.

Design engineering

One source of truth

If a state machine in Rive didn’t map to SwiftUI, we fixed it in the tool — not in a handoff doc. Engineering pairs mattered from week one.

Motion as hierarchy

Every beat had to answer what should I do next? before it asked for trust or data. I cut loops that looked polished in review but didn’t move completion.

Components, not one-offs

Onboarding steps and gesture-driven feedback shipped as reusable Rive assets integrated through SwiftUI — so squads could adopt patterns without reinventing motion per screen.

Results

Onboarding completion went up 47%. Time-to-value dropped as the flow felt guided rather than administrative — members moved through KYC and goal-setting with clearer momentum.

What I learned

Input-driven beats auto-play

Motion should respond to what members typed, not loop beside the form — input-driven Rive tied to SwiftUI state made onboarding feel guided.

Time-to-value vs. brand delight

Cut polished loops that didn’t move completion — every beat had to answer what to do next before it asked for trust or data.

Rive and SwiftUI need shared state

Misaligned state machines become day-one bugs — we fixed mapping in the tool with engineering pairs from week one.

Tools

• Rive — state machines for onboarding steps and gesture-driven feedback

• 

  SwiftUI — native forms, navigation, state management

• 

  Figma — wireframes, specs, and component documentation