Terzio

vintage and luxury motorcycle helmet brand with modernized presentation.

Sketching & Wireframing

Sketching

This website merges both a store frontpage and all of the other activities of the company. Several designs were thought up for each page, this is an example. How to display a long-established with the modernized tools of today without compromising its identity.

Wireframing

The brand identity had to be kept in mind for the wireframing process, all pages must carry the same ambience and portray the traditional Italian mastercraft. Beauty is in the eye of the beholder, imagery has to be put little forward over text. The fonts were chosen accordingly to stress the trust and respect the brand conveys.

Color palette

The color palette will match both a dark and a light theme if necessary. A brown-themed palette color was chosen because it mostly represent the vintage and luxury aspect (especially when paired with black), a close relationship with the earth and the ground, the stability over the years, the confidence and maturity of a well-established brand.

Palette 1
Our Story
About
Product Page – Description
Product Page Description 1

Designing

UX and UI

The first step in designing something good, is to make it user-friendly. This is achievable by not over-clustering items, CTAs, text, pop-notifications, ads, images, etc, all over the place or in an inconsistent manner. When a user visits a page for the first time, there is a specific pattern for the eye to follow in order to lead and get the proper information.

The free time that the user is willing to share with your company by browsing on your app or website is the most valuable thing to offer, and it should be rewarded accordingly.

Store Page (Mobile)
Store Page Mobile 1
About (Tablet)
About Page Tablet 1

Prototyping: interaction with the user is key

QR Code for Terzio

You can try out a live prototyping of the Terzio site here

Click below or scan this QR-code

Press (Tablet)
Press Page 1 Tablet
Press (Desktop)
Press Page 1
Store Page
Store Page 1
Cart
Cart Page 1

Conclusion

Saying less means more

There are so many ways to make a customer run away at the sight of a store page: being overwhelmed with choices, with notifications, with aggressive Call-to-Actions, too many steps and processes. They all tend stray away from the brand identity and the overall design.

In order for a brand to make its way into the market, they need to find and cuddle their niche. The company does not necessarily needs to always actively promote their products with first-degree messages such as “Buy Me Right Now”.

On the contrary, they need to permanently convey subliminal and inconspicuous messages about their identity and their story, show their customer base that they are beyond a product, they have a solid vision, they are proud of who they are, what they make and what defines them, they care more than the average company about the customer satisfaction and experience and their reputation. In other terms, it’s an humble way of saying the company could not exist without them.

I had quite a bit of fun of working on this project because building an almost complete website from scratches really forces the designer to keep thinking about the user, how many pages does he need to browse, what does he wants, how complex should it be browse information and purchase an item. I firmly believe that less if often better and we don’t want to get the user lost on pointless and irrelevant information. Everytime a user decides to spend his own personal time on your website or your app, it’s the most valuable thing he’s offering you, so, do not waste it.