Protergia On Mobile App

Onboarding energy customers from 3 weeks to 5 minutes

Protergia On onboarding app — illustrated step screen
Client Protergia
Role UX & Illustration
Company Trebbble
Year 2021
Scope Mobile App

What is Protergia On

Protergia On is an iOS and Android app that lets new energy customers complete their onboarding with Protergia — Greece's largest independent electricity producer — in under five minutes. Users submit documents from their phone, track their application in real time, and manage everything through a single guided interface.

My Role

Visual and Motion Designer within an internal agency team. I was part of the UX strategy process — contributing to how we broke the onboarding journey down into simple, guided steps — and owned the UI design, design system, illustration language, and all motion work.

The Challenge

Energy onboarding had traditionally been slow, paper-heavy, and frustrating. Protergia needed to compete for a younger, mobile-first audience while reducing sign-up abandonment and cutting acquisition costs. The design challenge went beyond function: a utility app risks feeling cold and transactional, which erodes trust exactly when a new user is deciding whether to commit.

The Solution

I designed the full visual experience around clarity and warmth. The onboarding flow guides users step by step through document submission and application tracking, keeping them oriented at every stage. A bespoke illustration system gave the product a human, approachable character, and purposeful animations transformed unavoidable waiting states into moments that communicated progress rather than dead time.

Onboarding step and document scanning screens Wait state animation and progress tracking

Key Contribution

I defined the visual language of Protergia On from scratch — the illustration style, the motion system, and the overall creative direction. What started as an observation that the early product felt sterile became a deliberate strategy: hand-crafted illustrations and meaningful animations that solved real UX problems around waiting states while building emotional connection with new users at a high-stakes moment in the onboarding flow.

My Process

Working as a team, we mapped the onboarding steps and shaped them into a clear, guided flow. My contribution started with flagging early that the product felt lifeless — an observation that became the thread running through everything I designed after.

I built the design system and a custom illustration system in which every illustration was tied to a specific moment in the journey — welcoming, guiding, confirming, reassuring. I then translated that into a suite of animations in After Effects exported via Lottie for native iOS and Android, turning waiting states and micro-interactions into moments that felt intentional rather than incidental.

Tools I Used

Sketch
Illustrator
Procreate
After Effects
Lottie

See other projects