Indonesia has seen an amazing growth in the number of investors to the country but it still isn’t very attractive — this country of 260 million people only has 1.025.414 investors.

This spells out untapped potential to reach those who are not yet convinced to invest in Indonesia.

This is where tanamduit comes in, as an easy to use fintech product for people to learn more about mutual funds. Users can also painlessly purchase mutual funds and maintain their investments on the same platform.

What is tanamduit?

Tanamduit is a digital platform that helps with financial planning, buying mutual funds and monitor the progress of their investments.

Tanamduit helps newbies — those who are not sure how to invest — and can recommend products that fit their risk profile.

Tanamduit is available on web, Android, and iOS platforms. In this case study, I will share the design process for the app and how the Flolab team came up with solutions.

Defining the Problem

• The tanamduit team shed light on the fact that potential new users are clueless about the importance of investments and how mutual funds can greatly benefit them
• Currently, online mutual funds marketplace don’t provide enough information and education about the mutual fund products.
• Users who have knowledge about mutual funds were unaware about where and how to find a good place to invest their funds, as per their ability.
• Even if a few of them do, users don’t know where and how they can find places to invest that match their investment capacity.

The Goal

Based on these problems, tanamduit realised their customers need a digital platform that can educate them and provide all the information needed to understand mutual funds.

Ideally, the platform will also enable them to easily buy mutual fund products that match their financial goals and of course, where they can monitor their investments.

Following that, the goal was to create a product that is user-friendly, not intimidating for beginners, and easy to use and understand by more experienced users — where they can buy and redeem mutual funds easily.

#1. Observation

The Design Process

Audience

Tanamduit’s main targets are those aged between 20 to 40, smartphone owners, and eager to save money for their future.

Persona

To start off, I created a persona that I could come back to throughout my project to guide my design decisions and priorities. Based on my understanding of people who I knew would use tanamduit, I envisioned the ideal user to be thinking about his/her personal finances and want to achieve his/her financial goals.

Job Stories

I wrote the following job story with the Jobs To Be Done framework
to understand what will user do in the app.

#2. Ideation

Design Goals

• Simple and understandable, customer needs to understand how mutual funds can help them grow their money in the app
• Modern aesthetic-usability, creating a good experience with an aesthetic design yet useful and easy to navigate

User Flow

In order to scope out the experience, I began to create the user flow to visualise the possible solutions for each scenario. Mapping out the experience helped me figure out where each feature should live within the architecture of the app and help me create the right product story. (The current app flow might be slightly different from what we designed initially, considering user needs and business requirements.)

Hand Sketching

Based on the useflow and user stories, I needed to pour all of my ideas in a rough black & white hand sketch wireframe. I had to gather around all the requirements in each page and arrange them in such a way to know what kind of information I should put in a page.

As you can see there’s a lot of sketches — I like to put down all my thoughts and ideas on paper first. I start by writing down all the information that needs to be included in one page, then I draw and re-arrange them to place.

Sometimes I have to create several drawings to know which one works best. After I’m satisfied with the sketches, I usually put sticky notes to tag the page on my notebook so I don’t forget where I put them. The next phase is creating wireframes.

Wireframes

I created wireframes based on the sketches that I drew. We decided that the app will have 5 main tabs on the app: Dashboard, Portfolio, Create New Investment, Activity, and My Account.

Creating wireframes helped me arrange the interface elements while I focused on the functionality rather than appearances. When presenting wireframes to clients, sometimes they are unable to understand what’s on the page because of it’s low fidelity and they often are too focused on the action of command buttons.

So I created a high fidelity wireframe with click-able prototyping and incorporated some color to show important statuses. It is easier to present to clients a wireframe with clear and detailed information.

Inspiration Board

Before getting started with the UI, I created a moodboard to learn about different UI patterns and to gather inspiration from other financial apps — both live apps and conceptual designs.

User Interface / Visual Design

Finally the most fun part of this case study: User Interface! Let me walk you through this.

Onboarding

The first time Jessica opens the app, she will see illustrations that explain a little bit about why she should invest her money in mutual funds instead of putting it away in her general checking account. She can start investing from only Rp 50.000 so there’s no excuse on needing a large sum of money. Tanamduit is already registered with the Indonesian Financial Services Authority (OJK) so Jessica doesn’t have to worry, investing in tanamduit is safe!

