Admiral Fuel Calculator

Calculating the price of fuel changes

ui & ux design | app development

Admiral calculator displayed on an iPad.
Owning a car is expensive - anyone that drives knows that

If the cost of fuel increased by 7p, would you know how much more it would cost you monthly? Nope, we wouldn’t either, and neither did any of Admiral’s customers. Admiral asked us to build a tool so users know how much more they need to shell (geddit?) outas the costs at the pumps change.

Have a similar challenge?
Calculating the costs

We linked the tool to a huge database of european cars, this database knew the urban and suburban miles-per-gallon figures of each model. By writing a clever bit of code that worked out the average MPG, the user simply selects their make and model and adjusts the price difference and milage per month. From this, the calculator figures out the monthly price difference. Neat.

Did you know that if Super Unleaded increased by 7p it would cost the Big Lemon Ferrari fleet (which totally exists - they’re all yellow) £67.54 a month more. Ouch!

Have a similar challenge?
Consistency is King.

Ensuring your identity is cohesive across all platforms is an imperative principle of user experience design.

Luckily for us, we’re experienced in designing and building components to fit within a current component hierarchy and adhere to strict brand guidelines, the Admiral tool design was no different. We understand that new tools, pages, bots, and components have to fit into much larger design systems.

One wrong hex, font kern, or radius would stand out like a sore thumb.

Creating digital solutions for a household name like Admiral has been a pleasure, we’re really proud of what we’ve built and we’re looking forward to the next challenge.