← Back to Work

Is my pension funding deforestation?

A React prototype that makes pension ESG data easier to understand, explore, and act on.

Role
Product design
& prototyping
Built
Working React
prototype
Impact
Theme-first
comparison
Pension Lens · Portfolio
ESG portfolio dashboard: total value, performance chart, holdings table and ESG theme cards— view full size

Hover the markers to explore the Portfolio overview including total value, five-year performance, portfolio ESG grade, and one suggested action.

The brief

Pension holders couldn’t tell whether their money was funding something they’d object to.

Disclosure was written for analysts, jargon-heavy, score-driven, rarely designed for people. The ask was never a reskin.

01

Inconsistent Data

Coverage varied by issue and by fund. One headline score hid the impact underneath.

02

Trust Gaps

Stakeholders flagged numbers users didn’t believe. Sources and method had to be visible.

03

Overwhelm

People switched off from text-heavy documents long before reaching anything useful.

What people actually asked for
“I want to know if my pension is funding things I disagree with, like deforestation or war.”
Research participant — a pension holder, non-expert, in a moderated session.
The system

Progressive
disclosure

Strip the complexity and you misrepresent the data. Keep it and nobody reads it. So depth became a layer rather than a separate page: one fund, three levels of answer, no contradiction between them.

A grade to act on, the nine graded issues behind it, then the arithmetic and its sources. Nobody is asked to read more than they need.

Layer 2 / 3
Nuveen Large Cap Value Opportunities · Class C
D
ESG grade
against your preferences
40%
of your portfolio
Fossil fuels F
32% of fund assets exposed
Tobacco producers D
24% of fund assets exposed
Prison holdings F
19% of fund assets exposed
Military weapons F
14% of fund assets exposed
Deforestation B
10% of fund assets exposed

A grade per issue on the provider’s A to F scale, each with the exposure behind it. Nothing is blended into one number.

The original was React — this one's a simplified HTML rebuild, just for the case study.

The fund view

One fund,
taken apart

Grade D
Overall, this fund
32%
Fossil fuel exposure
12.8%
Of your whole portfolio
Fund detail screen: ESG profile with a grade per issue, alignment summary, risk area dials and top five holdings— view full size
Tooltip explaining why fossil fuels are highlighted, linking fund exposure to portfolio impact— view full size
Interaction detail

The arithmetic is explained where the number sits, not in a footnote.

32% of the fund is exposed. It is 40% of the portfolio. So roughly 12.8% of your money is affected. One tooltip, no maths asked of the reader, and the decision is never interrupted.

The theme view

One issue, across everything you own

Every fund ranked by what it contributes to deforestation, split into producers, financiers and consumer brands, with the money named in pounds.

Deforestation theme screen: portfolio exposure, why it matters, and a stacked bar per fund split into producers, financiers and consumer brands— view full size
7.9%
Of the portfolio exposed
£14,460
Invested in flagged companies
3
Ways in: producers, financiers, brands
10%
Worst fund, Nuveen Large Cap Value C
The user flow

Two ways in

Step 01 · Enter

Pick an issue

Nine grades, named in five words people already use.

Nine provider grades grouped into five people recognise: fossil (fuel, finance, insurance), weapons (military, civilian firearms), tobacco, deforestation, prison industrial complex, plus gender equality.

Step 02 · Compare

See who drives it

One issue, every fund ranked by what it contributes.

Exposure = Σ (fund weight × share of that fund flagged for the issue). Fossil fuels reads 22.1% of £184,200; Nuveen, at 40% weight, accounts for 41% of it.

Step 03 · Act

Adjust preferences

Tick what matters and the portfolio grade re-reads.

Ticking issues reweights the portfolio grade, worst band first, never a mean, so a D on something you care about can’t average into a B.

Search stayed a secondary affordance. These users don’t think in tickers, they think in issues, so the issue is the index.

Figures refresh monthly with the provider feed, so every number carries its as-at date. Grades move when holdings or weights move, not silently.

Exposure is share of value in flagged companies, not a judgement of the fund manager. The copy says so wherever a grade appears.

What we did not build
Ruled out

One unified score

Simplest to build, and it recreated the exact problem the research surfaced.

Ruled out

Search-first

Assumed people already knew what they owned. They didn’t.

Demoted

Fund-first default

Assumed a fluency users told us they lacked. Kept as the second way in.

What it shows

Exposure, in plain numbers

£184,200
Portfolio value
+22.4%
5-year return
B
Graded against
your own preferences
Portfolio ESG grade

Where the misalignment sits

Every issue we grade, ranked by how much of the portfolio is exposed. The largest becomes the single suggested action on the overview.

Fossil 22.1%
Fuel exposure 22.1% · Finance score 12.6 · Insurance score 6.3
Tobacco 14.4%
Weapons 11.8%
Military 8.7 · Civilian firearms 3.1
Deforestation 7.9%
Prison industrial complex 2.4%
Gender equality Grade C

Nine provider grades shown as five. Fossil finance and insurance are 0 to 10 risk scores rather than percentages, and gender equality is a percentile rank within the fund’s own group.

Validation

Tested with
real holders

Run with current Tumelo users alongside their research team. I facilitated sessions directly, with a Product Manager and Core Tech lead mentoring direction and feasibility.

Session transcript 3 moderated sessions
P01 Pension holder, non-expert
“I liked how simple it was. I didn’t feel overwhelmed.”
Answers overwhelm
P02 Pension holder, non-expert
“Now I understand what I am investing in.”
Answers clarity
P03 Pension holder, non-expert
“Comparing funds by issues made it click.”
Answers theme-first

Nothing in the feedback asked for more data, only for it to be readable.

What I’d measure next

A prototype has no usage data, so none of this is reported. These are the four signals I would wire up on day one, and what each would actually tell me.

01 Projected

Unprompted explanation

Can a non-expert say what a fund is exposed to, in their own words, without being asked to look it up?

02 Projected

Time to a confident decision

How long one fund or one theme takes to resolve. The old answer was a PDF and an afternoon.

03 Projected

Overview to detail drop-off

Where people stop. Progressive disclosure only works if the next layer is worth opening.

04 Proxy

Repeat use of theme comparison

Coming back to it is the closest thing to trust that a prototype can show you.

Next case study

Cross-Border Payments Dashboard

View case study