UX improvements to the current loading screen implementation

[knguyenBC]

Description of feature / user story

This loading UX concept aims to improve the current implementation of the loading UX.

Current issues identified

• Loading animations are clunky. This is due to react native not being optimal for smooth animations.
• Design has a lot of redundant information
• The time taken to load doesn’t necessarily always constitute a loading bar.

User stories

• As a holder, I want some indication that the loading is progressing, so that I know if the screen is frozen or not.
• As a holder, I want the text that appears when things take longer to be more clear and actionable, so that I know what I can do to help fix the issue
• As a holder, I want to know what the next steps are after the interaction is complete, so that I can easily move on to the next steps.
• As a developer, I want the animations to be simple, so that the animations aren’t clunky or take to long to load.
• As a support agent, I want to see where the loading has progressed, so that when I receive a support call with a screenshot of the loading animation, I can tell where exactly the interaction failed

Acceptance Criteria

Wireframes or relevant image assets / links

BC Wireframe concepts