Digital DNA + Design System

Spearheaded visual DNA definition and execution across all Sync4/4A Ford programs most of which are on the road today. This DNA later cascaded to the web and app. Objectives: 1 - Gain software efficiencies from a scalable system of design. 2 - Ensure global showroom consistency. 3 - Build a stronger connection to the customer and equity in the brand. The original premise was to design a UI that looked and felt human, thus the initial conception had a lot of cues to tactile touches of physical elements. Button states had visual feedback of being "pressed in" to the surface. This became the visual trademark. However, it was important not to create skeuomorphic deign, rather bring together the best of both worlds (flat UI and tactile 3D), and eliminate the excess. Neumorphism, as it's coined now was arguably originated from the designs executions first seen in production on the Mach-E utilizing the "Smart Surface design language".

Understanding and crafting how light and shadow propagate across various button shapes and surfaces required building the 3D geometry to understand these minute details.

Caustic illumination from the taillights show the level of detail was aimed to achieve on 3D elements within the UI

Each UI element, from buttons to sliders to toggles was crafted first in 3D, then PSD, then CSS.

Components measured down to each pixel and fitting within a structural grid

Five design principles, each setting forth parameters to which UI design teams used to create compelling experiences.

All of the UI components used to create vast selection of individual hero screens

Global showroom consistency with clusters and centerstacks using the same design language

From top left to bottom right: Mustang Mach-E, Ford Ranger, Bronco and F150 are just few of the many programs that have adopted the "smart surface" design language on the road today

You may also like