How might we present an entire suite of AI-powered features? How could we accomplish the task of communicating its immediate value as well as what could be possible in the very near-future?
To answer these questions we created the Tailor brand, and this thread tells the story of how it came to life.
I. Character Design
Ever since we launched early access, Tailor could be seen as a bot that greeted every new sign-up with a set of threads to get them started.
They represented Threads in the same voxel art style as our avatars, and this allowed us to design a range of other bots for different purposes.
I went on to explore what Tailor could look like when powered by AI.
The 80's computer look was swapped out for something closer to the Portal video games. I decided on keeping the form, face, and even the jetpack.
It's cool to be able to fly around.
We discussed how the website could communicate our new product release, so I created this concept demo in Keynote minutes before a meeting.
It also explains why this wasn't fully animated.
Tailor as a character seemed like it was in a good state, but something felt off.
The focus up to this point was almost entirely on the outward physical appearance of a bot. But if we're talking about AI, then we're talking about the internal power that drives the actions.
So in an effort to simplify things, I wondered if we could separate Tailor's mechanical body from the core unit of Tailor's intelligence.
II. AI stitched into Threads
Since the beginning, we've been very intentional about the role of AI within our product. Instead of layering it on top of the experience, we spent a lot of time ensuring that there was enough value for it.
Our treatment for this had similar intentions. Tailor had to be a natural fit within the rest of the brand while conveying a sense of power that wasn't there before.
The Threads logo represents the product, which is the sum experience of writing threads and messages—communicating with your team—an arrangement of blocks.
III. Power and Light
AI features in Threads represent a powerful new way of working. The ability to analyze hundreds of lines of chat and summarize activity and next steps into a useful list was our first a-ha moment, proving that Tailor's role as an assistant or companion was a bit like a guiding light.
The themes of "power" and "light" led to the way we styled Tailor and the way they appear outside the product.
If you've watched any of the Iron Man movies, then you're familiar with this fictional piece of technology. The arc reactor is a vivid source of power.
"The power of the sun, in the palm of your hand!" - Otto Octavius
In comic books and movies, anything powered by an arc reactor glows an intensely brilliant blue and white light.
Since objects that glow this intensely can convey power, we applied a few gradients and glow effects to a solid colored block.
Tailor dutifully follows along across tabs and surfaces in Threads. Like a companion in the darkness, they shed light on what is important in a notification, thread, or message.
We decided that the light Tailor emits should be present in the brand whenever possible, influencing the way we create shadows, reflections, and gradients.
IV. Good morning, Tailor
In the instances where Tailor "works" to read and analyze what is asked, there is a particular feeling of sentience. This magical feeling that software has come alive was something we wanted to convey, and decided to feature in our launch video.
As our companion wakes up, the camera pulls slowly back.
I wanted to open with a close-up because it's a good way to focus on what Tailor is made of. What is this block? Is it made of glass? Where is the light coming from?
If you can imagine AI code working within a product, you can understand why we chose to have the light source within the block.