Ember AI Agent: designing a Key Interface to interact with Energy Data

# Agentic AI

# Energy Management

# B2B Saas

{ecoplanet}

{Energy Management}

With the Ecoplanet platform, small-and medium-sized businesses (SMBs) can make informed decisions to optimize their energy consumption and enhance cost efficiency.

ecoplanet

[ Collaborative Goal]

When I've joined the ecoplanet team, the major goal was to design from scratch and smoothly integrate an AI Agent into the Energy Management platform, to improve platform UX/UI, to enhance the product with new features, and establish an efficient design-to-dev process

[ Problem ]

How might we turn complex Energy Data management into a smooth and efficient process with the help of AI?

[ Deliverables ]

Ember AI Agent 0-1 design + Brand Identity, Analytics Hub 0-1 design: ready-for-dev mockups, dev handover docs, Figma components & styleguide. Platform UX/UI enhancements.

[ Project Duration & Timeline ]

Founded: July 2022 →
Our Collaboration: November 2023 - May 2024 (6 months)→
🚀 🚀🚀 Series A: January 2025

[ Outcomes ]

“Ember AI now a key interface for users to interact with energy data and insights. It’s becoming a core layer in how people navigate and understand our product.”

Thomas Pokorny,
Head of Engineering @ecoplanet

Scope & My Role

I've led & executed the design of the Ember AI Agent, Analytics Hub feature and made IA & UX/UI improvements to the existing Energy management platform.

Ember AI Agent

Ember AI is an AI-powered conversational interface built on top of the existing Energy Management platform.

Why we’ve built it

It was late 2023, when AI Agents just started to appear. Our goal was to design an AI agent that can be smoothly integrated into the existing SaaS ecosystem. It should help users to interact with energy data , make suggestions based on their needs, and help to make smarter decisions without digging into dashboards manually.

What we’ve built

[ Agent Interaction Layer]

We ended up with a conversational interface that helps users to get Energy Insights, does complex Analysis Setup , interacts with data, builds data visualizations, provides actionable recommendations and navigates the user through the platform.

[ Main Design Decisions ]

- From the very beginning I've considered Ember AI as ''Product inside the Product'' from the very beginning and not as an Ecoplanet platform feature
- we've introduced the Insights Tab
- we've included Live data widgets in the conversation and an option to interact with them

[ Main Challenges and Solutions to them ]

- Lack of trust in AI Agents, especially among non-digital-native users →
We've tried to solve with an explicit onboarding process to Ember AI
- Lack of data on conversational scenarios in B2B software context Solutions →
We've been continiously running user interviews and user testing to better understand how and why users are using Ember AI

[ Main Learnings ]

Even though LLMs are a relatively new technology and are still evolving I I believe the next SaaS UX Era is already here! Soon, AI agents should handle most user interactions, making complex B2B software smarter and more intuitive

{Head of Engineering @ecoplanet}

Thomas Pokorny

“ Ember AI now a key interface for users to interact with energy data and insights. It’s becoming a core layer in how people navigate and understand our product”

How we’ve built it

[ step 1 ]

Discovery phase

We started with understanding the landscape of conversational AI Agents and copilots and how they can be integrated into the complex B2B online services.

[ step 2 ]

Strategic Design

Once identified the best practices on the market and how Ember AI can potentially empower ecoplanet users, together with stakeholders, I’ve worked on the main value proposition and usage scenarios.

[ step 3 ]

Ember AI Brand Identity

After the strategic and UX/UI design phases, my task was to come up with the Ember AI brand Identity. From the very beginning, I've considered Ember AI as a ''product inside the product'' rather than a separate feature of the Ecoplanet platform. Therefore, my main goal was to establish a unique brand identity that is also well-integrated into the existing Ecoplanet brand guidelines.

[ step 4 ]

UX/UI Design

Here, I transformed user flows based on the defined JTBD and transformed them into hi-fidelity mockups. Additionally, developed a UI Styleguide and Components library to integrate Ember AI smoothly into the existing Ecoplanet platform.

[ step 5 ]

Design QA, User Testing and Optimization

We went through multiple iterations with front-end developers, and user testing before shipping to the public. After public release, we continued to collect feedback from our users and improve Ember AI User experience.

{CTO @ecoplanet}

Javier Silva Oritz

“ Anna has achieved a masterful blend between Innovation, Product, and UI/UX Design. She carries herself with high professionalism and has outstanding work ethics. We worked together when she was part of ecoplanet as a Product Designer and I really enjoyed our mutual collaboration in the workspace building our next-gen Energy Management System....”

How we’ve built it

{Heading title}