img

Twitter

Modernizing Twitter’sHelp Center

Empowering People to Better Understand Twitter

Twitter’s Help Center is visited by 10’s of millions of people each week, looking for help using Twitter. In an effort to modernize and improve the accessibility of help content for a global audience, Twitter reached out to Green Stone to redesign their website. Many Twitter users were left searching for alternate sources for help when they couldn’t find it on Twitter. Our challenge was to help them find the answers they needed on Twitter and position Twitter the authority for help content.

  • Services

  • Experience Design

  • Visual Design

  • Content Strategy

  • SEO

Visit

https://help.twitter.com/
Media block image
Media block image

Understanding how Twitter Users are Looking for Help

Where are users looking for help? What devices are they on? When do they prefer self-help options or to speak to someone? Our team had a wealth of user insights to draw from through public support related Tweets. We synthesized these Tweets into 4 behavioral personas. Twitter user behaviors and where they expected to get help varied depending on the type of issue they were trying to resolve. Surprisingly, many Twitter users would spontaneously assist others who were struggling to find help.

1
2

Help From Where You Need It, When You Need It

Our vision was to build a smarter Help Center. No matter where users were, help needed to be surfaced in search engines, more accessible from Twitter’s product, and shareable between Twitter users looking to assist one another. We brought that to life through Help Cards, instructional content that would not only live within the Help Center in articles, but could also be modularized to be search engine friendly for Google Snippets, and contextual and shareable within the product.

Media block image
Help Cards with instructional content in articles.
Media block image
Help Cards from articles in site search.
Media block image
Help Cards content pulled in Google Snippets.

Designing a Modern, Readable and Flexible Design System

Throughout the creative process, we balanced our vision with the needs of users and the business. Our use of type and color modernized the Help Center. Keywords were bolded to improve readability of 300+ articles. The use of graphic elements was avoided to simplify the content localization process for content managers and reduce page load for limited bandwidths. We conveyed Twitter’s voice: simple, direct and empowering while fulfilling the user’s needs of speed, findability, and readability.

123

Improving Findability of Help Articles

Modernizing the design alone was not going to improve the Help Center’s ranking in search results or improve the paths to articles. We recategorized all 300+ help articles to make it easier to find the right category and article, all the while reducing the number of clicks required to reach an article. Articles were renamed and systemized to improve findability. All URLs were restructured to improve the accuracy of the site search and search engine rankings.

Media block image
Articles are discoverable via search or browsing.
Media block image
Tapping on a topic reveals a list of sub-topics.
Media block image
Articles are organized on topic pages by subtopic.
Media block image
Navigate to other articles via topic navigation.

Validating our design

Throughout our design process, we tested click-through prototypes of the Help Center to inform us of the behaviors and expectations of Twitter users who had experienced technical issues or harassment and abuse on Twitter. These insights proved invaluable in our iteration process, and reassured both our team and Twitter that the design decisions that we were making would make an impact in how Twitter users experience the Help Center.

Media block image
Media block image

Support.Twitter.com is live and people are finding what they're looking for faster. Overall pageviews have decreased while sessions have remained consistent - a great indicator that the new taxonomy is working.

Let’s collaborate together

Chat with us

LN Thumbnail
WOW Thumbnail
MK Thumbnail
Techstars Thumbnail
Whispir Thumbnail
Hearthside Thumbnail Image
zappi card image
Quicktag Thumbnail
allkind thumbnail

See more

Quick-Tag