Capflex is a specialised finance firm that needed a digital presence to match its high-level service. The goal was to move away from the traditional finance sites and create an immersive, high-end experience that feels both modern and trustworthy.
The Challenge
The finance calculator, the hurdle, the misfit—it feels like it doesn't belong. I was essentially told to leave a hole in the design for a third-party plugin that we had no control over. Since I couldn't touch the styling or the way the tool looked, I focused on making the rest of the UI as strong and immersive as possible.
I wanted the rest of the site to feel premium, this way the calculator wouldn't drag down the overall experience.
By letting bold typography and high-impact imagery do the heavy lifting, the UI explains the brand at a glance rather than burying the user in huge blocks of text.
Project Goals
Break the mold of boring finance websites with a bold, immersive UI.
Use motion and high-impact typography to hook the user as soon as the page loads.
Clearly communicate Capflex's expertise without overwhelming the user.
Incorporate necessary third-party tools while maintaining a premium aesthetic.
System Logic
Primary - Light Backgrounds
Button Name
Hover
Button Name
Primary - Dark Backgrounds
Button Name
Hover
Button Name
Secondary - Light Backgrounds
Button Name
Hover
Button Name
Secondary - Dark Backgrounds
Button Name
Hover
Button Name
Colour Palette
Role: Hero colour taken from logo, used for primary CTAs, accents and copy highlights or headings
Role: Secondary colour from logo, used for button text, headings, body copy and backgrounds
Role: Used for secondary CTAs, navigation items and body copy on forest green backgrounds
White #ffffff
Role: Used as text highlight in hero banner and logo text colour on dark backgrounds
Large Banner Text
H1
H2
Large Copy
We support businesses with smart, scalable finance for the tools that keep them moving. Whether it’s a single commercial vehicle or a comprehensive fleet of machinery, our solutions are designed to support growth, preserve cash flow, and simplify asset acquisition.
Body Copy
We support businesses with smart, scalable finance for the tools that keep them moving. Whether it’s a single commercial vehicle or a comprehensive fleet of machinery, our solutions are designed to support growth, preserve cash flow, and simplify asset acquisition.
Showcase
Key Takeaways
Design as a Buffer
I was pretty disappointed when I saw the UI for the calculator; it's a shame it doesn't look like it belongs, but that was completely out of my control. However, I feel the surrounding UI is strong enough that it carries the third-party plugin and keeps the brand feel intact.
Less is More
Stripping back the heavy text blocks and letting bold typography do the heavy lifting worked.
Motion with Purpose
The animated hero isn’t just for show. It sets the tone the second the page loads, which is the exact opposite of what people expect from a traditional finance site.
Current Status
Live Website
