Olio Carli

ECOMMERCE - UI Design - 2021

A restyling that goes beyond Visual Identity

PROJECT GOAL

Fratelli Carli is a company founded in 1911, leader in the production of Ligurian EVO oil.

A brand that on a visual and communication level does not find between the physical identity (product packaging, shopping experience in emporiums) and the digital one (social, ecommerce site).

The goal of this project is to carry out the restyling of the ecommerce site while maintaining the strategy and structure of the contents in place. Rationalizing the visual, layout styles and recalling the current identity of packaging and emporiums.

01

Research

1.  Desk Research
2.  UI Audit
3.  Competitor analysis
4.  Stakeholders interview

02

Define

1. Site analysis and mapping
2.  Look & feel

03

Ideate

1.  Typography
2.  Color Palette
3.  Icons
4.  Definition boards
5.  Prototype

storia-oliveto_2732x1000
01 . 2 - UI AUDIT

What are the problems facing the current site?

Analyzing and mapping the various modules of the entire site, we encountered problems of various kinds. First layout, as there was often the need to insert contents that unfortunately were not designed for the specifics structures, often creating issues in the various breakpoints.

Another recurring problem was due to the poor contrast of some titles on photographic backgrounds, making the site inaccessible for some users.

UI-AuditCarli
02 . 2 - LOOK & FEEL

A new approach to design

Given the needs of the site, we thought to adopt a new method for redesign. Instead of starting from wireframes, we decided to map all the modules of the whole site by grouping and categorizing them by type and content. In order to understand what all the needs and to have at a glance all those elements that seemed different, but which in reality shared the same style and communication needs.

By solving that heterogeneity problem and making pages more consistent and easier to use.

03 - IDEATE

Refreshing the new digital identity

We were lucky enough to have access to all the archive material that Fratelli Carli had collected over the years, all the photographs and all the advertising and campaign material, from the 1930s to today.

Precious material that has allowed us to trace the points of recognition of the brand and find new applications to digitize and scale it in the various applications.

Macbook-1
screen-5@2x

BIGHERO IN HOMEPAGE

screen-1@2x

EDITORIAL PAGE

03 . 4 - DECLINAZIONE TAVOLE

Optimizing menu navigation

We also proposed to review navigation on the basis of the information architecture, leaving the shop items immediately accessible and hiding the various editorial and history sections within a hamburger. To create two distinct navigation channels and make the shop cleaner and more immediate.

screen-3@2x

HAMBURGER NAV

screen-2@2x

HOMEPAGE EDITORIAL

screen-4@2x

PRODUCT PAGE VIEWPORT

screen-1-m@2x

BIGHERO HOMEPAGE

screen-2-m@2x

PRODUCT PAGE

screen-3-m@2x

STICKY ADD TO CART

🙌

Grazie!