Building in public

Published Jun. 15, 2020 by Andy Leverenz in Product

Bip mvp

Today marks a successful version 1.0 MVP of Compose. I wanted to take a second to reflect and celebrate. I hope to continue the journey in a more public manner through this blog. Through all types of media I have commonly found great help from other founders and companies who write or share about their journeys. To future makers and entrepreneurs, this is for you.

On building in public

Building in public has been a hobby of mine since starting work in the internet space. About 5 years ago I started a publication called Web-Crunch where I authored blog posts and screencast tutorials related to design and development. I hit publish almost weekly and am still contributing today. By learning in public I was able to establish a decent following on YouTube. As of today I just surpassed 10,000 subscribers. Hitting publish taught me how to be consistent, present, and thoughtful for those who took an interest in my content. I wish to do the same with Compose.

The trigger

Setting out to build Compose happened fast. I had just switched employers and dove into a new way to work with a team. The experience was unbelievably refreshing and almost completely asynchronous.

Coming from the world of real-time communication with tools like Slack and design tools like Figma I had built up the anxiety of always being "online" even though I worked remotely. It wasn't a good fit for me and at the time I couldn't pinpoint what the issue was until I switched.

When this switch occurred I wanted to find a way to share the freedoms I felt with others. I dove into a new project (now known as Compose) to consider changing the way teams communicate internally. Through some of my trials and tribulations, I built an app to solve my problems. Compose was born as an asynchronous-first long-form communication tool.

Compose itself isn't meant to take the place of real-time applications. You could consider it a great companion to those tools. The goal of the software is to provide a better space to formulate ideas. Once those ideas are shared, a discussion can then begin to provide a more meaningful communication loop between multiple people.

With a focus on teams Compose is meant to be a place to bring your small to large-sized team members together to better discuss new ideas, problems your facing, and so much more.

The stack and UI

To move as fast as possible we built Compose using the Ruby on Rails framework. This just so happens to be my favorite tool of the trade to build web apps anyways so it only made sense to choose it. Ruby on Rails is magical in the fact that it allows a single individual to do what teams used to be hired to do in a fraction of the time. The first commit to version control was February 27th, 2019.

I chose Tailwind CSS for the front-end styles. This is another framework that is amazingly productive and scalable when it comes to CSS.

Typography

As a designer first I love typography. I originally struggled to find a good selection of parings when it comes to headings and body copy. Ultimately, I landed on system fonts for the body copy and Inter by Rasmus Anderson for the headings. You might recognize this typeface from Notion if you use that tool.

And finally some screenshots in its current state

Teams by default

Any new account on Compose is a team by default. You can have a personal account or a team account depending on how you want to use the tool. Because we are focusing on teams it's designed to be used with others. This is all to say you can just as easily use it for more personal long-form writing. We're still in the early stages of figuring out how to price the tool. Initially, it will be an invite-only style of onboarding during the beta period. This period will be free to those interested it out. To get an invite you can subscribe here.

A user is not limited to one team. You can be apart of as many as you wish. You can even create multiple internal teams for your company if that's how you would prefer to use Compose.

teams UI within a compose account View full size

Boards

Upon signing up for an account a new user is prompted to create what we call Boards. Think of these similar to a Trello board but niched to a topic within a larger hat (this could be your company or project). Boards could be used for projects, internal teams, or anything else you fancy.

Below is how we're using Compose internally for Compose itself. The project has just kicked off at this stage.

Compose boards UI View full size

Customizing boards

Boards can be customized with colors and metadata. We hope to expand on these customizations coming up that might include a dark mode, typography selection, and more.

Customize Compose boards View full size

Board dashboard

Within every board, you are greeted with messages. Messages are presented in groups relative to their given status. Right now we support Published, Draft, and Archived message statuses. If any of those are present besides Archived, you will see them display here. Unread messages take priority in the hierarchy of the message feed.

The sidebar to the right of the message pane displays what contributors are a part of this board. You can optionally configure who should and shouldn't be granted permissions/visibility to this board. Additionally, there is a helpful historical activity feed for the board giving you a high-level status of what's been happening across the team.

Board dashboard View full size

Messages

Creating a new message within a board takes you to the following experience.

new message experience of Compose View full size

Here you can start typing your long-form thoughts and ideas. For now, we use a trimmed-down approach to formatting using a minimal WYSIWYG editor. Adding attachments can be done via the editor or by dragging and dropping those into the message editor itself.

We wanted to focus on the writing experience here by removing unnecessary distractions. Borrowing from tools like Basecamp or Microsoft Word/Apple Pages, we wanted it to feel almost like an old fashioned typewriter experience. This can and will likely change over time! As a markdown fan myself I hope to incorporate support for that as well.

Published messages

Published messages start to ignite the power of Compose and its long-form first mantra. When someone posts a message it prompts other team members to collaborate by responding directly below the original message. This pattern is timeless in the world of the web. Maintaining context is our primary goal here. You might have a message with several responses but you can be sure there's a real source of truth for every message that is created. Chat-based tools just don't cut it here. Your conversation from say a week ago is long gone and is tough to find again without spending extra time searching or even trying to remember what to search for.

screenshot of a message on Compose with responses View full size

A message can have any number of subscribers. You get to dictate who gets notified if a message receives additional responses. By default, team members who have access to a given board display as possible subscribers.

Responses

Responses (commonly known as comments) can be published below every given message. Each response can be responded to in one additional layer of nesting. This experience is inspired by Slack with their nested thread experience. We believe threads can be useful but also complex therefore, threads only go one level deep.

Starting a thread happens when a new response is born on a message.

starting a thread on a Compose response View full size

Clicking Start thread reveals a new response form. You can very quickly draft up a response or spend some time crafting a meaningful long-form response here. Unlike chat, there is no pressure to respond immediately.

drafting a new response View full size

Finally, upon a successful response to a parent response, a threaded experience is born. A thread is hidden by default but can be toggled into view. Any time a new response is recorded the last responder gets displayed on the toggle UI.

new threaded response published View full size

Toggling the state of the thread reduces the need for too much screen real estate waste. The best part is that all responses of a message are still within the context of the original message.

new threaded response published View full size

Reactions

What would a modern communication tool be without emoji reactions? Of course, we had to include emoji. Both messages and responses can be reactive. Clicking the 👍 (thumbs up) emoji icon on the bottom left of every message or response displays an emoji picker with full search capabilities. Simply clicking the emoji you prefer renders it inline. Add as many as you like! Removing an emoji is as easy as clicking on any emoji reactions you previously added.

Emoji reaction support

Audience

As it stands I have a fairly decent audience on my other projects. Unfortunately, that audience isn't quite my target market for Compose. This means I have to essentially start from scratch to gain interest from more people over time. Blogging is my initial tactic to get some awareness spread. This approach is the long game but one that continuously earns dividends over time.

I'm brainstorming more ways to get attention without doing big flashy launches on Product Hunt for example. I don't think being in beta is a good time to "launch" a project such as this. We'll likely be taking the slow route hoping for organic traffic over time. I plan to do some cold emails to existing teams to also hopefully gain some potential leads. Do you have any tactics that work best for you? (let me know in the comment section below)

I've heard and read that this part is the hardest. Building the product is the easiest and the most fun. What I've shown you here is only the tip of the iceberg of what's possible with Compose. Expect to see more updates as they come. Look for more articles like this periodically!