AJ Harris

Redesigned the Solutions Section with a focus on mobile, introducing new design elements to desktop and tablet, and implemented responsive design across all devices. Developed a fully functional prototype.

Client:

Brightspeed Business

My Role:

Product Designer

Year:

2024

THE PROBLEM

The previous Solutions Section design led to user confusion and high abandonment rates

The previous design of the Solutions Section caused significant user confusion and site abandonment. Analytics revealed that 64% of the site's traffic came from mobile devices. Unfortunately, the previous design did not cater to mobile users effectively, causing many customers to miss the Solutions Section entirely. This resulted in frustration and ultimately led to users leaving the site when they couldn't easily find the information they needed.

PREVIOUS DESIGN

Previous Design & Functionality

The previous Solutions Section design had several issues: poor mobile optimization, confusing navigation, and inconsistent design elements. Users struggled to find information quickly and encountered a lack of clear calls-to-action.

An animated mobile screen of Brightspeed website offering enterprise solutions, networking, and dedicated internet services.

RESEARCH

Research Insights

The team at Brightspeed conducted preliminary research on the previous Solutions Section design. Based on this research, I identified key friction points and critical findings that impacted user experience.

Findings

Users struggled to locate the information they were looking for in the Solutions Section, leading to high abandonment rates.
User feedback indicated difficulty in using the Solutions Section due to unclear navigation.
The previous design lacked a clear call-to-action, reducing user engagement.
The layout made it hard for users to quickly find relevant information, causing frustration.

SOLUTION

Tabbed Navigation

Tabs provide the best solution by keeping options visible as users navigate, ensuring easy access to categories. This widely-used, intuitive design effectively organizes parallel content groups, as recommended by the Nielsen Norman Group (NNG).

Updated Card Design & Horizontal Scroll

In the previous design, the cards were hard to see and lacked a clear CTA. I increased contrast with a darker gray, added a shadow for visibility, and placed a prominent CTA at the bottom right of each card.

To improve mobile experience, I switched the card layout from a vertical stack to a horizontal scrolling stack with pagination and navigation options, reducing page length and enhancing functionality.

Dedicated "Featured solutions" Category

I added a "Featured Solutions" category to highlight Brightspeed's most popular solutions, allowing users to quickly access key options and improve their overall experience.

Solutions Section Redesign

Solutions Section Redesign

Solutions Section Redesign

Solutions Section Redesign

THE PROBLEM

THE PROBLEM

The previous Solutions Section design led to user confusion and high abandonment rates

The previous Solutions Section design led to user confusion and high abandonment rates

PREVIOUS DESIGN