UX Case Study — Designing “Jago Last Wish” | Bank Jago UX Challenge

Tatas Hendro Wibowo
18 min readMay 31, 2022

--

Disclaimer: This project is under The UI/UX Professional Academy that held by Ministry of Communication and Information Technology of the Republic of Indonesia, through collaboration with Skilvul learning platform (startup), also Bank Jago as the Challenge Partner who gave this real design challenge. I am not working for nor contracted professionally by Bank Jago. This project made as my final project to complete this professional program.

Before anything else, big thanks to Skilvul for giving me the opportunity to learn UIUX Design, Bank Jago as the challenge partner who gave the UX challenge, and surely to our swag mentor in this program, Choirul Garin who guided me through the process, he gave a lot of advices and insights to be a good UIUX designer. Also thanks a lot to my teammates Hazrul Aswad, Mila Amelia and Ridho Ilham. Although since the Design System development stage, two of them were start missing, only Hazrul Aswad and me were remain until the end of the program, it was still an honor and pleasure to work with them as a team. I definitely learned a lot during our process on finishing this project and they are awesome, I hope I can collaborate again with them to do another project someday 😃.

Alright, let’s get started… 🚀

In this project, the four of us worked collaboratively throughout the process of finishing the Jago Last Wish features as UX Researcher, UI/UX Designer, UX Writer, and Visual Designer.
Our role is designing Last Wish feature for bank jago’s app that provide some feature menu such as will-making/testament service, life insurance, sending a trusteeship, and saving dream through all the design processes.
I contributed as UIUX designer and UX Writer, helped my team to take care of the consistency of the design, created unique and fun visual design, also helped them created the design system. I also conducting research, interviews, digital wireframing, low and high-fidelity prototyping, conducting usability studies, and accounting for accessibility of the design. We used Figma, Adobe Illustrator, Zoom, and Google Docs & Spreadsheets as our tools in this project.

About Bank Jago and It’s Feature “Jago Last Wish”

Jago is a financial application that works on a life-centric principle. With the Jago Application, managing finances becomes easier, collaborative and innovative, so you can focus more on living your life, with family and friends. Jago was built by reliable innovators with experience in digital banking and microfinance lending. Jago was developed to become a digital financial pioneer in Indonesia, by presenting a life-centric finance solution. Previously known as PT Bank Artos Indonesia Tbk (Bank Artos), they entered a new era in 2019 with a change in their controlling shareholder. In 2020, they changed name to PT Bank Jago Tbk. Later in the same year, Gojek, through its financial services and digital payment business Gopay, became a shareholder. In 2021, GIC Private Limited committed to injecting funds to strengthen Jago in innovating to provide the best digital financial solutions.

Jago wants to make and introduce a feature that related to the life insurance. If you take a look at the 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. Besides, life insurance commonly used to protect the survivability of the family that we make a living for, through our livelihood before we die. This matter has become quite serious since not every person has created planning for their future. One possibility why they didn’t do it because they want to be more optimistic and less negative (because the future will get scary). So, instead of focusing on the negative aspects that could happen in the future, how about looking at it positively and pleasantly? Where life insurance is used to guarantee an exciting and enjoyable life rather than worrying about death. And here it is, Jago Last Wish is the best solution for that kind of situation.

Jago Last Wish is a feature of Bank Jago mobile app which is related to the life insurance. Not just selling financial products, this feature helps users to support their lifestyles, also helps them achieve their own life goals. In this UX Case Study, Bank Jago challenged us to find a solution from this feature to make life insurance products more fun and less complicated for better future life.

How About the Design Process? 😕

Design Process is a design iteration process to improve the usability and make the interface design more optimal. In this design process, we tried to find problems from user/business perspective, find data as many as possible and arrange it, do some idea brainstorming from those problems and data, create the design solution, then do some tests out of it. And here we used design thinking model from Interaction Design Foundation.
Of all design processes, design thinking is almost certainly the best for “thinking outside the box”. With design thinking, we can do better UX research, prototyping and usability testing to uncover new ways to meet users’ needs, we have the freedom to generate ground-breaking solutions, and we can get behind hard-to-access insights and apply a collection of hands-on methods to help find innovative answers.

This picture describes all the design process that we conduct

First Thing First, “Emphatize” 👂

In this phase, we did our best to know and understand what user desire, needs, and goals when they are using a certain product. We also tried to set aside our assumption to get insights as many as possible.

Secondary Research

Started with a secondary research, we did this research to get to know all the details from problems which are given by the challenge partner, by summarizing published research data as many as possible such as articles, case references, users’ feedbacks, resume from AMA session with Bank Jago, competitive analysis, and data analysis.

Click here for complete secondary research data

Let’s Take a Look at the Survey Result

For the sake of this research, we’ve collected some data through a survey to several respondents in Bogor, Indonesia, about how much their understanding of life insurance and will-making. And here’s what we found…

Respondent Diagram (Life Insurance)

Findings:

  1. All the users think that the life insurance is important (47,4%) and extremely important (52,6%).
  2. 78,9% of the users fell that life insurance service is difficult to make and to claim it because it takes a lot of time and files needed.
  3. Most of the users lost their motivation to have life insurance because it has bad service or responses and most of them felt difficult to make it.
  4. 60% of the users are health insurance users and life insurance users.
Respondent Diagram (Will-making/Testament)

Findings:

  1. 78,9% of the users are interested in preparing their last wish for better future life.
  2. 83,3% of the users think that last wish is extremely necessary for their family member after death.
  3. 94,7% of the users need a digital will-making service because they need to make it with the most easiest way without need a lot of file and waste the time.
  4. 84,2% of the users know what is will-making service (last wish)

Competitive Analysis

For the competitive analysis we decided to pick one feature that available at Traveloka called Traveloka Life Insurance as a comparison. Here’s the feature looks like…

Traveloka Life Insurance Features

User Criteria

And for the user criteria, based on Bank Jago’s challenge brief and our research, we determine the criteria for our users with around 21 to 50 years old. Indeed we’re focusing on target users who are already working and actively using social media, and parents who want to be motivated to prepare for a better future. We’re also targeting that respondents already have insurance from their office or insurance from their families, users who usually use applications for daily needs (i.e. :buying foods, transportations, shopping and others), have used to paid services such as Spotify, Netflix and others with the percentage of unmarried (60%) and married (40%). These criterias are determined according to the POV and the research background of the given challenge.

Alright! Move On to the User Persona! 😎

Next, according to the user criteria that we’ve mentioned above, we create a potential user persona that suites the case given. Creating user persona can help us to understand our user’s needs, experiences, behaviors and goals. Here’s the details…

User Persona

Empathy Map

Besides, we also created an empathy map for the potential user. This empathy map will help us understand our user’s needs while we develop a deeper understanding of the persons we are designing for. Let’s check it out…

Next Step, “Define” 🔍

In this phase, we accumulate all the information gathered during the Empathize stage described above. And then we analyze our observations and synthesize them to define the core problems I and my team have identified.

User Journey Map

From our observation analysis and user persona, then we tried to create user journey map to gain an understanding of how the user experience develops over time and also allows us to discover possible problems in a deliverable and interactive way. Here’s our user journey map…

Click here for more detail

Pain Points

And then after defining the core problems from all the information gathered, finally we found several problem statements which usually called as pain points. Here’s the pain points that I juts mentioned…

Paint Points

Affinity Diagram

The next thing, after defining the core problems and collecting the pain points, we created the Affinity Diagram. It is a method which can help us gather large amounts of data and organize them into groups or themes based on their relationships. The affinity diagram process is great for grouping data gathered during research or organize ideas generated during ideation sessions/brainstorms. Therefore, here’s our affinity diagram…

Affinity Diagram

How Might We & Solution Ideas

And lastly, the How Might We (HMW). How Might We questions purposely opens up the exploration space to a range of possibilities. How Might We questions are the best way to open up brainstorm and other ideation sessions where we explore ideas that can help us solve our design challenge. Here’s our How Might We complete with it’s Solution Ideas…

How Might We & Solution Idea

Move On To the “Ideate Stage” 💡

After framing our challenge as a How Might We question that we already done above, we are now finally prepared for an innovative solution in the third Design Thinking phase, the Ideation phase.

Ideate Stage is a creative process where designers generate ideas in sessions (i.e., brainstorming, worst possible idea). Here, we are gathering all of the information that we got with open minds to produce as many ideas as we can to address a problem statement. So in this Ideate stage, it is all about generating the broadest range of possibilities.

Prioritization Idea (Impact-Effort Matrix)

