{ITEM_IMAGE_ALT}

4btns-01

{ITEM_IMAGE_ALT}

4btns-02

{ITEM_IMAGE_ALT}

4btns-03

{ITEM_IMAGE_ALT}

4btns-04

{ITEM_IMAGE_ALT}

4btns-05

{ITEM_IMAGE_ALT}

4btns-06

{ITEM_IMAGE_ALT}

4btns-07

{ITEM_IMAGE_ALT}

4btns-08

{ITEM_IMAGE_ALT}

4btns-09

{ITEM_IMAGE_ALT}

4btns-10

Fragrance Line

Client

Bill Blass

Role

Motion graphics + front-end programing + GUI components + image editing

Technology

ActionScript + XHTML/CSS + JavaScript + PHP + Photoshop

For this website intro, my job was to design its motion graphics and UI. The initial motif suggested by my employer was a splash in which a 3D-rendered logo swivels around against Manhattan skyline to stress the product line's identity as a New York-born brand. My concept was to develop the motif into a fully-functioning interface by using an animated backdrop that stresses the menu items.

I began by mapping out the sequence of the logo's swiveling motion in a storyboard and a visual spec, and then relaying them to our 3D modeler. When the animation for the opening sequence was ready, I imported it into the timeline and made the sequence immediately transition to an interactive navigation.

For the interactive navigation, I made the angle of the swiveling logo respond to the position of the mouse as it is moved across the screen. I also matched the logo color to the product's brand color activated by the mouse. My overall aim was to create a sophisticated, dramatic, multimedia-based experience that encourages the user to explore the various products featured on the site.

{LANG_DETAILS}

  • Cosmetic Product Catalog
{LANG_ONLINE}