In this article, I’ll explain how I approached redesigning the home page of the Jar app — A daily gold savings application

📌 Disclaimer: This is a personal project, and a one day case study. I was in no way associated with Jar at the time of working on this project. Since I had very limited time and information, therefore I’ve taken a few assumptions when it comes to making design decisions.

What is Jar?

Before going further, I will give a brief description of the Jar app. The Jar is a daily gold savings app that lets one save money by taking spare change from their online transactions and investing it in digital gold automatically. Jar helps one create a habit of daily savings by auto investing small amounts as investments in Digital gold, which can be redeemed or withdrawn whenever users want, to their Phonepe, Paytm, or Googlepay account.

Understanding the Problem Statement

Redesigning the Jar Home Page

If you compare a mobile app to a human, the homepage would be the face. The homepage is the area that people notice at the first glance and decide their basic judgments about that mobile app. The mobile app homepage design is the door to a successful product, and a good start is half the battle.

But, if I talk about a redesign, they are changes and people don’t like changes. When we change how a user accesses a certain page in an app, we are asking them to break a habit. The user who could easily locate any screen in the app before is now fumbling to find it, which causes microaggression. So, what I am aiming here as a designer is, to minimize the microaggressions and gradually help the user build a new habit.

Deconstructing the Existing Design

To understand the design thinking and research that went into the creation of the original solution, I decided to deconstruct the entire Home Screen and carefully inspect the current design, to understand how it works, and the intention behind each decision.

Review Analytics

After narrowing down the focus points, my next step is to know how well they perform. Since I don’t have information about usage data, I decided to run a test among a couple of friends and ask them their opinions on the same.

But it didn’t go as planned, I got very different answers, and I couldn’t make a pattern out of those results. Therefore, I decided to take an assumption. As mentioned in the company’s brand statement —

“We want to reintroduce this generation to the concept of piggy banks..”

Competitive Analysis

To define what is considered a standard experience for Home Screens, I analyzed the experiences provided by alternative apps to the customers. While reviewing them, I looked for patterns, commonalities, and similar flows.

For fresh ideas, inspiration, and innovation, I even looked beyond this particular domain.

Identifying Key Problems

After enough primary as well as secondary research, I had a clear picture, and I started observing key problem areas, from usability issues to visual flows, inconsistencies, etc. For usability check, I referred to 10 Usability Heuristics for User Interface Design.

Areas of Improvement Opportunities

After identifying the problems, I started mentioning possible solutions for each problem, taking inspiration from the competitive research and exploration I did earlier.

Working on the Solution

After narrowing down the areas of improvement, I started iterating on the solution. I kept in mind, that I don’t wanna get carried away and make some major changes, which the user might feel a little uncomfortable adapting.

Iterations

All the major changes have been described below.

Iterating on the balance card

Iterating on the CTAs

Iterating on play games card

Final Screen

Learnings & Takeaways

I read a lot of articles in these 4 days, understanding the basics of redesigning, and also got an opportunity to learn about this genre of products. The challenges I faced and learnings I took from the entire process are mentioned below :

• How redesign can play an important role for a product, I learned it’s not only about changing the look and feel of the product, but it is also very important to realize how gradually the changes should be made.
• I got an opportunity to educate myself about finance products which were comparatively new for me.

Future Improvements

• The carousel slider for the Auto Invest feature could have been in the form of a small animated video explaining to the user how it works, it would save the user a few swipes and it would also catch their attention.
• Spin the wheel card is a game, therefore it could be a little more fun.
• Other than that, there is a lot that can be done in the motion design, adding micro-interactions thoughtfully can really change the game. A big advantage of UI motion is that it attracts our attention, and we as human beings are sensitive and prone to being distracted by any type of motion, whether meaningful or not. It does add up a lot of scopes to be expressive, but on the same side, it shouldn’t be overdone.

That’s all folks! Thanks for sticking around till the end, it really means a lot to me :) I hope it was insightful for you. Do leave comments, if you have any.

Fun Fact : Did you know that you could actually give up to 50 claps to an article, just tap and hold the clap button for a few seconds and that’s it. 😅

I’m currently looking for job opportunities as a Product Designer. If you’re hiring, I’d love to have a conversation with you.
You can message me on LinkedIn and Twitter. 😊