Behind the Brand: Creating Twist’s New Visual Identity

How Doist’s brand designers collaborated asynchronously across time zones to bring a bold vision to life

Illustration by Margarida Mouta

In June 2017, we first launched Twist to the world promising a fundamentally different way of working together. Twist was released alongside a complementary visual identity that emphasized calm — cool blue tones, clean sharp lines, and contemporary-style illustrated figures.

Above the fold, we gave our guarantee: “Twist is the communication tool for teams who believe there’s more to work than keeping up with group chat apps.” On a fundamental level, this is still our promise with Twist 2.0. But in the last four years, almost everything else has changed.

A global pandemic has brought on a rapid shift to remote; the future of work arrived faster than we could have imagined. The world caught on that we’re in a state of constant distraction; we’re having a collective conversation on the right to disconnect. Terms like “Slacklash” and “Zoom Fatigue” entered the lexicon; knowledge workers are now ready for a different way to work.

The onset of the remote work revolution meant an opportunity to rebuild Twist from the ground up — improving our features, bettering performance, and adapting our positioning — to introduce asynchronous communication to a new cohort of companies.

The ideas and principles behind the product decisions in Twist 2.0 go against many of the concepts people have grown to expect in a workplace communication tool — from synchronous line-by-line chat to status indicators. In fact, the best way we’ve found to explain many of the unique aspects of Twist is by contrasting them directly to how other tools approach the same problem.

Over the span of several months, our marketing team set out to create a new visual design for Twist that was just as radical as the product. In the same way that Twist is different, we aimed to have a brand that stood out from the crowd and found our way there through three core design principles: boldness, async, and flexibility.

The evolution of the Twist brand

On boldness

Twist is making a bold commentary on a better way of working together — asynchronous, calm, transparent. The branding we created needed to complement and amplify those statements.

As we got closer to establishing the final brand, we got more and more feedback from Doisters that they wanted us to be more bold in the design style we were developing.

Our website layouts were very simple, usually with only one section visible at a time and everything centered on screen.

We got comments like “I miss some bolder and more interesting design elements that catch your eye and make you stay on the page,” and “It definitely looks new and premium, but we shouldn’t be afraid to be a bit more BOLD in our design.”

Anaïs, my fellow Brand Designer, and I felt like we were being bold in the brand’s art direction, but the repeated feedback made me question how successful we had been with our choices.

I started to contemplate the definition of boldness. What does it mean to be bold? I realized it’s a word that can mean different things to different people. The connotations I personally have for the word when applied to visual communication are aspects like vibrant colors, elements that take up a lot of visual space, (literally) bold font weights; all of which are common treatments in Western contemporary digital design. But those are only contextual associations, treatments that are considered bold because of the context the design and the viewers consuming the design are a part of, not absolutes of boldness.

What does it mean to be bold?

I also realized that what is considered bold depends on the goal of the brand. If your product is designed to stimulate the viewer’s senses, as might be the case with a fun new social media app, then perhaps the styles I described above would be bold in an appropriate way. But Twist is meant to facilitate calmer, more thoughtful communication: interaction with care and consideration. Being loud in the visual style (and as a result, loud in the expression of the brand messaging) wouldn’t fit the goals Twist was designed to address, thus failing at communicating to a potential user what Twist could help them with.

I eventually went even further, thinking about boldness not in terms of specific visual treatments, but in how those choices make a statement about the brand. The Twist app’s product decisions are unexpected in our current world of work communication tools; the branding should also be unexpected. The final branding has a refined, spacious look that we developed with the goal of letting the app design and marketing copy speak with a clear voice, while saving room for illustrations to create more interpretive meaning.

Left: Slack’s homepage; a very dense layout with many elements vying for your attention. Right: Twist’s homepage; spacious, with only the elements we absolutely felt were necessary to communicate our messaging.

