Increase consistency across all digital platforms by introducing a digital style guide for the first time that all designers could easily reference.
Presentations for approval
Shared Adobe Libraries
Guidance on use of elements
Technical Specifics for IT to build out elements
Lead UX Designer
Figma
Photoshop
Powerpoint
1 Design Manager
2 Developers
3 Senior Leaders
6 Months
Five Below has struggled with consistency for years. Every season has a new set of campaign guidelines which force the designers to rethink their methods every time. Because of this, guidelines for digital designs did not exist. The brand existed in stores alone for so long that digital assets were always thought of as a side project. The print versions were simply translated into digital. This caused confusion and no foundation to build upon.
Allow digital to have its own place in the company. Giving solid guidelines solidifies digital as an important component in the company. This will also alleviate much of the stress put on the designers who scramble every season to start from scratch on how to create. Rules that are flexible enough to be expanded upon and be woven into the seasonal campaign process.
We took a massive inventory on where we were when it came to a brand style guide. It was purely print focused with Pantone Colors at its core. The store signs were very well planned out with sizing and placement poured over for years. The digital components were never given this treatment. We discovered a real opportunity to define all aspects of the website.
Example on how varied each season appears on site. Different sized assets, colors, fonts, and photography styling.
Starting at the smallest elements allows for building up to a larger component library. We through out all kinds of ideas for CTA styles, icons, and brand voice banners that could pull what we called the Evergreen Campaign during any season.
The main steps of the customer journey is from a landing page, either homepage or featured shop, product listing page (PLP) to explore the selection of products. Onto the product detail page (PDP) to see the details of the selected product. The finally landing in the checkout flow to complete the transaction. This journey can be very different based upon many factors. How the customer enters the site, if they want to shop directly from the homepage. Or, if they are simply looking for the store locator to shop in person.
We built a roadmap for each page. Partnering with the Developers allowed us to pull our ideas into a roadmap of progressive improvements. This allowed for Senior Leaders to see the vision and have an understanding on how the project was progressing over time.
The PLP has complexity that the others do not. It much be dynamic in how the products are featured. Much of the customer’s time can be spent here by sorting and filtering to discover the product they are looking for. Additional features could be introducing variant selection or add to cart directly without the need to navigate to the PDP.
This page has the least variability when compared to the others. A single product featured at the top with the option to add to cart. The difficulties come in when the choices are made to add variants, video demonstrations, social posts, reviews, and additional product suggestions. This page could be very robust as it is your last opportunity to convert a customer who needs more information before clicking the all important Add to Cart button.
While the Checkout Flow is fairly straightforward with a process walking the customer through the checkout. The details make a significant difference in the customer’s trust in the company to be willing to continue with the process or backout because of a feeling of unease.
Sales saw an uptick as customers reported a feeling of polish and ease as they navigated the site. Production among designers saw a raise as well given the reduced friction points when creating assets for any location on the site. The overall consistency on site was immeasurable as the entire brand came together. Store experiences have always been top of mind. But, now the site had a feeling as well that would continue to bring customers back.
contact@davidbuceta.com