Skip to main content
UI Coach Logo
Back to challenges
Intermediate

Shared Bills and Household Payments

Design a bill workspace that tracks household costs, splits responsibility, and makes upcoming payments clear to roommates.

Mobile, Responsive web

The brief

Understand the problem

Background

Shared households receive bills on different schedules and through different accounts. Spreadsheets show totals but do not make ownership, partial payment, or changing occupancy easy to understand.

User context

Caleb shares an apartment with three people. He pays the electricity bill, another roommate manages internet, and one person is moving out halfway through the billing period.

Product problem

The product must distinguish the amount owed to a provider from amounts owed between people, then handle adjustments without rewriting past records.

Objective

Design bill capture, split review, reminder, and settlement states for a shared household.

What to design

Define the experience

Required experience

  • Bill entry or import
  • Transparent split calculation
  • Household balance and settlement

Screens and states

  • Upcoming bills dashboard
  • Bill and split detail
  • Payment request
  • Household activity

Core user flow

Follow the critical path

  1. 01

    Caleb imports the electricity bill

  2. 02

    He checks the billing dates and adjusts one roommate's share

  3. 03

    Everyone receives a clear request

  4. 04

    Payments update each person's balance without changing the provider status

Product rules

Requirements and constraints

Requirements

  • Show provider due dates separately from roommate deadlines
  • Explain how each share was calculated
  • Support partial and offline payments
  • Keep edits and reminders visible to the household

Constraints

  • Not every provider supports direct payment
  • Roommates may use different currencies or payment methods
  • Financial details should be shared only as needed

Reality check

States worth considering

A bill is corrected after splitting
A roommate leaves mid-cycle
Someone pays the provider directly
A scheduled payment fails

Ready-to-use content

Mock data

Use this content to test hierarchy and realistic data states. You can expand it when the concept needs more depth.

October household bills

  • Electricity, $146.80, due 18 October
  • Internet, $72.00, paid to provider
  • Water, $43.20, two roommates settled

Finish line

What to deliver

  • Four responsive screens
  • A clear calculation breakdown for one adjusted split

If you want more

Optional extensions

Add recurring split rules
Design a dispute and comment flow

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Color palette
#1B1A1A
#E9C5B7
#716561
#8B8C8A
#8C848C
Font pairing
RalewayLato

Raleway & Lato

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations