IoT Smart Home System

Energy Management

Redesigning a solar-powered smart home monitoring experience

B2C • Energy / IoT / Smart Home

Product Type & Domain

3 Months

Timeline

Web App • React

Platform

Web App Screens

Context

This project involved the redesign of an existing B2C energy management application used by homeowners with installed solar systems and connected smart devices.

The product allows users to monitor:

  • Solar production

  • Energy consumption

  • Grid import/export

  • Battery levels

  • EV charging

  • Connected home devices

The application was already live, but the experience had become outdated and visually fragmented. The goal was to modernize the interface and improve clarity without disrupting existing system logic.

I worked on a full UX/UI redesign of the platform.

The Problem

Energy management systems are inherently complex. They combine:

  • Real-time data

  • Multiple energy sources (solar, grid, battery)

  • Connected devices

  • Performance analytics

  • Environmental conditions

The original solution struggled with:

  • Overloaded dashboards

  • Low visual hierarchy

  • Technical presentation of data

  • Poor contextual understanding of energy flow

  • Limited differentiation between system states

Users could see numbers — but not the story behind them.

The key challenge was not adding features, but making energy data intuitive and actionable for homeowners.

My Role

I worked as the Senior Product Designer responsible for:

  • UX strategy for the redesign

  • Information architecture restructuring

  • Redesigning the main system overview

  • Designing dual viewing modes (Visual vs Schematic)

  • Creating the analytics dashboard experience

  • Refining status indicators and system health logic

  • Improving visual hierarchy and data readability

The goal was to modernize the interface while preserving system reliability and clarity.

Core Design Challenge

The most complex challenge was:

How to present a full energy ecosystem without overwhelming the user.

The system includes:

  • Solar panels

  • Battery storage

  • Grid interaction

  • EV charging

  • Smart devices

  • Environmental data

  • Real-time production metrics

Instead of forcing users to navigate multiple screens, the redesign focused on layered visibility.

  1. Dual Overview Modes

Visual Mode (3D System View)

A realistic house visualization displaying:

  • Live solar production

  • Battery status

  • Grid import/export

  • Device consumption

  • EV charging state

This mode improves emotional engagement and makes the system feel tangible.

Schematic Mode

A simplified system diagram showing:

  • Energy flow logic

  • Connected components

  • System state relationships

  • Charging and consumption statuses

This mode supports users who prefer clarity over visual storytelling.

  1. System Health & Contextual Status

A dedicated health summary panel consolidates:

  • Production state

  • Device connectivity

  • Charging states

  • Error conditions

Instead of isolated alerts, the redesign groups status into meaningful categories.

  1. Analytics Dashboard

The analytics section was redesigned to:

  • Surface key performance metrics

  • Provide timeframe controls (daily, weekly, monthly)

  • Highlight production vs consumption trends

  • Show export/import efficiency

  • Improve chart readability and visual consistency

The focus was on clarity over decoration.

abstract jellyfish

Outcome

The redesigned product is live and actively used by homeowners.

The redesign:

  • Improved visual hierarchy

  • Reduced cognitive overload

  • Increased clarity in system status understanding

  • Created a more modern and trustworthy experience

  • Unified previously fragmented UI components

The project strengthened the overall usability of a data-heavy, real-time energy application.

What I Learned

Designing for energy systems reinforced how critical data prioritization and contextual clarity are in consumer-facing IoT products.

Users don’t want more numbers — they want confidence.

Balancing emotional visual engagement (3D view) with technical transparency (schematic mode) became a key design principle in this project.

Next Projects

Explore more of my work