I also realized that in order for our brand to speak with a bold voice, we needed to practice restraint in our utilization of the more characteristic elements. For instance, we are using an expressive typeface, Tiempos Headline, for our display headlines. For the typeface to maintain its emotional appeal, we couldn’t use it everywhere. At smaller sizes we chose to replace it with the Text version of Tiempos, which speaks in a calmer voice with less character, and then paired both versions of the typeface with a sterile sans-serif, Inter, to balance the tone with which we communicate the radical ideas of Twist. Choices like this kept the Twist brand from being a reskinned version of the “I’M BOLD” image from above, just swapping out the bold sans-serif with a narrow serif instead.

Left: Using Tiempos Headline in all places we need a heading element makes the typeface lose its punch and makes small text harder to read. Right: We swap in Tiempos Text for the smaller heading, and use Inter for more minor headings such as buttons and input labels.

With a more thought-out understanding of boldness, I considered whether the word could apply to the art direction we were forming. Twist’s branding is intended to not meet people’s expectations for how a work communication app should present itself, and that is a bold choice. Bold in the sense that it intends to subvert expectations. Bold, despite — or rather, with the help of — its restrained visual style.

On async

The team’s feedback about boldness pushed me to seek an understanding of why the choices we were making felt right to me. It was a helpful practice that encouraged me to challenge my assumptions and think deeply about where my opinions came from. At Doist, designers make a lot of choices based on our intuition and prior experiences, but that approach makes it difficult to reconcile conflicts of opinion, experience, or taste between folks who care deeply about the decision’s implications. Who can say whose taste is better?

We ran into such an instance when choosing a new brand color for Twist. The original Twist color was a very vibrant blue that the brand designers felt was no longer appropriate for the product’s values and the emotions we wanted people to feel when using it. After many iterations, we proposed to the wider design team a teal color that felt more appropriate to us, with its more subdued vibrancy and atypical hue. Shifting the color more towards green achieved the calmer feeling we were pining after, and paired well with the almost-literary visual style we were developing. After much discussion we all agreed on the exact hex value that would represent the new brand.

The new brand color is more muted than the previous, without losing its freshness. We also tightened up the logo design in a few places. Can you spot the differences?

Following this decision, Stijn, the product designer who led the visual redesign of Twist needed to adapt the new color into the product. Buttons could easily use the exact brand color, but other elements, such as the backgrounds of navigation items and the sidebar needed to use lighter colors based on the brand’s hue. They did an exploration and presented their work in a Twist thread for our feedback.

The new color looked great in the app, but to my tastes, some treatments became too vibrant and not complementary to the aesthetic we were attempting to cultivate in the branding. I felt strongly about my perspective and thought it would be valuable to share it. And…

The product designer disagreed! To their tastes, the treatments I preferred were dull, and sucked the life out of the product. It seemed like we had a serious conflict of taste.

An asynchronous debate over brand colors ensued.

Async communication to the rescue!

Async communication is when interactions in a discussion are spread out over time, allowing the participants to put more thought into their responses, rather than encouraging them to reply urgently. Because we work asynchronously at Doist, I had the chance to put care and consideration into my response, rather than quickly replying with “No, I think you’re wrong!” to make sure my voice was being heard.

I duplicated a frame in the file they were working on, and explored an alternative on my own that I thought blended the best qualities of both our suggestions. Through that process I began to think deeper about the things we disagreed on. It wasn’t just that I preferred the effect of the less saturated colors and they preferred the effect of the brighter ones, we were at odds in our values. What I was valuing in my exploration was the calming effect muted colors would have on someone’s emotion while using the app. Stijn was valuing the effect saturated colors would have on the visual contrast for interactive elements and keeping the app feeling lively.

Both incredibly valid priorities, and a solution that addressed both considerations would surely be the “right” approach.

I shared my new exploration in the thread where we were discussing it, explaining the understandings I now had and the factors behind my new suggestions. A couple days later they responded, and we went back and forth like this until we were able to reach a great compromise.

By allowing ourselves the time and space to consider each other’s perspectives and try to accommodate them, we reached a mutually agreeable solution that took into account both people’s values. Beautiful!

A Twist thread gave us the time and space to exchange feedback and settle on the right solution.

By designing Twist, in Twist, we were able to experience first-hand precisely what we want other teams to: the power of asynchronous communication in making collaboration and decision making easier. Taking an asynchronous approach to tough decisions like this allows anyone with an idea, and the time to explore it, the opportunity to engage productively.

