Avalon by EAW website

The website for Avalon by EAW, a very high-end loudspeaker series. They wanted something that looked flashy for a specific type of buyer. Something played up the look rather than being heavy on specs. The website was a single-page side-swiper using png-24s and has loads of interactive elements… at least it did. The website has been rolled into EAWs main site since initial launch in early 2012.

The entire site was written in JQuery with HTML/CSS fallback.

avalon web 1

In the initial design meeting, they had said they wanted something that felt more like a high-end automobile website than an audio website. This section was designed with that in mind; a fully interactive build-your-own loudspeaker showroom. When a paint swatch was clicked, the main image would update with color choice. In addition, the paint swatches would roll to the applicable color choices based on what you clicked (for instance, the horn could only be a color to match the cabinet or the grill. You could not have three colors on one loudspeaker.)

avalon web 2

avalon web 3