top of page

24-hour hackathon challenge: a collaboration with software engineers, data scientists, and UX designers

Octopus energy icon logo

Participating in the Octopus Energy Hackathon, a 24-hour burst of creativity and organized chaos, I led a dynamic team tasked with a crucial challenge: encouraging customers to embrace cheap green energy and reduce reliance on expensive fossil fuels.

My Role

Team Lead, UX | UI Designer

Results

MVP, IOS

Client Presentation

The Challenge

Empowering sustainable choices with Octopus Home Mini

 

Octopus Energy, a global leader in green energy supply, is dedicated to shaping an affordable, sustainable energy future. Catering to over 5.3 million customers across 14 countries, they focus on maximizing the use of renewable energy. The Octopus Home Mini plays a pivotal role in this vision, enabling customers to monitor their real-time energy usage and costs.

Faced with the dual challenges of climate change and high energy costs, Octopus Energy presented us with a pivotal question:

"How might we encourage customers to make the most of abundant cheap green energy and avoid using expensive fossil fuels?"

Our Digital Solution

Octozone: Optimal Timing for Smarter Energy Use

 

Our hackathon innovation, 'Octozone', guides users to the best times for energy use, enhancing efficiency and environmental benefits. Octozone alerts users about these optimal times, making it easier to plan energy-heavy activities when green energy is most available.

 

Complementing this, 'Coral Points' rewards energy use in these optimal periods, gamifying conservation with coral reef growth visuals. Together, they make energy usage not only smarter but also rewarding and impactful for the environment.

Click anywhere on the below screen to interact with the latest prototype 

Introducing Team 'Ink'

 

We were a dynamic group of three engineers, one data scientist, and three UX designers each bringing a unique skill set and perspective to the table.

Hackathon team with their pictures and names
Kick-off

Laying the groundwork:

Grasping the renewable energy scene

 

Our journey began with a collective deep dive into understanding the challenge at hand. We initiated our collaboration by aligning our understanding of renewable energy and user behaviors associated with it.

 

This involved a focused 20-minute session of desktop research, exploring the context of renewable energy and examining the current functionalities of the Octopus Mini app.

​

We adapted agile methodology during the hackathon to efficiently use our time and set milestones. While UX designers dived into secondary research, our data scientist started to analyze datasets to identify the market trends, define our consumer base and find patterns and opportunities. 

Team working hard during hackathon

Key insights from secondary research

 

Through our research and brainstorming, we identified critical aspects that shaped our approach:

 # Consumer Awareness 

 

Consumers want to understand their individual carbon footprint and take action accordingly.

 # Smart Energy Usage 

 

Consumers need clearer indicators informing them when they're using energy during periods that are both environmentally sustainable and cost-effective.

 # Actionable Advice 

 

The Octopus Mini app provides real-time data but lacks actionable recommendations on reducing carbon footprint and use more green energy when it is abundant.

 # Diverse Motivations 

 

A mix of environmental and cost-saving factors driving user behaviour, with many motivated by both.

Redefining the problem statement

 

Following our initial discussions and findings, we refined our understanding of the problem space. This led us to the question that would guide our project:

"How might we incentivise users to make environmentally impactful energy decisions while saving money by using Octopus Home Mini?"

This question became the cornerstone of our design challenge, focusing our efforts on creating solutions that not only promote sustainable energy use but also offer financial benefits to the users.

Crafting persona Tom: Data-driven insights

for young, eco-conscious users

 

Our journey to creating a persona began with insights from our data scientist and secondary research, revealing that younger generations are more inclined to adopt sustainable energy practices. Utilizing AI tools and these insights, we crafted a persona to guide our design process.

Table of people willing to make changes

Table 1: Willing to make changes

Initially, the concept of a persona was unfamiliar to our data scientists and developers. I took the opportunity to explain its significance, emphasizing the importance of user-centered design. This approach led our team to consistently consider our user, Tom, in every aspect of the hackathon, from ideation to client presentation.

Table of people concerned about climate change

Table 2: Concerned about climate change

User persona

Identifying design opportunities: Smart energy scheduling and gamified impact visualization

 

As a result of our research and  long discussions with the team, we identified two significant opportunities:

 # Informing Optimal Energy Usage 

 