But going through the process can take a lot of energy. Writing out your thoughts, digging deep to understand your preferences, seeking an understanding of others’ perspectives…it’s a lot. It feels easier to get on a video call and make a fast decision in-person.

Yet, we learned that faster ultimately doesn’t mean better.

In one instance, we were trying to decide on the typesetting for a particular layout on the homepage. The brand designers had been struggling for weeks with how to style the text in this section, and we wanted to discuss it with the wider group.

We tried an exhausting number of ideas and prepared our top choices to talk through with the team. The next day we got on our weekly project update call and shared the conundrum. Very quickly, the group concurred that one of the options we proposed was the best solution, and we moved on to other discussions.

Later that day two people on the team left comments saying that they saw challenges with the solution we chose but didn’t have the words to express why in the in-person meeting. We considered their feedback, and it led us to explore new, more creative solutions that we hadn’t thought of previously, and the final treatment on the website is stronger for it.

I am grateful that those folks spoke up, and it was a reminder to me that just because it can feel very convenient to make decisions in a synchronous way, doing so has the potential to exclude the perspectives of people who find it difficult to object in public settings or who just need time to formulate an explanation of their opinions – an accommodation to which the real-time nature of meetings does not lend itself.

Asynchronous communication can feel slow and frustrating at times, but in my experience with this project and on the whole at Doist, it’s a more equitable way to have conversations and make decisions. When more voices are heard and people have the time to think about what they hear, we make better, more considerate decisions. And who doesn’t want that?

On flexibility

A creative process is rarely a straight line. An idea you loved yesterday can look like garbage today, and a spark of inspiration can get you further in a day than you got in the last week. In our brand design process for Twist we were heading in a straight line for a while before making a sharp turn.

We were developing the brand positioning using web design to explore how we told Twist’s story and communicated its value to potential users. At first, we were excited to position Twist against Slack. It made sense — most people exploring a new communication tool would be familiar with Slack, and drawing comparisons between the two would be an easy way for folks to understand how Twist is different.

Over the course of about a month, our product marketers, writers, and brand designers worked collaboratively to develop the concept, using animation to simulate the stress of communicating in Slack and the calmness of using Twist, working towards what we would inevitably share with the world.

With one comment in Twist, we pivoted our brand direction entirely.

Then, with a single comment, everything changed.

Neil, the product marketer leading the project had contemplated our approach and felt that we were selling Twist short; we ought to be bolder and try something different.

So we did! We completely pivoted direction and formulated a new positioning drawing a connection between Twist and the burgeoning asynchronous communication movement.

Looking back, I’m grateful that we were able to be flexible and change our direction. I’ve never been through a branding experience where after investing so much time into one specific direction we were able to pivot like we did for Twist. What I think was different about this experience was we gave ourselves plenty of time (six months, start to finish) and treated every creation we had as an exploration.

The absurd number of pages in our exploration Figma document.

By constantly “exploring,” we brought a playful mindset to our work. We were simply trying ideas, playing around with them to see if anything interesting happened. There was no foul if an idea didn’t work out, and I observed that people had less attachment to their ideas when the group agreed they were no longer appropriate. Every idea was an opportunity to learn more about the problem we were trying to solve, the insights of which we would take with us to the next idea. As a result, we weren’t too set on the original idea when it came time to shift.

I invite you to treat everything as an exploration the next time you’re going through a creative process. It’s a healthy mindset that helped us create something we’re proud of and that will hopefully connect with others.

The very same design principles that we used to craft Twist’s visual identity — boldness, async, and flexibility — are the same product principles found in the product itself. Twist is bold, ignoring what’s currently on the market and defiantly forging a better way forward. Twist is async, rejecting presence and embracing calm. Twist is flexible, customizable to teams of any make-up or mission.

As designers, much is said about how we shape products and experiences. Less is said about how products shape us. Using Twist for years before the re-launch, experiencing the difference a different work tool can make, imbued us with its qualities and enabled us to start something new from scratch.