About the Project

A complete design overhaul of SocketLab’s website.

SocketLabs assigned me the project of redesigning their marketing website, which appeared dated and was difficult to navigate. The goal was to simplify the site map and focus on increasing user engagement and conversion rates.

Though it was a complete redesign, the company decided to keep their brand logo and primary color. Apart from this, every page was completely renewed from the ground-up.

The company aimed to launch the re-design of their business within three months of the project start date. The tight-deadline was met comfortably and analytics showed increase in user activity on the website post-launch.

Role
UX / UI Designer
Client
SocketLabs
Date
Dec 2020
The new pages included graphical illustrations of the product.
01

Creating a Design System

Before embarking on the re-design, I spent a lot of time creating a mood board of designs that would suit the brand and presented to the team. Through that research, I created a new design system for the company.

The finished style guide contained the design elements for every component of the new site that was passed through to development. Different states for each element were also carefully designed to ensure the entire user experience is seamless from the layout sections to the UI elements.

The style guide was important in sharing with the larger team so different departments could update the marketing materials accordingly, including videos, emails, blogs, etc.

The Design System contained Icons for every instance in the website.
02

Improving User Registrations

SocketLabs’ primary product is their Control Panel which users can access though the authentication portal. For this gateway, I remodeled their Sign Up and Login screens to increase user conversion rate.

The original experience to sign up was overwhelming and clearly contributing to the user drop-off rate. In the new design, I simplified the UI and removed plenty of unneccesary elements that were taking the user’s focus away from the task at hand.

The overhaul included matching the design language of the new site and reorganizing the layout to provide a more minimalistic view of the registration and login process.

The Sign-Up page was updated to improve the user conversion rate.
03

Project Planning

To ensure that we could meet the deadline, I split the project into a waterfall method of marketing, creative, development and QA.

An important task was organizing the documents that would be passed along through the stages of production. From the design side, I separated my work into mockups (for the marketing team to review and approve) and cloud documents (for development to get access to all design files and assets necessary).

The project speed increased exponentially once I had created a solid foundation for the design. Pages were separated into categories of Unique, Basic and Components. This allowed the marketing team to focus on the Unique pages, and for me to get started on the Basic pages. The Component pages were designed first and sent over to development for implementation to save time.

The Pricing Page was under the 'Unique Page' category.