Know your Risk profile

When a user opens an account, one of the steps is to choose their Risk Profile. Choosing a risk profile helps users learn what kind of investor they are. They could be a Conservative investor who avoids taking risks and prefers getting a little profit, or a Moderate investor who doesn’t mind taking risks now and then, or even an Aggressive investor who likes it when the stakes are high. Following that assessment, tanamduit gives product recommendations that match their risk profiles.

Browsing products

In this page, I went through several iterations.

• 1st iteration: We thought that the BUY button was too prominent and was looking strikingly repeatable. I put the Compare feature in the header on top and put a product count to indicate how many products are available for comparison, however the number was not readable. The labels above every text field were also making it difficult to grasp the information on every card quickly while browsing for products.
• 2nd iteration: I completely changed how the cards looked by placing the icon and name in the center with a SEE DETAILS button that will go to the product details. I placed all the textual information in rows. After which, the information was clearer, readable and easier to understand. I changed the BUY button into a more subtle color. In this iteration, the compare feature is still on the header but I emphasized on the product count by using green.
• 3rd iteration: We thought that users won’t be aware of the comparison feature because the button is too obscure. We decided to put the comparison sticky at the bottom of the screen.
• Finalized: After getting some feedback from users, we learned that they do not quite understand what is “Low Risk”, “Medium Risk”, and “High Risk”. To help with that, we decided to make tabs for each product risk with a short explainer for each. To make the card more compact, I decided to move the product icon, name, and SEE DETAILS to the left side to save extra space.

Buy Mutual Funds

After comparing and reading the details of each product, our proto-user, Jessica, decides to buy a mutual fund product. Designing a payment system for mutual funds is different from designing one for e-commerce, the same way buying mutual funds is vastly different from buying sunglasses online. We need to inform users that there’s a Cut Off session. We have to tell them that there is a one or two day wait before they get their NAV (Net Asset Value).

Manage Investment in Dashboard and Portfolio

Now Jessica can manage her investment from the Dashboard. She can view the total amount of money she invested, the total current value of her investments, the growth of her investments, and potential gains and losses. She can also check out her portfolio summary at a glance. And she can also buy more mutual funds product if she taps on the Portfolio Summary.

Redeem your investment easily

Now Jessica needs the money that she’s invested for her next holiday. She wants to redeem her investment, she can go the the Portfolio tab and tap on the SELL button. She has to input how much she wants to sell and then there will be a calculation on the Estimated Amount that she will receive.

Again, selling mutual funds is not the same like selling goods in e-commerce. When selling mutual funds you need to wait two or three days to get the amount, and maximum seven days for the Bank Custodian to transfer the money to your bank account. After a short wait, Jessica can draw out the money she invested in tanamduit for her trip. Yay!

Results

Once the app was released we saw some great reviews for it on the Play Store. Having said that, we’re also aware there’s still room for improvement.

Users want more features and more mutual fund products. We’re excited to continue working on the feedback coming in from tanamduit users and continue helping them buy mutual funds with ease.

Reflection / What I’ve Learned

Overall I’m happy with the live results, even though I know we could have done few things better. I learnt a lot while designing this app, including deeper design skills and also more about the art of investing.

I learnt how to build a product right from the start until the development stage and still continue iterating on it. When creating tanamduit I had to re-visit the flow multiple times to get the user experience right.

Design can always be improved; it’s important to know when to ship and wait for user feedback in order to make further iterations.

There are a lot of people out there like me who know nothing about investment, or others who are curious but clueless. I hope creating tanamduit can help a lot of people achieve financial freedom. The app is the first step towards your financial goals!

The app and web platform are still developing and growing. Tanamduit plans to create more features to helps users, add more investment products, and improve the user experience. Shout out for the team that made this project come to life from tanamduit: Ferry Aprilianto — CTO, Sani Fathuddin — Product Development; and from Flolab: Ritika Bhagya — UX Director.

Thank you for reading my tanamduit case study! 👋

I will close this case study with a quote by Warren Buffet.

Someone’s sitting in the shade today because someone planted a tree a long time ago. -Warren Buffett

Invest now! Download tanamduit App

tanamduit Android | tanamduit iOS | www.tanamduit.com

Thanks to Ritika Bhagya, Rafly Nurfallah, Gilang Fadilana, and Sani Fathuddin.