UI/UX Case Study: Last Wish Feature Bank Jago
Hi everyone! I’m Afifah Ratma Mahardika. This time I'm going to share my project’s design process for the challenge by Bank Jago as Challenge Partner.
Diclaimer : This project is part of the UI/UX training program implemented by Skilvul , for Kampus Merdeka program held by Kementerian Pendidikan, Kebudayaan, Riset, dan Teknologi Republik Indonesia. Bank Jago is the Challenge Partner. I am not working for nor contracted professionally by Bank Jago.
here’s the detail for this case study:
Project Duration: 1 month
Tools: Figma
Role
I work as UI/UX Designer collaborating with my 2 team members, Arttenna Dhyttya Nagara and Mayang Sari. Our responsibilities are :
- Brainstorming idea for Jago Last wish Feature with Design Thinking on our Focus Group Discussion to do emphasize and make Pain Point, How-Might-We, Solution Idea, and Crazy’s 8.
- Make some Wireframe for Last Wish Feature.
- Make Atom UI Styleguide such as Typography, Color Style, Header, Input Field, Button Style & Molecul UI Styleguide.
- Make UI Design from Wireframe.
- Make an interactive prototype.
Overview
Jago is a digital financial service that focuses on the daily life of users, with the largest ecosystem network in Indonesia. There are many kinds of problems in a person’s daily life, but there are financial products that are used to fulfill these needs. For example, when you are hungry and order GoFood, you pay using Gopay. When you want to be a Youtuber, you need to save to buy mini studio equipment and buy it at Tokopedia. At Jago, although our main business is financial products, we understand that from the user’s perspective what they think about is not the financial product, but the end goal (example: hungry -> eat, become a YouTuber -> make a studio). Therefore, when we want to create a savings product, we don’t stop with just creating a digital account feature, but we also think about integration into services that can provide goods or services that users need. So that everything becomes easy and smooth, for everyday life, future dreams, and activities with friends and family.
Imagine if Jago wanted to create and introduce a feature related to life insurance. If we look at life insurance products that are currently on the market, usually these products are sold as a form of prevention from disasters or bad things that will happen in the future. In addition, life insurance is also usually used to protect the livelihood of the family you support through your livelihood before it is time to die. This is quite serious considering that not everyone has planned for the future. One possibility why people don’t do it is because they want to be more optimistic and less negative (because the future gets scary).
Objective
as for the objective of making this feature are :
- The steps for making a will are easy, considering that users can enter various types of requests
- An easy way to calculate the required monthly payment for what form users want
- Management of commitments made and edited wills
- Gamification or creative ways related to a healthy lifestyle and fitness that can lower the cost of previous monthly commitments
Design Process
In this case study, we used Design Thinking as a design process approach. Design Thinking is iterative and non-linear which has 5 stages (Empathize, Define, Ideate, Prototyping, and Testing) which are suitable for use in this project.
1- Emphatize
This phase is the first step of design thinking. we tried to understand the needs and wants of the target user, then find out what problems the user is facing. We do some desk research by collecting data from the competitor analysis, looking for feedback on similar apps, resumes from AMA Session with challenge partner. And besides that, I did a short interview to find out about life insurance.
2— Define
After Empathize stage, we carried out the Define stage. In this stage, we did brainstorming to collect our insight in empathize stage about the user’s pain point and formulate How-Might-We. We collected in the form of sticky notes using Figjam.
In the pain point, we describe user problems, and then in the How-Might-We stage, we think of solutions to solve user problems that we can offer. After that, we vote How-Might-We that we put on FigJam to define the main focus we should solve.
3 — Ideate
In this stage, we tried to brainstorm ideas by discussing solution ideas based on How-Might-We at the define stage. After voting at the define stage, it has been determined that making it easier for users to understand the importance of making insurance is the main focus of the How-Might-We.
We grouped solution Ideas to make Affinity diagrams based on function.
After defining pain point and How-Might We and the solutions we have discussed, we choose the priority in the form of an Affinity Diagram.
Then each of us designed the Crazy-8. For the Crazy-8 stage, the team is given 8 minutes to design the UI that they want to make in one HVS sheet or blank paper divided into eight parts or by making 8 wireframe UI designs or low fidelity prototypes.
4— Prototype
At this stage, we create an userflow to give an overview, then make some wireframes based on userflow. Before creating a UI Design we made UI Styleguide, so it’s easier when creating a UI design. We also create a prototype that can be used for testing.
Userflow
After prioritizing the idea, we made User Flow, a visualization of interactions for user needs to complete a specific task on an app. At this stage, we did brainstorming to think about how to make an efficient user flow so the users can reach their goals easily.
Wireframe
After sketching and creating an user flow, we started creating wireframe designs. This stage is useful for providing a rough overview of the product to present information in the interface.
UI Styleguide
The UI Styleguide contains reusable components that will be needed when doing high-fidelity designs so that later the designs we make can be neat and uniform. The UI kit here is mostly based on the Bank Jago application.
UI Design
We created screens based on user flows and wireframes that we made before. The first sone we made about Jago Last Wish making until the transaction finished.
The second one, we made screens about Will Making. Here the user can make a will as desired and user can add more Family members who receive the will.
And the last one, we made screens about Gamification. Here users can get a reward point by finishing the challenge.
Prototype
Finally, After the UI Design has been created, then it’s time to create a prototype as a representation of the final design result. The prototype was created using Figma. here’s the following clickable prototype.
5 —Testing
After designing the application, we did testing to test the design of the Jago Last Wish Feature by doing an In-depth Interview and Usability Testing. For the in-depth interview, we recruited 1 respondent to conduct a question and answer session. Here are the respondent criteria that we need:
In this case, we have a respondent:
- Female
- 29 years old
- Work as a Private Sector Employee
- Lives in Depok
In-Depth Interview
Research date: 28 November 2021
This in-depth interview aims to conduct user research, in the interview session we asked several questions related to life insurance and respondents' habits in using financial digital. Then respondents will be asked to test the prototype with the tasks that have been provided. There are 3 tasks, there are Jago Last Wish Making, Wills Making, and Gamification: JagoFit. After that, questions will be asked in the form of usability, convenience, and satisfaction in testing the prototype. Then after receiving feedback, it will be analyzed to conduct an assessment using a Single Ease Question (SEQ) calculated with a Likert scale from a range of 1 to 7. A value of 1 means that the design is very difficult to use while a value of 7 means that the design is easy to use.
The user gave 6 for the SEQ score because she felt that the flow of Jago Last Wish Feature is understandable and simple. That means our design is easy to use.
Conclusion
From all the processes that have been carried out until the final process, it can be concluded that the results of the Last Wish Feature design testing are worth 6 out of 7, meaning that the respondents are satisfied, and helped by this design solution. However, improvements are still needed, such as using copywriting easy to understand for everyone and improvement for layout design.
Next Iteration
We got some revisions according to the feedback during the testing session with users, including :
- Make copywriting easier for users so everyone can find information easier and not be confused.
- The Privacy Policy checkbox button must be larger.
- Change layout position for Gamification: JagoFit.
Thank you for taking the time to read my UI/UX case study. If there are criticisms and suggestions about this case study, I am very grateful. Danke, have a good day! •ᴗ•
