The 10x Genomics Support Site is a keystone tool for Sales representatives and seasoned customers alike. We’ll dive into both why and how we redesigned these pages.

About 10x Genomics

10x Genomics is a biotechnology company that designs and manufactures gene sequencing technology used in scientific research. I manage the company’s web platforms, which include 10xgenomics.com, 10xgenomics.com/store, and kb.10xgenomics.com.


What is a Support site?

When you read the words: “Support site,” you might think of a web app separate from the main site where a user goes if they have questions and want to reach out to a member of the company’s customer service. That’s a very natural thought, but that’s not what the 10x Genomics Support site is.

The 10x Genomics Support site is a keystone tool for internal and external users to find and reference documentation relevant to their experiment. As the product portfolio expanded, workflows became more complex - more emphasis was put into sample preparation, compatibility with instruments, and sequencing. As a result, the current needs strained the original design in unanticipated ways.

Average monthly users

350,000

Growth

Given the high traffic, the current limitations were extremely important to solve. Major pain points include:

  • Hard to navigate and sift through lists of documents

  • Hard to onboard and get started

  • Poor search functionality

We’ll dive into how we solved each of these below.

Fun fact: Users visit the Support site more frequently than the marketing site, accounting for over 60% of all traffic.

Home

Additional Applications

  • Our current support site mixes various assay products, outdated ones, and Cloud Analysis, leading to confusion. Since many customers visit this site for information before buying or while using our products, it’s important for them to easily explore the full range of 10x products. The redesign will present our complete product line and emphasize that 10x provides comprehensive solutions.

  • Customers looking for information on instruments and software find it confusing to navigate our support site. They first need to pick an assay product to access compatible instrument or software documentation. This is not user-friendly for those who use several assay products.

  • The product "blocks" on the support site include "mini blocks" that link to various applications or assay types. This is a usability problem because the mini blocks resemble informational labels rather than links to different workflows.

Product Pages

  • Our support site offers limited help for customers, requiring them to find information on their own. Since many visitors are potential or new customers, we aimed to better highlight our resources to assist with onboarding. We created a new Overview page to introduce customers to the product, which includes a new type of document: Getting Started. We also added clearer descriptions for navigating workflow steps, a new workflow step specifically tailored towards Experimental Design & Planning, and more.

  • Finding User Guides has been an extremely common problem for customers. We addressed this by redesigning the User Guides page to allow filtering instead of staring at a flat list of documents. This is especially useful for products like Single Cell Gene Expression, due to the many guide variations. Additionally, we added clear "Find User Guides" buttons on the homepage, product pages, and documentation pages, to increase the number of entry points into this key tool.

  • Our field team prefers the clear steps and icons on the support site, as they help guide customers through key stages. We kept this setup but enhanced user experience with a persistent left-hand navigation. Previously, moving through the workflow took too long— one click to enter a step and another to return. This caused frustration due to unclear document organization. We addressed this by improving search features (more on this below) and enabling easy one-click navigation through workflow steps.

Filters

Documentation

  • The current layout is overwhelming and does not reflect our great documentation - we scare off users with long titles and technical jargon. To make it easier to navigate and avoid long blocks of text, we added brief, easy-to-read descriptions, useful metadata (CG numbers - an identification system for documents) and visual thumbnails.

  • In addition to the new left-hand navigation, we’ve also added a smaller UI navigation bar on the right-hand side - called On This Page. The On This Page component gives a preview of the rest of the page, and provides easy jump link markers if a user is interested in a specific document type.

  • With many documents, a strong search tool is crucial. Our Support site currently has no in-page search, forcing users to rely on Ctrl+F, which only works for document titles. Our new in-page search will check both document titles and descriptions for better results.

Search

Global

In-Page

As we touched on above, Search is an extremely important tool to help users navigate the sea of documentation we’ve published. A poor search experience can harm our company and frustrate customers, leading to more support requests for help. In the past, many users have turned to our Field Application Scientists or Technical Support staff for information because our support site is hard to navigate.

There are two main ways users search:

  1. Google search, for which our new pages are optimized for SEO.

  2. Our site search, which we are continuously working on to improve the accuracy and ordering of results.

In our enhanced site search, we categorize results into different indices - pages, documents, software, datasets, and videos - to help users find a specific type of content they are looking for. Our in-page search functions off the same search algorithm we employ on the site search, but only queries on the documents of that individual page.

Previous
Previous

10x Genomics - Store

Next
Next

Collegium — Mobile & Web Design