Vauban: Sophistication With Style
How we built a website for fintech London-based product Vauban that got featured on Behance front page
Vauban came to us for a redesign. They’ve had a perfectly fine, working website. It’s always a challenge to work with something already in place: we had to do one better, way better. We ended up doing complete redesign of not just their website, but also their whole corporate style. The project took less than a month: four sprints, five workdays each. And the final result we built ended up on the front page of Behance.
Now you’ll see the website that they came with, and then what we did.
About The Product: A Stylish Container
Vauban, not to be confused with the seventeenth century French military engineer, is a wealth container platform. By wealth container we mean asset-holding entity: Funds, SPVs, REIT, Syndicates, SPEs, Trusts and Holdings. All these things are complicated and expensive to set up and maintain, and Vauban provides a simple software-based solution. You can learn more about Vauban here.
The audience for this website is investors. All too serious people dealing with a serious matter. With this audience in mind, we had a series of limitations: we couldn’t do complex 3D animations, we couldn’t do some in-your-face brutalism, we couldn’t do anything screaming or obvious. We had to do something reserved, but that shows a great deal of class.
How We Picked A Concept: Blueprints, Magazines, Typography
All the concepts we did revolved around the metaphor that Vauban already uses to describe what they do, the metaphor of the container.
Blueprints. For our serious audience we had considered illustrating this abstract container in a literal way. Using transparent illustrations with some isometrics, correct shapes, straight lines. It showed engineering approach to the problem at hand.
Finance magazines. We considered our demo again. What else present itself to this audience with style but without being overbearing? Finance magazines. Straight laced white background. Elegant serifs for that respectful feeling. Bright illustrations for the accents.
Swiss Typography. It’s sleek and it’s modern. It’s timelessly stylish. Accents are mostly on text and typography.
Finalizing The Style: Fitting The Ideas Into Container
But all the concepts lacked something.
What we did then is took some elements out of Blueprints and Swiss Typography and bridged them together. We managed to put everything together using grids.
That was, stylistically, a bold choice, yet a bold choice that kept with the serious tone we were aiming for, as well as adding a feeling of exclusivity. We work with grids a lot, but for this project it needed to be something special. We’re not too prideful, so we brought in the foremost Russian specialist on grids. The insights we got helped use to not use some stock grid, but do something personalized and special.
For fonts we used Euclid Circular A and Inter. With these straightforward sans that evoke both contemporary design and timelessness, and with the admixture of our grid use, the final result links back to Swiss Typography. But with the caveat of our chosen colors.
The color scheme we chose, of dark tones with orange accents, manages to be both serious and bold. And with the straight lines it even unwittingly brings on associations with classic suits.
Our Personal Touch: Mower, 1930
We had to do a lot of illustrations for this website. But our personal touch came to the illustration for SPVs for Art, Sports, Entertainment. A single purpose vehicle that’s often used to buy paintings, the right idea is to show it with a painting. But classic paintings have an insurmountable amount of detail, and would stick out like a sore thumb in our chosen style. Something ultra-contemporary just wouldn’t be recognizable.
During the quarantine, our illustrator was passing the time with the massive puzzle of Mower by Kazimir Malevich. That’s where the idea came from. Rémy Astié, co-founder of Vauban, was originally apprehensive, but having more than passing interest in Russian culture (the username on the website prototype was Raskolnikov), let us give it a try. And now they’re using that mower with a little suitcase on their LinkedIn page.
What would Marquis de Vauban himself say about our design? Probably something in French. We don’t speak French, but what we can say is: the design we did ended up on the front page of Behance. In less than a month we didn’t just rebuilt the website with ten pages, but did a complete redesign, up to the color scheme and the logo.
Don't be a stranger
Subscribe and never miss a story