Website Redesign: GITHUB; REACT

BrightStores

While working at BrightStores, the company underwent a brand redesign. I worked on this project with my Store Art Team alongside the Marketing Team and a freelance designer (Six Leaf Design). We worked together to create the new vision and then took charge of different aspects of the project: the Marketing Team completed a content audit while Six Leaf Design created the new brand guidelines and four layout mockups, I collected and created the images we would need, and then we created the base code in React for the layouts provided. From there, the Marketing and Store Art Teams continued to work together to create new pages with fresh content. When needed, I help create new layouts (often a mixture of preexisting elements) to best showcase the information.

 

Role:

Front end Developer & UX Designer

Impact: color and animations

One of the key components that was missing from the previous version of the website was color. It was primarily black and white with a couple dashes of the brand’s blue, and so it was hard for information to stand out. We decided on a bold color scheme, with different palettes for the different platforms offered by BrightStores in order to create brand recognition within these sections.

We added animated text sections to the headers to be able to call out the various uses and importance of the platforms and create more call to actions this way.

Friendly Brand voice: doodles and Verbiage

The previous site featured a lot of industry jargon, making it difficult for newer clients to understand what was being offered. We decided to make the website more approachable and friendly, which we accomplished with fun doodles and newly written content that reads as if you are having a conversation with a friend.

Information Architecture

One of the hardest things to tackle during this redesign was the sheer amount of information available for people accessing the site. The website needs to be able to not only sell the different company store platforms to new clients, but also provide sales tools for existing distributors. As the offerings became more diverse, we needed a way to allow clients to compare them easily. We decided to use toggles on many of the pages which allow you to switch between Company Stores information and Simple Stores information without needing to navigate to an entirely new page. Whereas previously you needed to scroll until you found the information you needed, now everything is right at your fingertips.

Ease of access within the brightstores team

Some information, such as the Webinar date and time, changes constantly and as such needs to be consistently updated on the website. Previously the Store Art Team would receive weekly emails with updates to content from the Marketing Team, and we would then go in and edit the code accordingly before deploying. This process was clunky and meant that the Marketing Team always needed to wait to get the information out to clients rather than have it immediately be up-to-date. We decided to improve this process when coding the new website by linking google sheets to the code of the most edited content. This means that now in order to update information, all our Marketing Team needs to do is access the sheet, replace the relevant information, and bam! it automatically updates the website.

 
homepage.gif
homepage_new.gif

Homepage design

We wanted the homepage to draw new clients in and provide them with the information necessary to decide to use BrightStores for their company stores. We did this by using bold colors, larger images, and eye catching examples of our storefronts. Each section features call-to-action buttons to allow easier navigation of the site as previously the homepage was used as a catch-all for information, but did not have any obvious buttons for potential clients to learn more about the products being offered.

 
simple_stores.gif
simple_stores_new.gif

sIMPLE STORES

As BrightStores began investing more time and money into its newest platform, Simple Stores, we wanted this to be a much larger part of the website. Simple Stores are one page storefronts that allow for a much simpler shopping experience should the client not need a full Company Store with features such as categories. As this has previously been seen as the younger sibling of BrightStores, there was not a lot of information on the original website. I helped change the layout of the Simple Stores page to better showcase the options clients have as well as the new add-ons being offered. You will notice this page features a prompt asking “Does Your Client Need a Simple Store or a Company Store?” to help drive clients to the right platform selection for their needs.

 
our_work.gif
our_work_new.gif

OUR WOrk

Over the years BrightStores has become one of the leading software options for distributors in the promotional products industry with both Company Store and Order Management offerings, however you wouldn’t know this immediately from the previous “Our Work” page. We knew we needed a bigger impact on people visiting this page and decided to accomplish this with more color, animated numerical data that counts up, and more testimonials on display.