Solar Fintech Calculator | Design Challenge
UI/UX
Product Design
Fintech Energy
As part of a design challenge for a venture-backed fintech initiative, I was tasked with creating native iOS app screens for a solar system calculator and quote summary. The goal was to help customers understand the financial impact of installing a solar system — from upfront costs to long-term savings — and guide them confidently through their decision-making process.
Client
Design Challenge
Tool
Figma,Apple Human Interface Guidelines
Year
~4 days
Role
Product Designer
Solar Fintech
Solar Fintech
Solar Fintech
CMS
(Context)
©2025
01
Brief
Design a summary and calculator flow for a new fintech solar marketplace. The experience should help users understand their costs and savings, and serve as a foundation for applying or comparing solar system providers.
01
Brief
Design a summary and calculator flow for a new fintech solar marketplace. The experience should help users understand their costs and savings, and serve as a foundation for applying or comparing solar system providers.
01
Brief
Design a summary and calculator flow for a new fintech solar marketplace. The experience should help users understand their costs and savings, and serve as a foundation for applying or comparing solar system providers.
01
Brief
Design a summary and calculator flow for a new fintech solar marketplace. The experience should help users understand their costs and savings, and serve as a foundation for applying or comparing solar system providers.
02
Goal
Build user trust through transparent financial breakdowns Make solar investment outcomes easy to understand and compare Encourage next-step actions like quote download, email, or application submission Support both upfront payment and loan financing flows
02
Goal
Build user trust through transparent financial breakdowns Make solar investment outcomes easy to understand and compare Encourage next-step actions like quote download, email, or application submission Support both upfront payment and loan financing flows
02
Goal
Build user trust through transparent financial breakdowns Make solar investment outcomes easy to understand and compare Encourage next-step actions like quote download, email, or application submission Support both upfront payment and loan financing flows
02
Goal
Build user trust through transparent financial breakdowns Make solar investment outcomes easy to understand and compare Encourage next-step actions like quote download, email, or application submission Support both upfront payment and loan financing flows
03
Success Metrics
📊 50% reduction in time spent on session creation through bulk editing & duplication. 📊 Improved session tracking, allowing admins to quickly identify low-enrolment sessions. 📊 Better attendee management, with centralised tracking across all subjects.
03
Success Metrics
📊 50% reduction in time spent on session creation through bulk editing & duplication. 📊 Improved session tracking, allowing admins to quickly identify low-enrolment sessions. 📊 Better attendee management, with centralised tracking across all subjects.
03
Success Metrics
📊 50% reduction in time spent on session creation through bulk editing & duplication. 📊 Improved session tracking, allowing admins to quickly identify low-enrolment sessions. 📊 Better attendee management, with centralised tracking across all subjects.
03
Success Metrics
📊 50% reduction in time spent on session creation through bulk editing & duplication. 📊 Improved session tracking, allowing admins to quickly identify low-enrolment sessions. 📊 Better attendee management, with centralised tracking across all subjects.
Overview
Overview
Overview
Project Overview
I was tasked with designing a mobile-native solar calculator and summary flow for a new clean-energy fintech marketplace. The goal: help everyday homeowners estimate system costs and savings, understand their ROI, and compare financing options—all within a user-friendly, trust-building experience.
The design needed to:
Support both upfront purchase and loan repayment paths
Communicate savings and payback periods transparently
Reduce drop-off with progressive disclosure and early motivation
Follow Apple’s native design language and UI guidelines
Understanding the User
I created a primary persona: Claire Tan, a first-time solar buyer, aged 38, moderately tech-savvy, and environmentally motivated. Claire recently received a high electricity bill and is actively exploring solar options.
🔍 Key questions Claire needs answered:
“What size system do I need?”
“How much can I save annually?”
“Is financing worth it compared to paying upfront?”
Function
User Need
Understand cost vs. savings Estimate panel size based on usage. Compare upfront vs. financed payment options Quick application or follow-up with providers
Function
User Need
Understand cost vs. savings Estimate panel size based on usage. Compare upfront vs. financed payment options Quick application or follow-up with providers
Function
User Need
Understand cost vs. savings Estimate panel size based on usage. Compare upfront vs. financed payment options Quick application or follow-up with providers
Structure
Problem
“What size array do I actually need?” “Can I afford it and when will it pay for itself?”
Structure
Problem
“What size array do I actually need?” “Can I afford it and when will it pay for itself?”
Structure
Problem
“What size array do I actually need?” “Can I afford it and when will it pay for itself?”
Visibility
Pain points
- Overwhelming industry jargon (e.g., STC, FiT) - Lack of transparency around quotes - Drop-off due to too many steps without guidance
Visibility
Pain points
- Overwhelming industry jargon (e.g., STC, FiT) - Lack of transparency around quotes - Drop-off due to too many steps without guidance
Visibility
Pain points
- Overwhelming industry jargon (e.g., STC, FiT) - Lack of transparency around quotes - Drop-off due to too many steps without guidance
Research
Main User
👩💻 Admins – Oversee session creation, duplication, and student enrolment. 📈 Marketers – Use data insights to track session popularity and adjust promotions accordingly.
Research
Main User
👩💻 Admins – Oversee session creation, duplication, and student enrolment. 📈 Marketers – Use data insights to track session popularity and adjust promotions accordingly.
User Persona
Overview
Project Overview
I was tasked with designing a mobile-native solar calculator and summary flow for a new clean-energy fintech marketplace. The goal: help everyday homeowners estimate system costs and savings, understand their ROI, and compare financing options—all within a user-friendly, trust-building experience.
The design needed to:
Support both upfront purchase and loan repayment paths
Communicate savings and payback periods transparently
Reduce drop-off with progressive disclosure and early motivation
Follow Apple’s native design language and UI guidelines
Understanding the User
I created a primary persona: Claire Tan, a first-time solar buyer, aged 38, moderately tech-savvy, and environmentally motivated. Claire recently received a high electricity bill and is actively exploring solar options.
🔍 Key questions Claire needs answered:
“What size system do I need?”
“How much can I save annually?”
“Is financing worth it compared to paying upfront?”
Function
User Need
Understand cost vs. savings Estimate panel size based on usage. Compare upfront vs. financed payment options Quick application or follow-up with providers
Structure
Problem
“What size array do I actually need?” “Can I afford it and when will it pay for itself?”
Visibility
Pain points
- Overwhelming industry jargon (e.g., STC, FiT) - Lack of transparency around quotes - Drop-off due to too many steps without guidance
Research
Main User
👩💻 Admins – Oversee session creation, duplication, and student enrolment. 📈 Marketers – Use data insights to track session popularity and adjust promotions accordingly.
User Persona
Ideation & Solutions
Competitive Gaps Identified
Competitive Gaps Identified
Competitive Gaps Identified
🔸 Sunspot
– Too many steps, no progress indicator → user anxiety
– Quote transparency lacking → delayed payoff info
🔸 SolarQuotes
– Form-heavy, lead-gen focus → no real guidance
– Assumes users know their system size
🔸 SolarCalculator.com.au
– Dense charts, no storytelling
– No fallback if users don’t know their usage
How calculator works
To simplify this first step electricity bill calculation, there are 3 ways to do this:
1. Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
2. Estimate Electricity Bills: Provide a default data or rough estimate based on household occupancy.
3. Detailed Calculation: Offer a precise calculation based on actual electricity bills.
To simplify this first step electricity bill calculation, there are 3 ways to do this:
1. Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
2. Estimate Electricity Bills: Provide a default data or rough estimate based on household occupancy.
3. Detailed Calculation: Offer a precise calculation based on actual electricity bills.
To simplify this first step electricity bill calculation, there are 3 ways to do this:
1. Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
2. Estimate Electricity Bills: Provide a default data or rough estimate based on household occupancy.
3. Detailed Calculation: Offer a precise calculation based on actual electricity bills.
Calculator breakdown
Housing Type
Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
Overspending without realizing it?
Housing Type
Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
Overspending without realizing it?
Housing Type
Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
Overspending without realizing it?
Housing Type
Select Housing Types: Choose types of housing and show average prices in the neighbourhood.
Easy tracking and navigating
Estimate Electricity Bills
Breakdown of sessions per subject (e.g., HSC Biology, Chemistry).
Without real-time updates, it's easy to lose track of spending.
Estimate Electricity Bills
Breakdown of sessions per subject (e.g., HSC Biology, Chemistry).
Without real-time updates, it's easy to lose track of spending.
Estimate Electricity Bills
Breakdown of sessions per subject (e.g., HSC Biology, Chemistry).
Without real-time updates, it's easy to lose track of spending.
Estimate Electricity Bills
Breakdown of sessions per subject (e.g., HSC Biology, Chemistry).
Attendees can be filtered by - Session - Subject
Detailed Calculation
Offer a precise calculation based on actual electricity bills.
Receive real-time alerts when you're approaching your budget limits.
Detailed Calculation
Offer a precise calculation based on actual electricity bills.
Receive real-time alerts when you're approaching your budget limits.
Detailed Calculation
Offer a precise calculation based on actual electricity bills.
Receive real-time alerts when you're approaching your budget limits.
Detailed Calculation
Offer a precise calculation based on actual electricity bills.
Updating attendee's details, bulk editing available
Ideation
Ideation
Ideation
Ideation
Iteration
WIREFRAMES
Low-Fidelity Mobile Prototype
Simplified the summary screen to prioritise outcomes over raw data
Reordered inputs to show savings earlier
Created a design system of UI cards and components for future scalability (tablet, web)
Low FI wireframe
WIREFRAMES
Iteration Highlights
Simplified the summary screen to prioritise outcomes over raw data
Reordered inputs to show savings earlier
Created a design system of UI cards and components for future scalability (tablet, web)
Iteration
Iteration
Iteration
Iteration
Final delivery
Final delivery
Final delivery
Final delivery
Final Delivery
Final Delivery
Key Flow Decisions
Journey Split
Users first select if they’re first-time installers or upgraders. This small split allows the experience to feel personalised early on.
📍 Postcode input follows—used to infer sunlight intensity, average system sizes, and region-specific defaults for smarter recommendations.
Key Flow Decisions
Electricity Bill Input
Claire might not know her kilowatt usage, so I offered an alternative estimation path based on household size and time-of-use habits.
To keep motivation high, a sticky footer shows early estimates: “You could save ~$1,240/year, payback in 4.2 years.”
Key Flow Decisions
Roof & Location
Users enter their roof material and see a visual map of their home. This builds relevance and trust, replacing cold forms with contextual imagery.
Key Flow Decisions
Summary Screen (Core UI)
Toggle between loan vs upfront
Graph shows cumulative savings vs cost over 25 years
Key insights like first-year savings, payback time, and monthly repayment are visually prioritised
Users can download, email, or apply directly—offering both soft and hard CTAs depending on readiness
Next Step
If this were to move into implementation, I’d focus on:
Usability testing with real users in target markets
Localisation for postcode-specific rebates and installer data
Expanding into desktop versions for quote review and partner decisions
Collaborating with engineering to build the solar estimation logic and validate region-based assumptions
🙌 Major takeaways:
This project pushed me to think beyond UI — to design systems that empower internal teams through clarity and control. I collaborated closely with developers to navigate technical constraints and prioritise meaningful functionality over visual polish alone. The result was not just a smoother admin experience, but a smarter, scalable foundation for Project Academy’s growth.
Next Step
If this were to move into implementation, I’d focus on:
Usability testing with real users in target markets
Localisation for postcode-specific rebates and installer data
Expanding into desktop versions for quote review and partner decisions
Collaborating with engineering to build the solar estimation logic and validate region-based assumptions
🙌 Major takeaways:
This project pushed me to think beyond UI — to design systems that empower internal teams through clarity and control. I collaborated closely with developers to navigate technical constraints and prioritise meaningful functionality over visual polish alone. The result was not just a smoother admin experience, but a smarter, scalable foundation for Project Academy’s growth.