Navy Blue logo

Navy Blue

Interactive Design Direction.

I had the chance to lead the Interactive Design of a recently created brand. Thanks to amazing team behind it, we were able to craft a unique site that served as the best medium to showcase its products.

Go to the live site

Homepage: the first approach.

Design elements.


Adobe Caslon Pro gave Navy Blue an elegant, classy feeling coupled with the brand's identity.

Example of typography on Navy Blue


Cards were used to engage useful links such as product catalogues, blog posts, and other similar actions.

Card example
Card example
Card example
User interactions.

We sped up the process of seeing products by creating a natural, fast interaction. As a result, the users are able to see the products without the need to open a page for each one of them.

So, basically we went from this:

Classic way to show a product.

Average time per product: 15s

To this:

MOdern way to show a product.

Average time per product: 8s

But enough with the details! Here is the final result:

(Made with Principle for Mac)

Navy Blue screenshot - Homepage Design
Navy Blue screenshot - Collections page
Navy Blue screenshot - Dealers page

Behind the scenes.

Collage of pictures taken during the making of Navy Blue's website.

The amazing people behind this project.

Great projects are made by great teams. These are the people who made this possible as much as I did.

José Javier Mardlin

Art Direction

Juan Antonio Madueño

Web Development

Martina D'Ercoli