Making Basecamp better for discussing creative work, by Conor Muirhead

You asked me how I’d make Basecamp better for presenting and giving feedback on creative work. Here’s how I tackled the challenge.

  • When Jason’s email rolled in, I rolled up my sleeves and created a new Basecamp project.
  • First up was creating a text document where I started thinking through the assignment by writing.
  • I wanted to understand how people are using Basecamp to get this job done today. So I used my imagination, experimented a bit, and leafed through a few example projects to get a good feel for the current state.

  • I identified two core issues with presenting and giving feedback on creative work with Basecamp:

    1. The words describing the creative work are disconnected from the presentation of it.
    2. Feedback on individual creative works is connected to the discussion, not to each piece of work.
  • I took what I had learned so far, and tried my hand at creating Job Stories. I wanted these in place to help provide some good gut checks for my work along the way.
  • With some of my thoughts jotted down, and a bit of research and experimentation under my belt, I pulled out some paper and markers to sketch out UI concepts.
  • With solid concepts in place, I grabbed the HTML + CSS source code from Basecamp and threw it into Jekyll to design and prototype.
  • After seeing some promise in a few key UI elements, it was time to dig deeper and see how the concepts worked across the rest of Basecamp. So I created a few to-do lists to help me methodically work through the major areas of Basecamp that might be affected.
  • I continued tackling all this design work in HTML + CSS, occasionally hopping into photoshop to create an asset. Ideas and features were created as prototypes, and often evolved and iterated on immediately.

Here’s how my work played out across a few scenarios.

Madison

Madison gets a quick team decision

Madison is helping create a new company site. One of her to-dos is to find a great billboard image for the careers section of the site.

After hours scouring stock photo sites she’s put together a handful of options for the careers billboard. Now she wants her team’s input on which one to buy.

She pulls up Basecamp, starts a new message, and attaches the images.

Madison’s message is posted for her teammates to compare the options, comment, ask questions, and make their pick.

Within the hour, Madison gets a few emails letting her know that John picked #3 while the rest of the team’s popular pick was #1.

After reviewing the emails, Madison replies to John’s pick of #3. She asks John what he prefers about it so she and the rest of the team can benefit from his point of view.

A few minutes later John opens up Basecamp to explains his rationale on #3. He also offers that he’s totally fine with the team’s preference for #1.

With everyone’s picks and comments captured, Madison purchases #1 with confidence and continues her work. Thanks Basecamp!

Conor

Conor tells a step-by-step story

Conor’s been working on Scrimped—a side project to make personal finance easier. But he’s been working on it alone and wants some outside perspective from his friend Jim.

He fires up Basecamp to write a walkthrough of how Scrimped works.

As he’s writing he inserts individual images to illustrate key points.

To avoid interrupting the flow of the narrative, Conor uses notes to keep non-narrative remarks as asides.

He finishes his message and triggers an email notification for his friend.

Now the entire story is beautifully presented on Basecamp, and ready to receive feedback.

Since he’s using Basecamp, Conor knows Jim will be able follow the flow he presented, and provide specific feedback right where it’s needed.

Ryan

Ryan gets caught up

Just getting back from vacation, Ryan checks his email and finds a flurry of messages on "Painty stripes". When he opens the first email he sees Jonas kicked off the discussion with a set of images.

Ryan opens the discussion on Basecamp and starts scrolling. He immediately sees nobody loved the black. He also notices that Jonas responded right away with two more sets, this time using a variety of colors. #13 seems to be the favorite.

He’s curious about what drew everyone to #13, so he clicks to enlarge the image. While he’s got that open he checks out the other three images in the set and marks #13 as his pick too.

He scans the rest of the discussion and sees the team landed on #20.

Ryan was able to catch up in a minute or two, and knows he didn’t miss anything thanks to Basecamp’s clear presentation of images and comments in one discussion.

Basecamp just got better.

I noticed designers at Basecamp write the “New Stuff” posts, so I went ahead and wrote a post highlighting the new features I designed.

Thank You!

I’ve loved digging into a few areas of Basecamp, and I want nothing more than to work on the real thing, with the real people.

–Conor Muirhead

Links to every bit of HTML.

Composing messages & comments

Emails

Discussions

Files

Extras