© João Mourão, 2026. All Rights Reserved | Typeset in Montserrat and PT Serif.
🟢 Available for new projects
🟢 Available for new projects
© João Mourão, 2026. All Rights Reserved | Typeset in Montserrat and PT Serif.
🟢 Available for new projects
Subledger
Subledger
Subledger
SUBLEDGER is a mobile app concept designed to help users keep track of recurring payments in one place.
Instead of manually checking different services, users can add their subscriptions, monitor upcoming payments and see how much they're spending over time.
SUBLEDGER is a mobile app concept designed to help users keep track of recurring payments in one place.
Instead of manually checking different services, users can add their subscriptions, monitor upcoming payments and see how much they're spending over time.
SUBLEDGER is a mobile app concept designed to help users keep track of recurring payments in one place.
Instead of manually checking different services, users can add their subscriptions, monitor upcoming payments and see how much they're spending over time.
Role
• UI/UX
• Product Design
Role
• UI/UX
• Product Design
Role
• UI/UX
• Product Design
SUBLEDGER is a mobile app concept designed to help users keep track of recurring payments in one place.
Instead of manually checking different services, users can add their subscriptions, monitor upcoming payments and see how much they're spending over time.
SUBLEDGER is a mobile app concept designed to help users keep track of recurring payments in one place.
Instead of manually checking different services, users can add their subscriptions, monitor upcoming payments and see how much they're spending over time.
Problem
Problem
Problem
Recurring payments are scattered across different services. Streaming, software, phone plans, memberships and other monthly expenses are easy to forget when they're managed separately.
I wanted to create a simple way to see those payments in one place without turning the app into another traditional expense tracker.
Recurring payments are scattered across different services. Streaming, software, phone plans, memberships and other monthly expenses are easy to forget when they're managed separately.
I wanted to create a simple way to see those payments in one place without turning the app into another traditional expense tracker.
Recurring payments are scattered across different services. Streaming, software, phone plans, memberships and other monthly expenses are easy to forget when they're managed separately.
I wanted to create a simple way to see those payments in one place without turning the app into another traditional expense tracker.
Early Exploration
Early
Exploration
Early
Exploration
I started with a low-fidelity version to work out the basic navigation and information hierarchy before moving into visual design.
The main structure was built around two areas: Dashboard, for managing subscriptions, and Insight, for understanding spending patterns.
I started with a low-fidelity version to work out the basic navigation and information hierarchy before moving into visual design.
The main structure was built around two areas: Dashboard, for managing subscriptions, and Insight, for understanding spending patterns.
I started with a low-fidelity version to work out the basic navigation and information hierarchy before moving into visual design.
The main structure was built around two areas: Dashboard, for managing subscriptions, and Insight, for understanding spending patterns.
Design System
Design
System
Design
System
Once the structure was established, I created a design system to keep the interface consistent across the different screens.
The system defines the typography, colour hierarchy, buttons, input fields, subscription cards, navigation and reusable components.
Once the structure was established, I created a design system to keep the interface consistent across the different screens.
The system defines the typography, colour hierarchy, buttons, input fields, subscription cards, navigation and reusable components.
Once the structure was established, I created a design system to keep the interface consistent across the different screens.
The system defines the typography, colour hierarchy, buttons, input fields, subscription cards, navigation and reusable components.
From Lo-Fi
to Hi-Fi
From Lo-Fi
to Hi-Fi
From Lo-Fi
to Hi-Fi
The low-fidelity structure was then translated into the final interface. I kept the navigation and information hierarchy deliberately simple while introducing the visual system and reusable components.
The low-fidelity structure was then translated into the final interface. I kept the navigation and information hierarchy deliberately simple while introducing the visual system and reusable components.
The low-fidelity structure was then translated into the final interface. I kept the navigation and information hierarchy deliberately simple while introducing the visual system and reusable components.
Final
Product
Final
Product
Final
Product
The dashboard gives users an overview of their recurring payments, including current subscriptions and total spending.
The Insights section turns the collected data into a broader view of spending, upcoming payments and subscription patterns.
Users can select a common service or add a custom subscription with their own payment details.
The dashboard gives users an overview of their recurring payments, including current subscriptions and total spending.
The Insights section turns the collected data into a broader view of spending, upcoming payments and subscription patterns.
Users can select a common service or add a custom subscription with their own payment details.
The dashboard gives users an overview of their recurring payments, including current subscriptions and total spending.
The Insights section turns the collected data into a broader view of spending, upcoming payments and subscription patterns.
Users can select a common service or add a custom subscription with their own payment details.
Reflection
Reflection
Reflection
SubLedger was my final project during my UI/UX course. It gave me the opportunity to take an idea from initial structure and wireframes through to a complete visual system and high-fidelity prototype.
The project also taught me how much of interface design happens before the final screen: deciding what information matters, how it should be structured and how users should move through it.
SubLedger was my final project during my UI/UX course. It gave me the opportunity to take an idea from initial structure and wireframes through to a complete visual system and high-fidelity prototype.
The project also taught me how much of interface design happens before the final screen: deciding what information matters, how it should be structured and how users should move through it.
SubLedger was my final project during my UI/UX course. It gave me the opportunity to take an idea from initial structure and wireframes through to a complete visual system and high-fidelity prototype.
The project also taught me how much of interface design happens before the final screen: deciding what information matters, how it should be structured and how users should move through it.