First, we have to make the prioritization idea. Prioritization idea or prioritization matrix or impact-effort matrix is a decision making tool that assist us to make decisions more efficiently. Impact-effort matrix works by narrowing options down by systematically comparing choices of potential idea that we’ve already created in How Might We section above. Each potential idea, strategy or project is assessed based on the level of effort required and the potential impact or benefits they will have. The goal for us here is to stay focused on identifying the best solutions and maximize time. Here’s the result…

Impact-Effort Matrix

Crazy 8's

After finishing the prioritization Idea, we are now moving to the Crazy 8’s. It is a fast sketching exercise that challenges people to sketch eight distinct ideas in eight minutes. The goal is to push beyond your first idea, frequently the least innovative, and to generate a wide variety of solutions to your challenge. This time, we made 4 sketches by each team member, so here’s the result, take a look…

Crazy 8's

User Flow

Next step, we are now creating the user flow. User flows are diagrams that display the complete path a user takes when using a product. The user flow lays out the user’s movement through the product, mapping out each and every step the user takes from the entry point right through to the final interaction. In this step we created user flow for each feature that included in Jago Last Wish, those flows are shown below…

Will-making User Flow
Life Insurance User Flow
Saving a Dream User Flow

Information Architecture

After creating the user flow, we also created the Information Architecture (IA). Information Architecture is the discipline of making information findable and understandable. It focuses on organizing, structuring, and labeling content in an effective and sustainable way. The goal is to help users find information and complete tasks. Now, let’s take a look at our information architecture below…

Information Architecture

Wireframe

Now, move on to the wireframe. Wireframe is a two-dimensional skeletal outline of a webpage or app. It provides a clear overview of the page structure, layout, information architecture, user flow, functionality, and intended behaviors. Wireframe usually represents the initial product concept, styling, color, and graphics are kept to a minimum. Let’s check out our wireframe below…

  • Wasiat (will-making/last wish) Feature Wireframe
  • Life Insurance Feature Wireframe

Design System

And then, we are now arrived at the Design System. Design system is a complete set of standards intended to manage design at scale using reusable components and patterns. Our main goal in using design system is to help our team achieve higher efficiency, consistency, and scalability when it comes to building digital products. So here’s our design system looks like…

Color and Typography
Buttons and Header
Forms and Tabbing
Icons
Illustrations

Next, Let’s Hop Into the “Prototype” Shall We?🎨

In this phase, we finally implemented the ideas that we found before into an interactive interface. Our main purpose here is to develop a product model or design into a final product that can meet user demands.

First we turned the wireframe that we’ve created before into High Fidelity User Interface Design. Here’s the result…

And lastly, after finishing the high fidelity User Interface design, we created a prototype out from it. So that the design can be tested to our potential users. Please take a seat and try our prototype out! 💻 😎 🍟

you can also access our prototype here

Last But Not Least, “Usability Testing” 📊

And now finally after finished the prototype, all we need to do is a Usability Testing. Usability testing is the practice of testing how easy a design is to use with a group of representative users. It usually involves observing users as they attempt to complete some tasks. This is the last process of the Design Thinking that help us validate our ideas and get insights that we needed as much as possible from our users. In this phase, we used some usability test methods such as in-depth interview, single ease question and system usability scale.

So we conducted remote unmoderated usability study on 5 potential users via zoom meeting. However, before we get into that study, we first made a stimulus user research as a guide and to make it easier when doing usability testing.

For complete documentations about our stimulus user research, you can check it out here

In-depth Interview

After finished the stimulus user research, it is time to perform the In-depth interview. In-depth interview is a qualitative research method. Our goal here is to explore in depth a respondent’s point of view, experiences, feelings, and perspectives. We also did user testing with those 5 respondents to get their experiences and feedbacks on our prototype. And here’s the documentation of our In-depth Interview…

Participant’s Name: Edi Sunardi
Participant’s Name: Axel Zakhwan
Participant’s Name: Ismi Anggraeni
Participant’s Name: Hardiyanti Rusli
Participant’s Name: Rina Adiastuti

Single Ease Question (SEQ)

After conducting in-depth interview session, we proceed to conduct 2 surveys using 2 different methods. The first one is Single Ease Question (SEQ). SEQ is a single-question post-task questionnaire with 7-point rating scale to assess how difficult users complete a task. It is conducted to measure user’s perception of usability based on the last attempted task and to ask them about how difficult or easy was the task to complete. Since the task is still fresh in the participants’ minds, their answer provides a useful assessment of the experience for that particular task. Here, take a look at the result…

