Loader Animation For Moj App

The Problem: Users of the app would generally be presented with a blank screen with no loading animation present. This would result in users exiting the app under the impression that the app isn't functioning correctly on their device - which wasn't the case in reality.

The Solution: The natural solution here was to create a loader animation that would solve the issue of users exiting the application and also make it visually appealing and engaging enough to keep them waiting to see the app's content.

The process undertaken was several approaches before the final one was selected:

Option 1 was a Mojicon loading bar, wherein a 'Moji' or Moj Emoji would act as the slider button, changing expressions and kinds as it would slide as the loader.

2. Option 2 here was a Mojicon Puzzle. This was intended to be more visually engaging and fun to watch - like a puzzle game as different parts of Mojicons would come together to complete the yellow Moj emoji. This could have different puzzle options as well to keep users more engaged - however, it felt too complex and data-heavy for users who anyway had slow network.

3. Option 3 was kept more true to the app's main branding and simpler than the other options. This featured the Moj Logo directly spinning like a wheel as a loader and transforming into the Moj wordmark. This option, however, was overused in other parts of the app and wouldn't have a distinct mark as the loader animation.

4. Option 4 was taken with a different route in mind. Instead of playing with the Moj emojis and the Moj logo, an element from the Moj branding was extracted and used instead - known as the 'M' or 'Moj' eyes. Here, this element was animated with the full range of the Moj colour palette resulting in a simple, colourful, and engaging loader animation.