SITE-WIDE REDESIGN
Research / Design Audit / Design Systems / Redesign
Overview
The Brief:
Brooks Life Sciences Services and Products was recently rebranded as Azenta Life Sciences. They want to merge their two existing sites into one user friendly, B2B e-commerce site that captures the look and feel of their new branding.
Role:
Lead Designer
Team:
Dakota Thompson, Andres Cabada, Jeff Putnam, Nevine Khan
Before
Their site lacked visual hierarchy and color contrast that was negatively impacting the user experience. The site also did not reflect the new branding in a strategic way that was beneficial for web.
After
Using a modular approach we improved page layouts to enhance the messaging and align the user experience with the brands goals of making it easier for businesses to view & purchase products. New branding was strategically used to create a new design system that would visually engage users and drive brand recognition.
The Process
01: Research & Competitor Analysis
I compared the experience and design of Azenta’s current two sites to a few of their biggest competitors. Overall, the biggest area for opportunity was in reorganizing their content to create clear, narrative-led page layouts, and create a design system that follows best practices for web.
Azenta - Design Audit
Strengths:
Clean & open look and feel
Well written content
Strong photography
Opportunities:
Color contrast in many areas are not ADA compliant
Inconsistencies in design system
Busy mega menus that are not easy to navigate
Page layouts that complicate the content
Inconsistent spacing throughout both sites
Competitor Analysis
Threats:
Clear tagging system for discounted items & product categories
Easy to navigate
Opportunities:
Appearance is dated
Inconsistencies in design system
The page layouts are busy & cluttered
Lots of stock imagery
Issues with accessibility in color contrast
Persona
We created 20+ page templates to accommodate their existing content as well as the merging of the two sites. Here are a select few:
02: Wireframes
Drawing inspiration from lab paperwork, we utilized boxes and lines to establish a clear grid system that improves readability and differentiates Azenta from other competitors within the space. We designed 20+ page templates. Here’s a select few:
