Ceci Bergier Art Director
_0001_Layer Comp 2.jpg

Design

BMW

OPPORTUNITY: BMW asked us to create a landing page for the launch of the X1, its “best-in-class performance” car, using only existing assets.
INSIGHT: Consumers like to explore a car's features.
SOLUTION: We created an interactive site to virtually demonstrate the car's many features.
MY ROLE: I designed the site in Sketch and Photoshop. Once the design was approved, I worked closely with developers and a motion designer to make sure all animations were correctly timed. I also helped with the QA process.

Marquee: Page opens with subtle animation. Slides ease-in from both sides, highlighting the cars "best-in-class" performance in different categories.

Marquee: Page opens with subtle animation. Slides ease-in from both sides, highlighting the cars "best-in-class" performance in different categories.

Cargo Section Animation: As users scroll down to the cargo section, a + button appears, allowing users to discover the amount of elements they can fit in the cargo. These are grouped by categories that give users a better way to relate and picture themselves owning the car.

Cargo Section Animation: As users scroll down to the cargo section, a + button appears, allowing users to discover the amount of elements they can fit in the cargo. These are grouped by categories that give users a better way to relate and picture themselves owning the car.

Room for the band and their stuff.

Room for the band and their stuff.

Camping with the family.

Camping with the family.

Succeeding the everyday.  Mobile Design: All elements and animations (except the cargo animation above) carried through on mobile.

Succeeding the everyday.

Mobile Design:
All elements and animations (except the cargo animation above) carried through on mobile.

TESTING DESIGN: 
For each presentation (internal or external), I used InVision to create a prototype for both desktop and mobile. This gave the team and I a better understanding of content flow and length. It also served as a great way to present and allowed us to experience the site prior to coding.

CREDITS:
AD: Ceci Bergier
MD: Conor Maher
DEV1: Phaedra Riley
DEV2: Megan Taylor
CD/CW: Chris Caracciolo