[iOS] Full screen loader whille course is upgarding

[moiz994]

While implementing IAP on the legacy apps, it was seen that after processing the payments it takes some time for the course to upgrade. Considering design heuristics and for a more interactive approach, we have implemented a full-screen loader to show while the learners wait for their course to be upgraded.

Acceptance criteria:

• The loader shows up after the payment is processed and the backend is unlocking the course content
• The loader is not shown when upgrading is completed
• The loader illustration should either be generic or should go with the theme of the app

Current implementation: Video Demo

[moiz994]

@forgotvas @saeedbashir we need to update the rocket illustration to the following rocket icon in order to match the schema design system.



https://fonts.google.com/icons?selected=Material+Symbols+Outlined:rocket_launch:FILL@0;wght@400;GRAD@0;opsz@24&icon.query=rocket&icon.size=24&icon.color=%235f6368

[forgotvas]

@moiz994, like this? Light	Dark

[moiz994]

@forgotvas is it possible to reduce the stroke on the rocket?

[forgotvas]

@moiz994

Dark	Light

[moiz994]

@forgotvas thanks, the stroke looks better but lets get some advice from the design team.

@sdaitzman & @ekangedx can you guys share some design input here? Since the schema design system does not have the illustrations we're trying to add material design icons to match up with the design system. What do you think the screen should look like?

[sdaitzman]

Hi @moiz994, I wonder if we can implement something similar to the limited course states graphics using the rocket_launch Material Design icon?

[moiz994]

@sdaitzman looking at this, I think we can reduce the icon and text size. The order imo should be rocket, text, loader.

[moiz994]

@sdaitzman looking at all the possible places where learners can upgrade and the flow, we can not show the course header like the limited course states for now.

Here's a quick design by me that I think we can use for now:

@forgotvas please have a look at the above loading screen and let me know if there are any questions.

[forgotvas]

hi, @moiz994, what about horizontal mode? What do you like? 1	2

[moiz994]

2 looks good! 👏🏻