Yasha wins Bravo! Award

Yasha Wins Bravo! Award for Technical Expertise

Turning an Ordinary Table of Data into a UX Masterpiece!

Moving Past the Norm

September 2, 2015 — The marketing staff was in the process of building a digital campaign for Panduit's multi-million dollar Quick Launch Build project. The project was intended to reach millions and expected to generate millions in revenue for the company. Looking to make a big imprint on the web, the team knew just who to turn to get it done--Yasha.

The Request

Yasha's Bravo! award for Technical Expertise.

The request was submitted using a ticketing System. In this system, marketers supply developers with content and an ideal look and feel for the web pages and landing pages. Boyle submitted a Word document with a table of products from Panduit's online catalog.

The Strategy

Upon review of the Word document, Yasha immediately began UX Research to discover the best method for presenting the material. Using the 10-step process from the Interaction Design Foundation, she came up with the idea to use an e-commerce approach--listing each product and then if more information is desired, it appears by clicking on a "more info" button.

The Design

Using inspiration from CodyHouse, Yasha designed a product page that would list all products initially with a sub-navigation bar that allowed the user to see that there was more than one section on the page. By selecting one or the other, the user can see the products that they are interested in, as the non-selected category fades away. When a user clicks on a product, there is a one-second timeout, the modal for that product appears using minimal animation, and then the user only sees that product's information with a link to the actual product in the online product catalog on Panduit's website.

Content

Adding on to Boyle's content, Yasha used the content that displayed on the product's page to give a meaningful description about each product. Any pertinent information was provided in the modal for the user to peruse.

Adhering to Brand

Yasha stayed true to Panduit's brand, using colors that had been already implemented throughout the site. Panduit's new color palette also takes a front seat in this project, showing off the new gold tone.

Digital Marketing

Social media was a key component to this campaign, providing posts and tweets on Facebook and Twitter, respectively. An email campaign was also created and distributed as well. A great tutorial on how to use the product was also featured on YouTube.

Site Development

Using a mobile-first approach, the site was built using Twitter Bootstrap so that it would be viewable on smartphones, tablets, and multiple desktop screens. The site was optimized for IE9, IE10, IE11, Firefox, Safari, and Chrome, with notifications appearing if the user was using IE8 or IE7. To handle most of the animations, jQuery was used, but we took advantage of CSS3 to ease the weight on the pages. Plugins were also used to help with some of the animation.

Results

In less than a month of its launch, the microsite saw over 1200 visitors! See for yourself! The site can be viewed live on Panduit's website.