company December 4, 2017

How We’re Designing Channels

This post refers to “Channels”, a product which is now called “Teams.” This post is part of a series on how we’re making Channels, the thinking behind the product, and insight into the process. We’ve got smart people working on smart solutions, and continue looking to the community and alpha/beta testers as we iterate toward launch. Read…
Avatar for Kurtis Beavers
Product Creative Director (former)

This post refers to “Channels”, a product which is now called “Teams.” This post is part of a series on how we’re making Channels, the thinking behind the product, and insight into the process. We’ve got smart people working on smart solutions, and continue looking to the community and alpha/beta testers as we iterate toward launch. Read “Why Channels”, the first post in the series for more background info.

Working on Channels has been like any remodeling project: You start out excited, then you pull down the wood paneling and suddenly realize you’ve got rewiring to do — solving one issue leads to even more. 

Discovering the problems

The team started by interviewing developers — observation to more deeply understand their needs, the benefits and shortcomings of tools they’re using for knowledge management, and their hopes for what Channels on Stack Overflow could be.

This research helped us center our approach around three main principles:

  • Channels provides a private & secure space for your team to store and share institutional knowledge,
  • Channels is a feature that exists right on Stack Overflow, a familiar place where developers know the systems and already go to ask and answer programming questions,
  • And deep integrations & notifications are essential to make sure that the right question gets in front of the right person, especially on a smaller community or team.

Next, we went broad by analyzing other products and prototyping many design approaches before converging on any solution. We pulled in designers from different product teams to quickly explore a wide range of solutions.

This is where we began to discover that the new tile might not match the countertops.

Here’s what we’ve learned so far

Needs in small, private spaces are very different than large, public ones

There are nuances to how people will use their private, work channel that differ from the public setting. Connections and relationships already exist in the physical world prior to the addition of a private Channel. Work problems are specific to coworkers who are domain experts. In public, anyone across the globe with the right knowledge can answer general programming questions. 

Not all features and rules created for public Stack Overflow are necessary in a smaller, private environment, and new features are needed that don’t yet exist. For instance on public Stack Overflow, you can’t mention anyone unless they’ve contributed in some way to the question (otherwise Jon Skeet would get pinged any time anyone had a C# question.) But in a private channel the need is different — “I want to make sure Jenny sees this question because I think she’s probably the only person in the company who can answer it well.”

comment

Also, users need to be able to quickly identify what is private. There are updates to the UI that are necessary in order to ensure there’s no possibility of posting private info into the public space.

ask-question-prompt

Adding channels requires big changes to SO’s Information Architecture

A house with more rooms needs more doors. In order to help teams easily find, share, and store institutional knowledge, we need to make our search interface and navigation (finding things by clicking around) be more intuitive.

Putting navigation in the right place

Adding channels into the current navigation presents challenges that didn’t previously exist, and can only be solved by rethinking the underlying site structure. 

nav-sketches

The team created several prototype navigations, narrowed to two, and tested with a group of users. This surfaced a few key issues:

  • Scalability: Horizontal navigation lacks the space for additional elements — especially multiple channels per user.
  • Gestalt: It’s confusing to place Channel navigation at the page top, where information is already dense. The hierarchy of information must be balanced and easy to comprehend.
  • Persistence / Consistence: Because navigation creates a mental map, any design iteration that didn’t expose the existence of the channel at a top nav level created confusion.

We need a system that solved these problems well regardless of whether you’re trying to find info to help onboard a new developer to your team, or just trying to figure out how to vertically align text in CSS.

While we haven’t solved all the edge cases, the design discovery gave us a clear direction to test during the alpha phase.

One search for all Channels

A key path to finding content on Stack Overflow (searching for a question on Google, then clicking on a Stack Overflow Question) doesn’t work for private Q&A because Google can’t index it. That means Channels users will often need to use SO’s search when they’re looking for content that might be private… and our search has been showing its age for some time now. If our goal is to quickly help users find the most relevant results, then we need a better search experience that considers the searcher’s intent and improves the quality of the results (but I’ll let an engineer speak to those changes in a future post).

New integrations and notifications

Because Stack Overflow gets 10 million visits per day, getting questions answered hasn’t been a problem we’ve faced for a long time. The mechanics in smaller communities are different. With Channels, we had to think through how smaller teams interact and the workflows they’re already using in order to make sure the right people see the right questions.

Our  primary learnings showed that we need to integrate with the tools teams already use (such as Slack) and enable users to create custom email notifications. We’re planning and building several integrations.

Balancing getting users in and iterating toward a vision

Much of design is iteratively gaining a deeper understanding of the problems we need to be solving. Achieving a higher fidelity of understanding means repeating the process of creating and testing over and over again. Throughout the design process there’s a healthy tension between what we can build today and ship fast so that we can actually put something in front of users to make sure we’re meeting their greatest needs and a longer-term vision that guides our trajectory as the product matures. 

We split the work into phases, and even though we’re embarrassed by some of the things we are putting in front of people, there’s reassurance that we’re building toward a future state that we all believe in. This also means that we aren’t launching into long build phases on things that we think are important, but may not be essential to our users.

Next Steps

We’re launching Channels alpha in December and hope to be moving into public Beta in Early Spring. Look for future posts sharing our design, research, and product development process in the coming weeks.

In the meantime, we invite you to provide feedback or sign up to be part of our beta group as we test and grow our Channels product. If you have any questions for the team or me, feel free to drop them in the comments or ask a question about Channels on Meta. Let us know what you think. 

Podcast logo The Stack Overflow Podcast is a weekly conversation about working in software development, learning to code, and the art and culture of computer programming.

Related

Wooden figures standing in a circle facing each other
the-loop May 26, 2020

The Loop, May 2020: Dark Mode

We received a bunch of requests to share how we use our feedback framework on specific features. We got excited about this, and given that we just released Dark Mode (and “Ultra Dark Mode”), we thought this was a great opportunity to show how we arrived at our solution.
Avatar for Sara Chipps
Director of Product, Community
code-for-a-living April 13, 2020

Socializing with co-workers while social distancing

As we increase our social distancing efforts and have fewer people around us, building connections and socializing becomes ever more important for our mental health. We spend a lot of time at work and a decreasing amount of time socializing outside of it, so turning some of that work time into a social time can serve two purposes. For it to be effective, though, you can’t just push socializing initiatives alone.