top of page
  • Instagram
  • LinkedIn

O'Donnell Fuels

UX/UI Design, Illustration, Wireframing & Prototyping

O'Donnell Fuels is a fuel company based in Donegal. They required a website to sell fuel products and also a smart effective solution to order fuel easily. The company felt that they were not up to standard in comparison with their competitors.

This was my way to redesign a solution that was easy to use, with fuel to your door at the click of a few buttons. 

odoooo@2x.png

Project Type, Duration & Role

The project was a complete design for a new website as their old one was dated. This included using adobe XD and working alongside content developers in order to come up with a proposed solution prior to development. This took around 3 weeks, start to finish. 

My role in the project was, the product designer. I worked alongside the project lead and also the development team to ensure all assets were exported for them to incorporate.

The Process

For the initial user research, I produced a short questionnaire and sent it out to family, friends, colleagues and also some clients.  This enabled me to gain some information around the ordering of fuel - as I am not familiar with this process and needed to understand the user/customer needs. During the synthesis phase - I was able to participate in affinity mapping with my project manager in order to analyse the pain points and determine what was the main priorities for this redesign and how we should approach them to make fuel ordering easier. 

From this, I moved on to conduct user flows to understand exactly where the users would go to once the landed on the homepage. This enabled me to come up with rough sketches to show how this could be improved through the new design that was proposed. This was then discussed with the wider team and showed how all the fuel ordering process would be plain and simple - exactly what the client wanted. 

Research
Synthesis
Ideate
Prototype
Validate

Research

Initially, I met with the project lead and the client to perform some research on what the end goal of the redesign was, the end target, looking at the traffic in terms of current google analytics and who exactly their target audience is (mainly homeowners). 

We outlined three tasks that users must be able to do whilst using the fuel system. These included:

1. Wanting to check the price in euros or sterling, the amount of fuel by litres. This can also be calculated how many litres you can get for your inputted euros. Not as simple as it sounds!

2. The customer must be able to shop all fuel products such as coal, gas and other fuel starting kits. 

3.The ordering system must flow easily, with each page following at the click of a submit/next button. There must be not field errors or validation messages to fields that are not required. 

Synthesis

After we had the information from our users - the team began to break this down and understand what the main categories were. Users wanted to be drawn to Grofuse, be able to read about services and get in contact easily. Over a video call (damn covid!) we began to card sort on the project managers white board that we could all see.

This enabled us to prioritise the elements within the process and focus on the most important aspects that would have the maximum benefits on the first release of the new website given the short timeline. 

shutterstock_1495593899.jpg

Main Problems

“I want to be able to order oil for my home through my mobile. I am too busy sometimes to phone the store and when I do have a spare minute - you are closed as it is after half 5. ”

- Client

 

Based on the research that we had undertaken as a team and also the card sorting activity, we identified the main problems:

  • Cannot order fuel 24 hours a day 

  • Cannot price fuel without ringing the store 

  • Cannot check if the company deliver to where customer is situated 

  • Currently video backgrounds lagged on users screens 

  • Call us button was not working for Northern area codes

shutterstock_1145838989.jpg

User Persona

To help communicate the information about users that had been derived from the research methods carried out, I created a provisional user persona in order to communicate with the wider team. 

vbhebcdksjxsanxs.jpg

Ideate

I created user flows for steps that a typical users of the Gorufse website goes through in order to complete two common tasks.

  • Order home heating oil easily - no hassle or questions

  • Order coal or gas at the touch of a button, becoming aware of any deals or offers

This then began our thought process as to how we are going to get customers to check their fuel price and order with O'Donnells - if they run into any pain points they will choose competitor websites. This cannot happen!

shutterstock_1767173642.jpg

Low Fidelity Sketches

Based on the established ideas and possible pain points, the project manager asked me to produce multiple options to explore how we can design this new platform. I spent a few hours sketches these on to paper roughly and it really got the process moving and ideas generating. 

High Fidelity Wireframes

Please view the XD document of the wireframes below. This will show you all the designs created by me for the development team before progression. I longed for more time to produce a high fidelity prototype but sadly the project had a short deadline.

shutterstock_482236333.jpg

Validate

After the design had been produced - we sent a prototype to our client and began to look at their interaction with it and how we had successfully completed their intended solution. We asked for some feedback, to which everything we had incorporated was to their standard. 

In conclusion, I think for the short space of time the project ran, the target was reached and all aspects were included within the design. The project is currently still under construction by the development team - to which testing will be performed to ensure any pain points are addressed. 

I found the timeline quite challenging, as I had only around 3 half weeks to gather research, extract it and turn this into a design for the development team. I was open to all criticism and any feedback throughout the process. I would of liked to had the time allocated to make this into a fully functioning prototype, but given the timeline this was not feasable.

bottom of page