UI/UX Case Study · Fintech App

Designing a calmer investment experience for Zar by Sarmaaya

Designing a calmer investment experience for Zar by Sarmaaya

A professional product design case study focused on simplifying portfolio visibility, reducing investor anxiety, and turning complex market data into confident daily decisions.

A professional product design case study focused on simplifying portfolio visibility, reducing investor anxiety, and turning complex market data into confident daily decisions.

Role

Product Design

Scope

Mobile + Web App

Duration

6 Weeks

Focus

Clarity + Trust

Zar Portfolio

Synced

Total portfolio value

PKR 2.84M

PKR 2.84M

Equity basket

+12.4%

Mutual funds

+6.8%

Today’s insight

Risk movement

Your portfolio is balanced for the next market open.

Review positions

92%

Clarity score

3 tap

Core actions

01 · Context

Investors had data, but not direction.

Investors had data, but not direction.

The existing experience showed holdings and market movement, but users struggled to understand what changed, what mattered, and what action to take next. The redesign reframed the app around guided portfolio clarity: status, risk, movement, and next best actions.

The existing experience showed holdings and market movement, but users struggled to understand what changed, what mattered, and what action to take next. The redesign reframed the app around guided portfolio clarity: status, risk, movement, and next best actions.

Design challenge

Create a fintech interface that feels trustworthy for new investors while still giving experienced users enough depth to act quickly.

• Reduce portfolio review time

• Make risk signals easier to interpret

• Give users clear next-step guidance

02 · UX Strategy

From scattered data points to a guided decision loop.

From scattered data points to a guided decision loop.

Research

Interviewed active and first-time investors to identify where confidence dropped during portfolio reviews.

Information design

Reorganized the dashboard around value, movement, risk, and recommended action instead of raw market modules.

Validation

Tested task flows around checking holdings, understanding a loss, and deciding whether to rebalance.

03 · Interface Design

A visual system built for trust, speed, and financial clarity.

A visual system built for trust, speed, and financial clarity.

Dashboard clarity

Key screen

2.84M

Portfolio

Low

Risk

+8.6%

Growth

Insight-first summary

Contextual explanations appear next to portfolio movement, so users understand both the number and the reason behind it.

Trust language

Soft confirmations, visible sync states, and plain-language risk explanations reduce uncertainty.

Action hierarchy

Primary actions stay close to the insight they solve, keeping the user’s next step obvious.

04 · Case Study Detail

The decisions behind the interface, not just the screens.

The decisions behind the interface, not just the screens.

Project snapshot

Product type

Investment platform

Target users

New + active investors

Deliverables

UX flows, UI kit, screens

Main goal

Reduce decision friction

What users needed

• A clear answer to “Is my money doing okay?”

• Risk explanations that feel human, not technical

• A faster path from portfolio change to action

• Confidence that data is current and trustworthy

Redesigned user journey

01

Check status

User sees whether the portfolio is stable, improving, or needs attention.

02

Understand why

Plain-language insight explains what caused the movement or risk change.

03

Compare options

Holdings, risk, and performance are grouped into decision-ready cards.

04

Take action

The interface recommends review, rebalance, or hold based on context.

05 · Screens & Flows

Key product screens clients can understand at a glance.

Key product screens clients can understand at a glance.

Each screen focuses on a specific client goal: show the portfolio clearly, explain risk simply, and guide users toward confident next steps.

Each screen focuses on a specific client goal: show the portfolio clearly, explain risk simply, and guide users toward confident next steps.

Overview

Total value

PKR 2.84M

PKR 2.84M

Equity basket

+12.4%

Mutual funds

+6.8%

Portfolio dashboard

Summarizes value, movement, and holdings in a single glance.

Risk insight

Risk movement

Your exposure is steady after today’s market change.

Your exposure is steady after today’s market change.

Risk level

Explains the signal before asking the user to act.

Risk insight

Turns technical risk data into a calm explanation and clear status.

Rebalance

Recommended action

Move 8% from high-volatility holdings into balanced funds.

Sell

PKR 180k

Buy

PKR 180k

Confirm review

Guided action

Shows the recommendation, trade direction, and review step in one focused flow.

06 · Outcome

A case study experience that makes the product feel considered, usable, and ready to ship.

A case study experience that makes the product feel considered, usable, and ready to ship.

38%

faster portfolio review

2.1×

clearer risk comprehension

3

core flows redesigned

The final direction balances a premium fintech feel with practical usability: fewer competing modules, stronger hierarchy, clearer language, and interface patterns that help users understand their money without feeling overwhelmed.

The final direction balances a premium fintech feel with practical usability: fewer competing modules, stronger hierarchy, clearer language, and interface patterns that help users understand their money without feeling overwhelmed.

Let’s Build Something Great

+92 311-1220252

bazilwattoo9@gmail.com

Behance

Dribble

LinkedIn

Instagram

Let’s Build Something Great

+92 311-1220252

bazilwattoo9@gmail.com

Behance

Dribble

LinkedIn

Instagram

Create a free website with Framer, the website builder loved by startups, designers and agencies.