RiSIPs · Investor app

Designing a mutual fund investing experience from scratch

An investor-facing mobile app designed to bring fund discovery, investing, and portfolio management into one cohesive experience.

RoleUX · IA · Flows · UI · System
Duration2 months
ScopeInvestor mobile app
CollaborationPM + developers
Scroll

01 The brief

One platform. Multiple investment journeys.

RiSIPs set out to build a mobile platform where investors could buy, sell, and manage mutual fund investments.

The brief covered the entire investor experience, from account creation and KYC to fund discovery, investment, and ongoing portfolio management. I received a product requirements document, with no existing user flows or interface to build upon.

My role was to translate those requirements into a structured, usable experience: defining the information architecture, mapping user journeys, and designing the interface from scratch.

RiSIPs_PRD.pdfRequirements · v1
Existing user flowsExisting interface
Requirements become journeys, not screens

The challenge wasn't designing individual screens. It was connecting a wide range of financial tasks into one coherent experience.

02 Turning requirements into an experience

Start with the way investors think, not just the features they need.

The PRD defined the product requirements, but those requirements still needed to become navigable journeys. I reviewed competitor experiences, including Groww and Coin, and used Mobbin to study existing patterns for investment, discovery, and portfolio management.

Rather than reinventing familiar conventions, I focused on making the required functionality work together consistently.

GGrowwcompetitor
CCoincompetitor
MMobbinpattern library

Three main destinations · tap one

The home accounts for both investment states

03 The most complex part: onboarding

One app, different account types, different journeys.

Onboarding was one of the most challenging parts of the project. Individual onboarding was relatively straightforward, but joint and minor accounts introduced additional requirements.

Minor accounts were particularly interesting because the journey could begin with two different people.

The design decision · split by account type, early

Individual

One person, one journey: mobile, email, PIN, PAN and Aadhaar, bank, selfie, nominee, eSign.

Joint

The primary holder starts; co-holders are invited and each completes their own KYC before the account is complete.

Minor two entry points

The journey can begin with the guardian or with the minor — so the app first needs to know who is holding the phone.

Pick an account type on the phone

Minor accounts · separate entry journeys

Same account. Different assumptions about who is using the app.

These entry points created different assumptions about who was using the app, whose information was being entered, and how the journey should proceed. Step through both journeys side by side.

Scenario AA guardian starts the accountThe guardian initiates and provides the minor's information.

Scenario BThe minor starts the accountThe minor downloads the app and begins the process themselves.

Different account types weren't simply different fields on the same form. They could represent fundamentally different onboarding journeys.

04 Helping investors make a decision

Discover a fund. Understand it. Then compare.

Fund discovery and fund comparison serve different purposes. I treated them as connected but distinct parts of the investing journey.

The design challenge was to make detailed financial information accessible without overwhelming the screen. I organised the information into distinct sections so investors could focus on the details relevant to their decision.

DiscoverExplore: find the right options

Browse or search for funds, and discover similar alternatives.

UnderstandFund detail: one fund, in depth

Performance first, then the facts, then sections you open only when you need them.

EvaluateCompare: shortlisted funds, side by side

Returns, holdings, management, fund house, objective, pros and cons — one section at a time.

ExplorefindFund detailunderstandComparedecide

The phones scroll and the sections open. Fund cards follow the client's existing product and data requirements; my work was how the information is presented.

05 Designing beyond the happy path

An investment journey doesn't end when everything goes right.

Financial products need to account for what happens when a payment fails, an instruction times out, or a user needs to change an existing investment. For failure scenarios, the goal was to make the next step clear rather than leave users at a dead end.

SIP creation and activationModify, pause, cancel, resume SIPsOne-time investmentsPayment failures and UPI declinesAutopay failures and timeoutsRetry, alternative methods, supportRedemption and transaction states

Order & payment states

SIP lifecycle · tap a state

Every change to a SIP has its own screen, and its own way back.

A flow isn't complete just because the successful path has been designed. The situations that interrupt a journey are designed alongside it.

06 Making the visual system consistent

From individual screens to a reusable design system.

Alongside the UX flows, I developed the app's visual language, including its colours, typography, components, buttons, and cards, and established a repeatable component system so the growing set of screens could stay visually consistent.

