Sep 20 2017

Redesigning Reddit

by Anaïs Ramón

reddit logo

Co-authored by John Hargan.

Why redesign Reddit?

Reddit launched in 2005 and has remained largely unchanged in design since. While there’s a nostalgic charm to its appearance, most will admit that the user experience is far from intuitive, with a jumbled UI that can take some getting used to.

Quick disclaimer: We weren’t Reddit users, so we were diving into the unfamiliar with this redesign. In one way this was an advantage, but in another way it wasn't; Reddit has a die-hard fan base, with a unique culture and etiquette built around the site. With the redesign project, we had to be wary of the preferences of these users (we touch on the dreaded user revolt later in this article!). 

Coming in fresh

Upon visiting the site, and then becoming a member, the following struck us as odd:

1) The site lacks visual hierarchy. It can be difficult to figure out where to go to next:

redesigning reddit

Text vomit is a vulgar term, but it captures how we feel about the interface. It can be difficult to scan pages on Reddit.

2) Notifications are not obvious:

reddit redesign

We could have received a message and not noticed. That’s not ideal. We’re used to prominent notifications. The jumbled Reddit UI can make these hard to notice at first glance.

These were the most immediate high-level problems we had with the site from a UX perspective. But overall, the site lacks consistency in its visual design – with multiple text styles, navigation sections, and fonts to be found on the user’s homepage.

Having recently raised $200 million (and with a redesign in it's sights), it seemed like an ideal time to try our hand at redesigning ‘the front page of the Internet’. It will be interesting to see where the growing company takes their design. With the web veering towards an image-heavy, visual-first approach – we suspect we’ll see many elements in the coming official redesign inspired by sites like Pinterest and Instagram.

Avoiding a revolt

Reddit has a loyal and vocal community. They’re passionate users, and if they’re not kept happy – they let the world know. So, as mentioned earlier, any redesign attempts would have to ensure that the site keeps its loyal fans happy, updating user flow and visual coherency while keeping the core user experience largely the same.

Redesigns can be notoriously difficult. In 2010 Digg, a social news aggregator lost almost a quarter of its users, many migrating to Reddit, and never quite recovered from a failed redesign. What went wrong? There’s a fairly simple answer. Digg failed to listen to its users. 

Digg is very similar to Reddit, both in its function and its user base, so we wanted to avoid the possibility of a user backlash with our redesign. Reddit is not perfect, but it works, and its interface is loved by its loyal community. So we approached the project with the mindset of ‘if it ain't broke, fix it a little bit’. 

One caveat to note: During the redesign, we didn’t have access to data about how people interact with Reddit. Because of this, design choices were made on assumptions about how users behave and interact on the site.

Elements of the redesign

The Facebook angle

A lot of the redesign took inspiration from Facebook. Reddit has admitted that it’s redesigning to look a lot more like Facebook. It’s not a bad idea. Facebook’s design is meticulously researched, with small UI changes based on the vast amount of user data which the company collects. It rolls changes and new elements out slowly in a phased and methodical way. This data-driven approach has resulted in a product design that is becoming close to standard across the web.

With the Facebook design in mind, we added a help icon at the top of the page, just next to the sign-in controls. The idea was that first-time users could easily access important information about how to use the site. Another inspiration taken from Facebook is the larger message notification icon – when a user has no messages the icon is gray, however when a message is received it turns orange. It's not a significant departure from the original message notifications, but the cleaner surrounding UI makes notifications a lot easier to notice.

reddit redesign

Subreddit folders by theme and preferences dropdown

Upon signing up for a bunch of subreddits, we noticed something frustrating about our homepage: there was no separation between subreddit themes. We’re big music and Game of Thrones fans, and professional UI/UX designers/marketers by trade. However during a visit to the site we typically want to read either about professional topics or just enjoy some fan speculation and discussion, but not in the same feed. So we added subreddit folders to the design, inspired by the Google Chrome bookmark folders. These allow users to group together subreddits by theme as they see fit. Similarly, we simplified the ‘Preferences’ link by adding a simple drop-down from which sub-menus can be selected.

Reddit redesign

Posting

There’s no need for 2 posting buttons on the site – these are also located next to ads and difficult to notice. We added a single ‘Post’ button to the top of the page, the button is simplified by asking users if they want to ‘Submit a new link’ or ‘Submit a new text post’ after the button is clicked (this functionality is not shown in redesign).

reddit redesign

The search bar

The Reddit search bar is buried, hidden in the right column. Search is an important feature of most websites, but particularly for one which holds so much information. We moved the search bar to a prominent location next to the Reddit logo. This design pattern is well known and follows popular services like Amazon and Facebook.

Reddit redesign

The final design

Reddit homepage

None of the design elements in place are a huge break from the Reddit design, or from the norm. But when you combine the small changes we made, we feel this is an elegant update to a great site. There are some small updates to typography that lend the site a coherent aesthetic, while we feel the small changes to elements of the site will have a big impact on usability – particularly for new users.

Want more? Head back to the Tivix blog