Global
note - When any design is scrolled vertically or hover there are effects with respect to boxes and photos moving or folding into vertically/horizontally place as is commonly seen in responsive design having long vertically scrolls. |
|
 |
 |
| DESIGN#
1A Animation Sequence: 1) Top photos slide-animate multiple photos. 2) After each 'horizontal' photo movement; a new tab + tagline text vertically drops-in super imposed over the photo. 3) Below the large photo, small thumbnails advance one image at a time and can be linked to open a larger photo and/or linked to an interior product/service page. 4) The 8 box area icons will move when hovered and links to interior pages. 5) Lower map is interactive. |
DESIGN#
1A • Based on design 1A except the white drop tab/tagline is replaced with a dark blue gradient to support the tagline animation. |
 |
 |
| DESIGN#
2A Animation Sequence: 1) Top photos slide-animate multiple photos. 2) Below the large photo is introduction text and a quick contact form. 3) The 8 box area icons will move when hovered and links to interior pages. 4) Small thumbnails advance one image at a time and can be linked to open a larger photo and/or linked to an interior product/service page. 5) Lower map is interactive. |
DESIGN#
2B • Based on design 2A showing a second photo in the animation sequence. |
 |
 |
| DESIGN#
3A Animation Sequence: 1) High contrast duotone photos slide-animate multiple photos from the right side and a banner graphic + taglines slide-in from the left side. 2) The navigation is slightly transparent and overlaps the main photo. 3) The 8 box area icons will move when hovered and links to interior pages. 4) Small thumbnails are linked to open a larger photo and/or linked to an interior product/service page and a quick contact form is on the right-side 5) Lower map is interactive. |
DESIGN#
3B • Based on design 3A using a high-contrast color photo versus a duotone photo. |