Blue for calm and trust. Yellow for prosperity.

The initial colour direction explored blue to communicate calm and trust. Following client feedback, I introduced yellow to bring in a sense of prosperity, while keeping blue as a core part of the visual identity.

Illustration: the same Wealth screen with the blue-only accent. The onboarding flows in section 03 still carry the blue buttons.

Page#020B1B
Primary light#0160C2
Primary#0055B1
Prosperity#F2B84B
Card#161E2D
Gain#2EB77F
Loss · failure#B72E2E
Ink#F3F1EB
Type
Wealth₹ 1,48,250 · 21% annualisedSora — headings, buttons, numbers that lead
Instrument Sans — body, values, labels
Spacing10 · 16 · 20Radius4 · 12 · 16 · 20 · 100Button362×52 · compact 175×44
Actions / Button
PrimarySecondaryOnboarding primaryDisabled
One TimeStart SIP
Cards, pills, banners
HDFC Mid Cap Fund3Y36.04% ActiveMid CapEquity
No money was debited. You can safely try again. How are my SIPs doing?

AI Working with AI as part of the design process

Faster production, with the design decisions kept in my hands.

I used Claude Code and Figma MCP throughout the project, beginning with the PRD and an initial workflow, then creating initial screens and developing the design system. Once the system was established, I used it to support screen generation. My role stayed active throughout: defining the experience, directing the output, evaluating it against the intended UX, and refining the visual details.

01PRD & workflow
I define the journeys
02Initial screens
Claude Code + Figma MCPI direct
03Design system
I set the rules
04System-guided screens
Generated from the system
05Review against the UX
I evaluate & filter
06Refine the details
I refine

The value wasn't simply generating screens faster. It was building a repeatable workflow while keeping the design decisions in my hands.

07 Designing a conversational layer

Helpful guidance without pretending to be a financial advisor.

I also designed the interface for Ri, the app's chatbot. The design explored how users could ask questions and navigate the product while keeping a clear boundary around financial recommendations.

Instead of recommending specific funds, the experience helps users explore factual information, compare options, or move towards speaking with an advisor.

01Ask anything about your account

SIPs, orders, KYC status and statements come back as real cards, not paragraphs.

02Facts, not picks

“Which fund should I invest in next?” gets an honest boundary, not a recommendation.

03A next step either way

Compare funds yourself, or book a call with your advisor.

Tap the suggestions, or type a question

This was an interface-design contribution. It is not a claim that the chatbot's AI behaviour was implemented or validated; the replies here are scripted.

08 Outcome and reflection

A complete investor-app experience, designed from the ground up.

Over two months, I designed the investor-facing mobile app across onboarding, fund discovery, comparison, investing, portfolio management, and key exception states. I worked closely with the product manager to refine flows, and the developers used the designs for implementation.

The app has been developed, but I don't have verified launch data, usability-test results, or post-launch metrics to report. Rather than claim an unmeasured impact, the outcome I can show is the breadth and structure of the designed experience.

0screens in the final, dev-ready Figma file
0onboarding journeys: individual, joint, two minor entries, minor conversion, sub-account
0product screens: discovery, investing, portfolio and exception states
0months, from requirements document to dev-ready design

Counted from the frames in the final Figma file. These measure scope, not impact.

What I took away

01Complexity needs to be resolved in the flow, not hidden in the interface.

Separating account journeys early gave each onboarding scenario its own logic.

02The unhappy path deserves as much attention as the happy path.

Payment failures and SIP lifecycle changes are part of the product experience, not afterthoughts.

03AI can accelerate execution, but it doesn't replace design judgement.

The quality of the result still depends on the decisions, direction, and refinement behind it.

From a requirements document to a complete investor app.

RiSIPs started as a list of requirements with no flows and no interface. Two months later it was a structured, consistent experience covering every journey an investor needs, including the ones where something goes wrong.

End-to-end product design across

Information architectureUser flowsOnboarding & KYCFund discoveryComparisonSIP lifecyclePayment statesConversational UIDesign systemAI-assisted workflow

View more projects

Nucleus · SalesPro · MKU Website Revamp

Browse projects

Explore the blog

60 Minutes to Ship: How a Sleeping TV Sparked a Better Event Experience

Read posts