Completed in 2016Detroit, Mi.Art Direction & Product Design
for
from
Ford Motor Co.
Zoom In
Zoom In
2016
Detroit, Mi.
from 2016
— an American Car Maker —
SPEED
QUALITY
PRICE
I worked closely with Team Detroit (now GTB) for six months, tasked with reshaping the incentives section to align with the evolving overhaul of the website.
My role(s) on this project included: Art Director and Designer.
Art Direction & Product Design Solutions for an American Car Maker
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com*
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com*
Incentives & Offers on Ford.com*
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com
Incentives & Offers on Ford.com*
Tap anywhere to enlarge the work
Behind the Work
I'm an Art Director and Designer living in Santa Monica. To learn more about me and my process, click here.
Detroit, Mi.— I worked closely with Team Detroit (now GTB) for six months, tasked with reshaping the incentives section to align with the evolving overhaul of the website.
My role(s) on this project included: Art Director and Designer.
What are offers?
This section of the website allows shoppers to customize offers to fit their situations that incentivize them to make the purchase. It’s considered the last page a prospective buyer visits before they pull the trigger, and clarity is persuasive.
Behind the scenes, the algorithm is taking into account many legal requirements which vary from region to region, resulting in savings within the context of something we can all understand: a reduced monthly payment.
The Evolution of Model Detail
Try swiping left and right to navigate.
Hint: Expand the slideshow to show captions.
Tap to load
1
2
3
4
5
6
7
8
9
10
No.001
An initial version
No.002
Introducing Tabs
Each tab displays a breakdown of incentives.
No.003
Tabs, minimized
No.004
Introducing Cards
Details became compartmentalized and began to take the form of cards.
No.005
Pulling out the card title
No.006
Demonstrating Focused Elements
No.007
Tightening up the masthead
No.008
CTA revealed with interaction
No.009
Another reveal
No.010
One Card per Tab
My initial assumption was to filter the content using a tabbed system. That evolved into more of a cards-based approach, as they lend themselves to mobile quite nicely. Ultimately, we combined features from both tabs and cards towards the end.
No.001
Showing 3 Tabs at once
No.002
One Tab at a time
The next screen shows what happens when the details button is pressed.
No.003
Breaking down the Incentives
No.004
Moving to Cards
No.005
Simplifying Cards
The next screen shows what happens when the details button is pressed.
No.006
Details in a modal
No.007
Close the modal
No.008
Details, in-line
No.009
Adding Details to Cards
No.010
Pulling Out the Card Title
No.011
Card, not selected
No.012
Card, selected
No.013
Cards, evolved
Try swiping left and right to navigate.
Hint: Expand the slideshow to show captions.
Tap to load
1
2
3
4
5
6
7
8
9
10
11
12
13
Details of an Offer
Try swiping left and right to navigate.
Hint: Expand the slideshow to show captions.
Tap to load
1
2
3
4
5
6
7
8
9
No.001
Introducing side modal
The next screen shows what happens when the Customize Your Incentives is pressed.
No.002
Editable Incentives
No.003
A version with more detail
No.004
Removing Military Discount
No.005
Introducing center modal
No.006
Center modal, revised
No.007
Center modal, revised again
No.008
Adding Police Discount
No.009
Mobile Screens
No.001
Homepage Concept
No.002
Sitemap overlay
Tap to load
1
2
Filter Vehicles by Available Offers
Try swiping left and right to navigate.
Hint: Expand the slideshow to show captions.
Tap to load
1
2
3
4
5
6
7
8
No.001
Filtering vehicles
Live filtering based on the value of all combined incentives available.
