Case study · 2025

Battery House

Energy all the time.

Battery House is a companion app for a rechargeable battery pack that uses recycled cells to hold power with a modular in/output design. Owners can route energy in from the grid, solar, wind, or a backup generator — and feed it out to the home as needed. The app gives them a single dashboard to monitor, configure, and balance every input.

Role
UX/UI design · branding
Duration
4 weeks
Year
2025
Read time
5–10 min
Battery House — main screen low-fidelity design

The problem

Homeowners want clean, reliable power — but the market is built for installers, not for them.

I interviewed ten homeowners and built empathy maps to surface the real friction. A primary user group emerged: homeowners aged 30–80 who want to lower utility bills, reduce their carbon footprint, and ride out the disruptive weather that's become routine in places like Texas. They were not battery experts — they were people trying to make a long-term financial and environmental bet without getting fleeced.

What kept coming up was that the existing options either treated them like contractors (technical jargon, no friendly UI) or like marks (greenwashed marketing, hidden costs, lock-in). Nobody was building a calm, honest interface for the homeowner sitting at their kitchen table making the decision.

01

High cost of competition

Most sustainable battery setups are priced out of reach for the average homeowner.

02

Wants to lower the utility bill

The core motivation isn't ideology — it's a household budget that keeps creeping up.

03

Disruptive weather, often

Many users live in remote or storm-prone regions where outages are no longer rare events.

The user

Meet Heath Martin.

A composite persona built from the research — Heath stands in for the user group whose decisions Battery House has to win.

HM
Heath Martin
Age
35
Hometown
El Paso, TX
Family
Wife and three kids
Occupation
Freelance web developer & part-time DIY YouTuber
Education
Bachelor's degree

Goals

  • Reduce household carbon footprint by integrating sustainable tech that aligns with a greener lifestyle.
  • Find an affordable, eco-friendly battery solution that doesn't require a contractor visit.
  • Keep the lights on through summer storms without paying for a luxury Powerwall.

Frustrations

  • High cost of sustainable tech — most options are priced out of reach for an average homeowner.
  • Greenwashing in the market — marketing claims that don't survive a five-minute spec sheet.
  • Setup complexity — apps that assume an installer is doing the configuring.
Nobody was building a calm, honest interface for the homeowner sitting at their kitchen table making the decision.

The insight that anchored every design choice

The process · 01

Started on paper.

I sketched every screen by hand first to keep the focus on flow rather than aesthetics. The core question was: how does someone toggle between four input sources and see what's happening at a glance? Paper let me run through the four power-source pages without getting precious about layout. The answer that survived to digital was a single dashboard with a source switcher and a live readout, rather than a separate top-level page per source.

Paper wireframe of the main screen
Main screen
Paper wireframe of the grid recycle screen
Grid power
Paper wireframe of the solar power screen
Solar power
Paper wireframe of the wind power screen
Wind power
Paper wireframe of the generator backup screen
Generator backup
Detailed paper wireframe of the main dashboard
Detailed main-dashboard exploration

The process · 02

Translated to digital.

With the flow locked in on paper, I moved to digital wireframes to commit to a layout grid and start spacing decisions. Each input source got its own page off the main dashboard — but with a consistent template so the user only learns the pattern once.

Main dashboard digital wireframe
Main dashboard
Home power digital wireframe
Grid power
Solar power digital wireframe
Solar power
Wind power digital wireframe
Wind power
Diesel generator digital wireframe
Generator backup

Low-fidelity prototype

Each input source got its own page.

Once the dashboard pattern locked in, I built out a low-fi prototype with a dedicated screen for each of the four power sources — grid, solar, wind, and generator — plus the main hub. Each source page surfaces the same three things: current input level, contribution to the battery, and a tap to prioritise that source.

Main screen low-fidelity
Main hub
Home power low-fidelity
Grid power
Solar power low-fidelity
Solar power
Wind power low-fidelity
Wind power
Diesel generator low-fidelity
Generator backup

Try it

Interactive prototype.

The live Figma prototype lets you tap through the four power-source flows and the main hub. Opens in a new tab — no login required.

Open the live prototype

Four power sources · one source-switcher hub · the full lo-fi flow.

View the live mockup ↗

Reflection

What worked, what I'd do differently.

What worked

Keeping the four power sources on a single dashboard rather than splitting them into separate top-level pages. The user research clearly showed people want to see everything at once — the moment they have to click between sources to compare them, the dashboard fails its primary job. The hub + drill-down pattern resolved this.

What I'd revisit

The persona was tight on goals and frustrations but light on behavioural context — what time of day Heath actually checks the app, whether he's a glance-and-go user or a tinkerer. A second round of contextual interviews would have sharpened the priority of dashboard elements and helped tune the notification model, which is still un-resolved.

Next case study

Back to work →