We saw a need for a feature that informs users like Tom about the best times to use energy, balancing both environmental impact and cost-effectiveness. This solution would help users make more informed decisions about their energy consumption.

 # Gamification of Impact and Savings 

 

Another opportunity lies in presenting users' real-time environmental impact and financial savings in an engaging, gamified manner. This approach aims to make energy management not only informative but also enjoyable, encouraging users to actively participate in sustainable practices.

Sketching key screens: Showcasing best time slots, alarm settings, and gamified Coral Points rewards

 

Following the identification of key design opportunities, our UX team transitioned to sketching low-fidelity wireframes. We promptly shared these sketches with our development team, aligning our visions and setting a deadline to advance to mid-fidelity wireframes by 10 pm. Meanwhile, the developers were actively setting up Github and preparing the necessary code structures. 

Low fi sketches

Visual design: Aligning with Octopus Energy's brand

 

In our approach to visual design, we first gathered UI inspiration through a quick research phase. Adhering to the limited brand guidelines supplied by Octopus Energy was crucial to maintain visual coherence and reflect the brand's values.

Brand guideline supplied by Octopus Energy

Octopus brand guidelines
UI inspiration

UI inspiration board

Delivery of our final design 

 

In our project's final phase, the UX and development teams collaborated closely under time constraints. As we polished the UI and prepped for the presentation, our developers focused on code refinement and testing. We used Figma for seamless asset handover and Zeplin where necessary, maintaining constant communication. The feature's name, "Octozone," was brilliantly proposed by our data scientist Jeremy, capturing the essence of our energy usage reminder concept. 

Technologies like JSX, CSS (Sass), JavaScript, and React.js, along with a collaborative workflow using git, were instrumental in bringing 'Octozone' to life.

octopus mini app home screen
Screen of Best time slots for energy usage

Octozone

 

Octozone is the best period of time in a day to use energy for boosting the positive environmental impact and lower costs for you.
 

Alarm setting for Octozone

Set alarms and schedule energy-intensive tasks, such as running the washing machine or recharging electric vehicles, during the most efficient times.

SET ALARM-ACTIVITY SELECTED.png
ALARM CONFIRMATION MODAL.png
HOMESCREEN SCROLL DOWN.png
CORALS.png

Coral points and total savings

 

Earn rewards as you save money and the planet. Every eco-friendly action you take not only contributes to your Coral Points but also reflects in your monetary savings. 

Presenting our solution

For our client presentation, I guided our team in creating a clear, engaging presentation. I assisted our data scientist in making complex graphs understandable and ensured everyone was ready with their parts.

 

Despite not having time to rehearse, our focus remained on highlighting our user-centered approach, often referencing our persona, Tom, to demonstrate our solution's real-world impact.

Photo from Client presentation

"Overall, this team did really well, I was a big fan of their solution and was well implemented. I liked the screen that showed the savings as well."

Next Steps

 # User Testing 

 

Our immediate priority is to conduct user testing with real users. This step is crucial to validate our design decisions and ensure that our solution meets user needs effectively.

 # Integration with Smart Home Devices

 

We plan to connect smart home devices to the Octopus Home Mini, allowing users to schedule their devices' operation during optimal energy periods.

 # Monitoring the impact

We would establish metrics to track Octozone usage and adherence, providing insights into user engagement and guiding improvements for enhanced sustainability impact.

Key learnings

This experience taught me the value of swift, effective teamwork in a cross-disciplinary, time-pressed sprint. Key takeaways include:

​

  • Effective Cross-Disciplinary Collaboration:  We gained a deeper appreciation and understanding of different disciplines, learning to manage conflicts more effectively.

​

  • Crucial Role of Clear Communication:  Overcoming misunderstandings among team members reinforced the importance of clarity in communication.

​

  • Time Management Skills: The tight timeline underscored the importance of efficient time management, ensuring that every moment was optimally utilised.

​​

  • Presentation Impact: The need for a well-rehearsed and content-rich presentation was clear.

Next case study 

Copyright © 2023 Tugba Cetinkol | Powered by Tugba Cetinkol

Let's connect!

  • LinkedIn
bottom of page