Suspendisse interdum consectetur libero id. Fermentum leo vel orci porta non. Euismod viverra nibh cras pulvinar suspen.

Moblink Jazz App

Leading the redesign effort for JazzCash, one of South Asia's largest mobile wallets, was a pivotal task Meldin undertook. Tasked with overseeing the application's comprehensive redesign, we navigated the complexities of managing product stakeholders while maintaining hands-on involvement in key design aspects.Through extensive user research, we unearthed critical pain points, shaping our product direction and success metrics. Addressing challenges such as accessibility, service discoverability, and user control, we set ambitious goals for the design team.

Date : 10 Mar 2024

Categories: UX/UI

Bringing the team under a shared set of goals and values

One of the key things that I did early on was to introduce a shared set values to the team that we can all relate to and our also inline with the overall organizational and business values. These values were to become a cornerstone as we dived into the redesign exercise and something we all kept coming back to whenever we felt lost or needed a reminder of what is the objective that we all share.

More than just words

These values were referred in every design critique and every stakeholder presentation. During our review sessions every designer used to go back to these values and ensure that every experience being re-designed or designed was following these values.


Research and Metrics

Through our extensive research exercise of interviewing users and our business stakeholders. We uncovered the pain-points of the existing platform, These pain-points helped us define our product direction and metrics for success. Some of the pain-points included:

  • Users were unable to find settings for their account unless they were told where they were.
  • Finding the right service was difficult.
  • People found it differentiate between decorative design and functional UI elements.
  • Marketing ad banner at the top was distracting.

On the other side our business stakeholders wanted to improve on the AARRR a.k.a Pirate Metrics.

  • How are people discovering the services and offerings in the product?
  • Are these people taking the actions that they want them to E.g. Putting money in their account?
  • Do users like to engage with the product?
  • Do users like the product enough to tell others ?
  • Do users like the product enough to spend money on our platform than our competition?

Using a cascading approach to defining UX metrics, we created the following goals and challenges for the design team:

  • Make information and actions more accessible.
  • Improve service discoverability
  • Allow users to be in more control over their experience
  • Make user journeys more closer to the user’s mental models
  • Make completing a transactions even more easier.
  • Give more importance to actions around the account balance.

Early Concepts

Final Transformation

Improved profile and balance visibility

We re-organized the header area to give the user balance a more central position and to make the related actions clearer and more accessible.

From hamburger menu to My Account

Our research indicated that the functions under the hamburger menu were not understood and there was not a lot of context of what goes in there. We created a new section in the app to manage account and made the function clear and obvious by placing it inside our new header.

Dynamic Notification Area

We came up with a new dynamic notification area that replaces the username and can be used to notify the user of key account statuses like being eligible for a loan, running on a low balance, etc.

All new service icons

The existing design used too much of yellow and the research conducted previously showed the users leaning against these fully yellow icons, which look more decorative than functional. As a result we placed each service icon inside a container, gave it some elevation to seem tappable like a button and chose a visual language for icons that was less elaborate.

A functional tab bar

The older experience did not really have a tab bar but rather just three services at the bottom of the homepage. While we wanted to improve this experience, we also wanted to be vary of the fact that a lot of our users are used to finding these services at the bottom of the homepage.

We cleaned up the bottom bar to align it with the standard tab functionality and added a super search that lets users search services and also brought down the In Invite & Earn service to a similar right edge of the screen.

The research indicated that the help was not a very a widely used option from the bottom bar so we found a new place for it at the top of the home experience inside the wallet section to give it more context alongside our new notification center.

Services Drawer

JazzCash hosts more than 50 payment services that its users use. We introduced a services drawer much like how the android app drawer works since over 95% of JazzCash users use Android OS and are super familiar with sliding drawers that host all their applications. For non-familiar users, we added affordance in the form of a drawer handle just above the tab bar and also made the functionality clearer through the app onboarding.

Light/Dark theme Ready

The re-imagined JazzCash also supports Light and Dark theme in line with the new design language.