ROLE
Research, UI Design, Prototyping & Testing, Interactions, Information Architecture, Marketing, creating Design System, Co-ordinating with Developers and PMs
ABOUT COMPANY
Greenely is a mobile application that helps users to track their energy consumption and reduce their carbon footprint. The app is designed to be easy to use, informative, and personalized. The primary goal of the app is to help users reduce their energy consumption and save money on their energy bills.
BACKGROUND
In 2019, I embarked on an exciting journey as a part-time Product Designer at Greenely, a groundbreaking and environmentally conscious tech company. As fate would have it, I found myself stepping into a unique role, being the sole Product Designer at the company. Little did I know that this experience would not only refine my design skills but also offer me an exceptional opportunity to make a significant impact on a product focused on sustainability and energy efficiency.
My time at Greenely was not just about professional growth; it was a journey of learning, adaptability, and resilience. Being the sole Product Designer meant taking on numerous challenges and wearing multiple hats, but it also provided me with unparalleled learning opportunities. My experiences shaped not only the app’s design but also my own design philosophy and approach.
Shoutout to Pierre Fossto & Joakim Grönvall and ofc Jo! Some of the best leaders i ever worked with❤
To comply with my non-disclosure agreement for Greenely, I have omitted and obfuscated certain visuals and written informations which is confidential within this case study.
WHERE TO START?
Well, during my time working at Greenely, we worked on a lot of projects, a lot of ideas, a lot of features, some got shipped, some stayed in the exploration page in Figma, but whati loved when working at Greenely, was how easy it was to talk with our users, we had a facebook group with more than +2,000 members, and we used to have cases where people just start knocking the door in the office, and they would complain about something or ask for a feature, funny right? LOL
But what i will cover on this case study is how we went from a bad architecture to an app which has more than 20 integration, fully customizable and users simply LOVE IT!
Here are some of my achievments at Greenely:
- Turned complex ideas into usable features & products.
- Added more than 15 integrations in an organized fashion.
- Implemented a design process.
- Improved usability across the app.
- Established a Design system.
APPROACHING THE PROBLEM
1. DISCOVERING
Before Greenely even hired a product design team, an app existed based on blue-sky concepts which PMs used to create as wireframes. prototypes were created without any testing, and the main app architecture didn’t enable them to scale.
So we had to set couple of workshops & meetings to discuss what we want to achieve and what are the pain points which our users are facing, how we can find them, along setting priorities based on the business goals, we also made sure to implement mixpanel through our app, so we can start collecting data & metrics for each specific event & click.
Here is how the app used to look like along it’s architecture:
And here are some questions & problems which appeared along the journey, either from us or users who are super active in the Greenely facebook group, or through the weekly meetings we had with random users.
2. DEFINING PAIN POINTS
- Users had no idea what’s going on and by when, they always had to enter the app, and still there was no notification center or feed, they would try to figure out by themselves through data the problems.
- Users had to use greenely with 1–2 different apps, as it had almost no integrations which connects with their electricity usage.
Hard to add new devices and to access my added devices - Hard to distinguish Electricity prices and when it’s going up or down, when to use it
- Settings? A mix of personal informations with my house informations.
- No way to add another house, my summer house?
- Can’t schedule & automate my charging..
- Have no idea how am i doing compared to the rest… Am I good? Or bad?
- How can we nudge people to save more energy? Through different features & integrations
- How can we solve problems based on Data and the user behaviors?
- Users kept referring other competitors as they basically have more integrations & more functionalities.
3. PROBLEM STATEMENT
The challenge lies in helping users effortlessly monitor their energy use, receive tailored suggestions, be able to easily link & integrate their energy devices, and build a community focused on greener living.
DEFINING & IDEATING
1. DISCOVERING
The main problems we had were fixing the architecture, the onboarding experience and seeing how we can have a scalable system which supports different Integrations ( Ev Smart charging, Smart Heating, Solar, and much more… )
So let’s start with the Main Architecture, we had couple of workshops, where we brought every element we have on the app and we will have in the future, and started grouping those into similar categories, which gave us the following buckets:
Next thing was defining what our users are really interested about, and that was through the data we had, talking with couple of users to see what interest them most about Greenely, where do they spend most their time. Here are some of the highlights:
Gatherting those insights from users made our road very clear, which allowed us to move forward with ideations & explorations, where we had different workshops with stackholders to make sure we’re moving in the same path.
2. USER FLOW
After collecting both qualitative and quantitative insights from our mappings, we moved on to creating user flows. These flows were built upon the information gathered earlier and took into account various scenarios and situations users could encounter while using the Greenely app.
3. SKETCHING & BRAINSTORMING
In the process of crafting a user-centered and impactful user experience (UX) for the Greenely app, the phase of wireframing and ideation emerged as a pivotal juncture. This stage marked the transition from conceptualizing the app’s functionality and structure to visualizing the actual user interface.
PROTOTYPING
1. USER INTERFACE
In shaping the Greenely app’s design, I harnessed the versatility of card-based elements. This approach ensured that as the app expanded, each piece of content could seamlessly integrate while maintaining an organized layout. Beyond flexibility, this design choice added visual appeal, accommodating various content types harmoniously. The card-based architecture not only celebrated the app’s growth but also stood as a commitment to an adaptable, user-centered future.
Here are some before & after with Improvements made:
2. DESIGN SYSTEM
By creating a design system for the Greenely app, we established a consistent visual language that permeated every corner of the interface. This ensured that every user interaction, from buttons to typography, adhered to a unified style. This level of consistency not only reinforces the app’s brand identity but also enhances user recognition and trust, making the Greenely experience instantly recognizable and memorable.
3. PROTOTYPE
You can download the app directly on Apple or Google, to test the app and play around with it.
https://apps.apple.com/gb/developer/greenely/id968167052
https://play.google.com/store/apps/details?id=greenely.greenely&hl=en&gl=US
RESULTS:
- +80% Retention Rate, users check the app now 5–10 times a week, as there is more engagement, more important metrics and everything is in a single app rather than 2–3.
- +100k Householders, jumping from less than 20k to more than 100k in less than 2 years.
- +70% more Devices Added compared to same period previous year.
LEARNINGS & TAKEAWAYS
- Empathy Drives Innovation
Designing for a sustainable future means empathizing with users’ aspirations to make a positive impact. This empathy became a driving force behind creating features that inspired meaningful behavior change.
- Simplicity Enhances Engagement
Striving for simplicity isn’t just about aesthetics; it’s about user engagement. Distilling complex data into easily digestible insights not only improves usability but also fosters a more enjoyable user experience.
- Collaboration Breeds Excellence
Collaborating with diverse team members enriched the design process. Learning from developers, understanding business priorities from Product Managers, and aligning design decisions with the product’s vision led to a holistic and successful product.
GOLD MOMENTS
One of the coolest moment in Greenely, was seeing my designs on billboards all over Sweden!
Working at Greenely taught me that sustainable design isn’t just about energy efficiency; it’s about creating tools that empower users to make informed choices for a greener world.
