Website + UI Design (2020 - 2021)

ShipStation Website Redesign

About ShipStation

ShipStation is a global online shipping platform and mobile application that allows online retailers to manage small parcel shipping and ecommerce fulfillment. The Austin-based company combines order processing, shipping label production, and customer communication that easily integrates with major carriers and online platforms. ShipStation is owned by Stamps.com, and is part of the Auctane family (comprised of ShipStation, ShippingEasy, ShipEngine and ShipWorks).

Redefining the Brand + Redesigning the Website

I joined the ShipStation marketing team in November 2019, when ShippingEasy merged with the greater Auctane family. At that point, ShipStation had an established brand identity with a visually underwhelming — yet high-performing — website. Despite upwardly trending results, the consensus was clear across the organization: ShipStation needed a redesign.

Rather than tweaking the home page (which could present costly implications), we started with redesigning the Partner page, and creating a much-needed Resource Hub. Before moving forward, however, we needed to finalize ShipStation’s brand guidelines and get approval from our Product team, as well as executive leadership.

Creating a Design System

Despite its brand guidelines, ShipStation needed a design system to structure its marketing website. We created a simple, easy-to-use framework to guide future pages and maintain consistency across the site.

ShipStation Design System (2).png

Partner Listing Hub & Partner Pages

Partnerships are an integral part of ShipStation’s business, and a MAJOR focus for the marketing team. Prior to our redesign, the main listing page lacked structure and was littered with text — resulting in a difficult-to-navigate, aesthetically displeasing experience. Our goal for the hub was to clean up and modernize the page, add filters for major partner categories, and add search functionality. In short: We had the right information, but lacked the structure and organization to communicate in a clear and compelling way.

Our approach to the individual partner pages was similar, with an added focus on flexibility as we needed a template that worked for every partner. Our old templates were pretty basic (and not necessarily a UX nightmare), so our main goal here was to modernize for branding purposes.

CQ Portfolio - ShipStation Partner Pages - Desktop (3).png

Mobile Experiences

The biggest challenge for mobile was figuring out how to display filters — since a side bar was obviously out of the question. Although the prominent search bar is designed to help users quickly and easily locate each partner, we wanted our desktop filters to be available on mobile as well.

Initially, we opted for a drop down menu to save vertical space, but ultimately reverted to the full layout (like desktop) after learning how heavily our users relied on the filters.

Resource Hub

The Resource Hub was a much-needed addition to the marketing site, as we lacked a clear destination for the many ebooks, guides, infographics, and videos our team regularly created. This was a no-brainer for our team, and we wanted to keep the page as simple as possible to allow for the most user-friendly experience. Our reasoning: We can let visual design/branded elements shine through each resource’s featured image (instead of cluttering the main page structure).

You might notice the location filter under the search bar, which may seem unnecessary. We’re in the process of building out resource hubs for our international markets (including France, the UK and Australia), so this will soon serve an actual purpose.

3 (1).jpg

Mobile Experience

In the animation below, you’ll notice that — unlike on the partner listing hub — the categories are listed under a drop down menu. Our reasoning was that the page was easy enough to navigate as is, and is a “nice to have” option that shouldn’t take up valuable vertical space.

ShipStation Resource Hub Phone.gif
Next
Next

Auctane: Branding + Website Design