As shown above, we obtained average 84% according to the Single Ease Question (SEQ) result. Which means that our product is useful, usable and easy to use. 🎉

System Usability Scale (SUS)

And the last method is System Usability Scale (SUS). SUS is a 10-Question questionnaire with five response options for respondents from strongly agree to strongly disagree That offers a quick, cost-effective yet accurate way to evaluate the usability of a website or a mobile app. We used this method because we want to evaluate a wide variety of our products and services that we already made. So, here’s the result:

As shown above, we obtained excellent rating with 80.5 average score according to the System Usability Scale (SUS) result. Which means that our product is reliable to use. 🎉

For complete documentations about participant’s feedback during usability testing, and the test results, you can check it out here

Research Findings

However once again, there’s no such a perfect design existed. So from the Usability Testing that we’ve already done above, we obtained several findings that are important and useful to evaluate and improve our design. And here’s what we found…

  • Users are very interested in the last wish feature. However, there is still a lot of confusion when using the feature’s prototype.
  • Users feel confused when they try to understand the unclear explanation of the terms & conditions. They think it can still be made in more detail. For example, the information about admin fee payment schedule on Dream Saving feature. And the cancellation of saving on dream saving feature, it doesn’t have a minimum period of time before it can be canceled.
  • The placement of the information needed is still inaccurate. For example: information about photos supporting a will, don’t make it as a popup when click info icon, it’s better to put it above the photo input field, or if we want to use it as a popup, it can be displayed at the beginning of the page.
  • In terms of UI, the logo used in main features are too small, and contrast or emphasis of the font is still unclear. For examples some should be thicker/bigger in size such as buttons and sliders which are not big enough. Also the size of the text displayed on the insurance feature, it’s a lot but it’s small. It might be difficult for elderly users to read it.
  • Users consider about security when making video calls with a notary, they tell us what about users who have twins, they think it’s still possible to manipulate it. They suggest maybe if there is facial recognition other than a pin, or maybe a fingerprint scan will also be more secure (because will-making are case sensitive). And also the signature part is better if it comes with a photo file of the signature because it will make more consistent. Then the olographic will’s witness might be better and valid if we include their signature too.
  • In the trust feature, it’s better if there are 2 options for filling in the sender’s name. The first one is send as your own name (this should automatically use Jago’s account data, so you don’t need to fill the data again. The second one is send as others name (now this one just filled with the other sender’s data).
  • The last one is on the notary page. It’s better if there is satisfaction feedback after a video call with a notary as a solution for users who don’t match a certain notary. And then the choices of notaries available should automatically match the location of the will maker, for example if the will maker is in Surabaya, Indonesia, it means that only registered notaries (in Jago) in Surabaya area are shown.

Conclusion

So in this challenging and exciting project, it can be concluded that users are still concerned enough about the importance of the insurance, how it works and affects their lives, what kind of services and benefits that it provides, etc. And although their age are still relatively young, they also pretty concerned about will-making/testament, because it’s a sensitive case, so it should be well defined, well recorded legally, and secured. A will/testament also contains not just some legacy of assets which is beneficial for the abandoned family, but it can also provide more benefits to others (i.e. if someone make a will/testament for their family to continue/grow their social/educational institution up).Therefore those two things are definitely important so that we hope people can understand and be educated about the good impact that insurance and will-making/testament offer in the future life.

And indeed, we learned a lot of new things about will making/testament and insurances because those are both sensitive cases so we have to be more careful & thoughtful when we are considering ourself to enroll in it. Although our design is not perfect yet, we’ve tried our best to provide a digital product about will making and insurance in just about 2 months. And the most difficult part in the process is to consider about how the security of the product works, which can be crucial for users to use it.

However, with the power of teamwork, we are successfully generated a bunch of new ideas and solutions to the problems that we received from users and create a product out of it that was close to the minimum viable product to launch. In the future, my team and I will proceed to iterate on features that still have some deficiencies in order to make them even better.

Alright, that’s all for now, I hope you guys enjoy reading this case study. I also sincerely apologize if there is any mistakes while delivering the case study. 😇

Anyway, thank you so much and see you guys again in the next project. 😎

If you feel curious about me, go check my LinkedIn or my Instagram, peace ✌️

--

--