Last week I dropped into an online auction to see what was for sale.

The auction house uses the LiveAuctioneers software/service to conduct the online auctions.

This is what I saw:

At first, it’s easy to unfairly judge this UI by its cover. There are a lot of font sizes, colors, and shapes competing for your attention. It’s also clear that this design isn’t going to win any type direction awards.

But I ripped off my designer hat, gave it five minutes, and followed along as dozens of items were auctioned off live. I even jumped in on a few and ended up winning a couple.

And I have to tell you, this is really good interface design.

You may not be able to tell from looking at the still image I posted above, but if you’re in there, watching the items go up for bid, watching the bids flow by on the right in real-time, watching the auctioneer on live video, seeing the big yellow flags pop up when an item is about to close, and having a big fat red button that you can click to instantly place your bid, it’s all very clear. There’s a lot going on, but it’s all in the right place at the right time, and it worked flawlessly. I was very impressed.

Yes, it could look better, but it works great. And the works great part is the harder part of the UI to get right. A real-time live auction is a complicated task, and LiveAuctioneers made it work well with no learning curve. I look forward to using this service again.

Today we announced a brand new feature in the all new Basecamp called “Everything”.

Everything lets you see all the discussions, to-dos, files, text docs, and forwarded emails across all your projects on a single page.

It’s especially useful for those times when you know a file was uploaded, or a discussion was going on, but you don’t remember which project it was in.

Now you can just go to Everything, click “See every single file”, and now you can see all the files across all your projects in your entire Basecamp account on a single page. Huge time saver.

How the design came together

Here’s a link to the discussion where we discussed the design. You’ll see a variety of directions, feedback, revisions, more feedback, and then the final batch of ideas from which we picked the winner.

A quick decision

Here we made a quick decision regarding how this feature impacted the navigation.

Some debate

Here’s a thread where Ryan, David, and I are discussing where to include project names. There were some different opinions, we ended up trying the design without the project names, but in the end their absence was too much, so we added them back in.

The internal announcement

When the feature was done, David made the formal announcement to the whole company so everyone know what was coming.

Browse the whole project

Here’s a link to the whole project. Is yours to browse.

We hope you’re enjoying these backstage looks at how we use Basecamp to design and develop Basecamp. More soon!

Back in 2003, I wrote a post about designing the blank slate. BTW: The web-based application mentioned in the post was the original version of Basecamp which wasn’t released until 2004.

The blank slate is the initial state of an application right after someone signs up. It’s blank, there’s no data, no photos, no content at all. A bad blank slate is like someone opening the door and just staring at you uncomfortably. A great blank slate is like someone opening the door, smiling, and warmly welcoming you inside.

Designing the blank slates for the all new Basecamp

We’ve been obsessed with the blank slate since the first version of Basecamp back in 2004. So when we designed the all new Basecamp (the 2012 version), we wanted to make sure we paid close attention to the blank slates.

We captured all the work that went into the blank slate designs in a Basecamp project called “Blank Slates”. We’ve made it entirely public so feel free to poke round. I’ll be highlighting some interesting parts below.

No projects, one project

Here we discuss what the projects list should look like when there are no projects. We referenced the rough sketch concept we liked from Sortfolio (then called Haystack). And here’s a related discussion about what the page should look like when you have a single project, no more, no less.

Fine art

Here’s a discussion we had about a “painterly-style” brush stroke on the blank slates. We saw the blank slate as an opportunity to “smile” at our customers with friendly colors and comfortable shapes. A brushstroke felt good, but we wanted to try on a few different styles.

A blank project

We struggled with how a blank project should look. In fact, we didn’t come up with the final design you see today until a few weeks before launch. But, here’s a particularly meaty discussion that shows a bunch of early design concepts.

No to-dos

What should it look like if someone doesn’t have any to-dos? Here, Scott and I discuss a few ideas and designs.

Designs galore

Want to see every design, iteration, and concept we discussed? They’re all on one page in the all new Basecamp.

Relive the entire project, one day at a time

One of the great new features of the all new Basecamp is the ability to page through an entire project one day at a time. This is especially useful if you’re out of the office, out sick, or otherwise too occupied to pay close attention to a project every day. Just sign in to Basecamp, click the Catch Up link, and page through the days you missed.

More public projects soon

We hope you’re enjoying these Backstage looks at how we used Basecamp to build Basecamp. We’ll try to post one a week for as many weeks as we have projects to share.

Basecamp is pitched as a project management tool, but it’s super useful in a variety of other applications, too.

Projects aren’t just things with beginning and ends. Sometimes, a project is perpetual activity – something that starts but continues instead of ends. At 37signals we have a number of never-ending projects in Basecamp including a company “Newsroom” where we post and discuss company-wide announcements.

A project as a collection of inspiration

We started a Basecamp project to be the definitive place for designers at 37signals to share inspirational things they’ve run across. It could be great copywriting, a fantastic advertisement, an interesting animation, a beautiful object, whatever – if it inspires one of us we want to share it with all of us.

We keep these things in our Designers Clubhouse project. It’s a little project for our design team to share the things we see that make us go “wow”.

Internal discussion, too

A few weeks ago Mig was putting a presentation together about the design culture at 37signals, so he posted a message in the project asking each of us a series of questions. We all responded with individual comments, and now all that feedback is gathered up in a single place, centralized and stored forever. Imagine having to keep all these answers as separate emails… What a mess! Basecamp cleans things up and keeps it all together.

Follow along with our Designers Clubhouse project

We’ve made the Designers Clubhouse project public so anyone can follow along. It’s a living, breathing project so check back often to see what we’re sharing.

Want to start your own collection project?

If you don’t have a Basecamp account, sign up today for a free 45-day unlimited trial. Take it for a spin, start up a few projects, and see just how creative you can be.

Last week we shared a behind the scenes look at how we used Basecamp to design the new export feature. This week we wanted to share the Basecamp project we used to design and develop the Basecamp calendar.

The Basecamp calendar

The Basecamp calendar was the last major feature we designed before releasing the all new Basecamp to the world. I wrote a bit about this in the April issue of my my monthly Inc. column.

Kicking off the project

We kicked off the project back in December with a series of sketches on the chalkboard. We then uploaded those sketches to Basecamp so those who weren’t in the initial kick off session could see what was discussed/sketched.

Initial concepts for adding an event

Here’s a post from Scott sharing some of his initial design ideas for the new event bubble. As you scroll down you’ll see the discussion involves feedback from a few different designers. Some feedback is purely text, some are questions, and others are design “volleys”.

Interacting with the UI

Here’s a thread that starts off with a screencast showing how the UI would work. We often share screencasts when designing UIs so people don’t have to imagine an interaction. The fewer abstractions the better. A screencast is direct and direct is better.

“Involvements”

One of the trickier parts of the calendar UI was figuring out how to add people to an event. And did adding someone to an event mean they were notified about the event or were they responsible for the event? Here’s a discussion where we started to hash this out.

To sheet or not to sheet

Since the calendar is a “global” item (not part of any specific project), we discussed if it should live flat on the background or if it should live on a white sheet like a project. This discussion ended with punting the decision down the road – we wanted to see real content on the calendar before making the final call.

Creating a new calendar

Here’s a meaty discussion with ideas, screenshots, copywriting tweaks, and sketches relating to the UI for creating a new calendar. You’ll see how most discussions about design include a design. Design discussions always benefit from show and tell.

All the discussions in one place

One of the great things about the all new Basecamp is that it keeps all the discussions about a project on a single page. It doesn’t matter if the discussion starts as a message, or a comment on a to-do, or a new design idea, or an event on the calendar – if there’s discussion about it it shows up in the Discussions area. In this project there were 116 separate discussions in all.

All 208 images, files, and movies

Here are all 208 file attachments in the calendar project. You’ll find screenshots, prototypes, screencasts, and sketches.

One “feature”, 180 completed to-dos across 29 lists

And lastly, here’s the nitty gritty – 180 completed to-dos across 29 lists.

More soon!

We have dozens of additional projects we’ll be sharing with everyone over the next few months. Stay tuned for more inside looks at how we used the all new Basecamp to make the all new Basecamp.

After fielding over a dozen offers for Sortfolio, we finally came to an agreement this weekend with a couple of entrepreneurs who will be the new owners of Sortfolio.

This is big news for our Sortfolio customers. Back in May we said we’d either be selling Sortfolio for $480,000 or retiring the site on July 1. And now it’s all good news: Sortfolio has been sold to a great team.

This means Sortfolio lives on!. Sortfolio’s unique visual search will remain the best way for web designers to find clients and clients to find web designers.

We’ll be transitioning the site to the new owners over the next couple of months. We’ll post more details once the transition is over. There will be no interruption of service for current customers, and we’ve turned signup back on so new customers can list their web design firms on Sortfolio.

We’re especially happy that Sortfolio’s found a new home because over the last week or so we’ve been getting emails from people saying how important Sortfolio has been to their business. Emails like:

...All of my leads and livelihood flow through Sortfolio. It’s how I pay for my health insurance, groceries, mortgage, etc…

and

...I can honestly say that Sortfolio changed our lives. Sortfolio brought in the best leads ever and we were able to crawl out from the financial hole we landed in. It actually does that even now, on daily basis.

So here’s to a second lease on life, Sortfolio!

A lot of people over the years have asked us how we use Basecamp to manage our projects and collaborate at 37signals.

Knocking down the wall

We’ve given tours, we’ve shown screenshots, we’ve shared excerpts, but that’s like peering through a tiny hole in the wall. You’d have a much better view if there was no wall at all.

So we built in a special feature that’s unique to our Basecamp account that allows us to make one of our projects completely public. It’s read-only, it can’t be changed, but you can see all the discussions, to-dos, files, etc., just as they happened.

The project

Whenever we work on a new feature in Basecamp, we create a new Basecamp project. We keep all the discussions, to-do lists, assignments, relevant files, relevant text docs/notes, and any related schedules in the project.

Recently we added the ability to export your Basecamp projects and files into a tidy, self-contained web site you can download to your computer and view in your web browser. This way you can take your data with you, make a backup, or send a copy to a client.

So to get started we created a new project in Basecamp called “BCX: Exporting”. Note: We put “BCX” in front of any new project that’s related to the all new Basecamp. This way, at a glance, we know that this project is for this product, and not for something else we’re working on.

Here’s a link to that project.

You can see all the discussions we had around the export feature. Here’s a meaty discussion (38 comments) that involved ops, dev, and data. And for the designers/writers out there, here’s a design discussion about a specific to-do.

Every file and screenshot we shared in this project is stored on a single page. And you can see a list of every to-do we completed before deploying the feature.

And if you want to see exactly what happened, day-by-day, check out the super-useful Catch Up view. You can step back in time, one page/day at a time. For example, May 22nd was a particularly busy day with 10 people contributing feedback to the project. And May 9th saw a nice handful of important to-dos completed by Jeff.

Lastly, here’s an FAQ that Jeff put together for the support team. It’s super helpful to use Basecamp Text Documents for things like this.

More public projects soon

We hope a look at one of our real Basecamp projects helped give you an idea how we use Basecamp to centralize discussions, files, to-dos, and decisions.

We’ll be opening up more of our projects to public view in the coming weeks. We’ll share different kinds of projects too – some heavier on the design side, some heavier on tech, etc.

After seeing this, do you have any questions about how we use Basecamp? We’d be happy to share any tips/tricks or best practices we’ve come up with along the way.

When you design for the screen, it’s easy to think the screen is where you should go for inspiration. It’s definitely one place – there are some amazing people doing some amazing work in pixels. But you’d be cheating yourself if you only looked to your own industry, or medium, for inspiration.

I’ve always found inspiration looking at parallel industries. I love looking at physical objects for interface design inpsiration. Designing interfaces for physical interfaces requires more discipline because, unlike the virtual world which has no shape, edges, or boundaries, the physical world has strict limitations. How designers deal with those limitations and tough choices makes for a wonderful library of ideas.

I wanted to start our own 37signals library of physical interfaces from which we could draw inspiration. So I hired Object Design League here in Chicago to seek out, source, and begin building our physical interface library.

The initial collection was just installed last week. It’s near the entrance of our office so you can’t miss it when you walk in:

There are buttons, measuring tools, indicators, timers, and lots of other interesting physical interfaces.

We put together a short video highlighting the start of the collection. Over time we hope to expand the collection and find more inspiration for manipulating the physical, and virtual, world.

Back in 2008 we shared some of our workplace experiments including the four day work week (still in effect May – Oct), funding people’s passions (we’re still doing this, too), and discretionary spending accounts (everyone still gets a company Amex they can use for anything work related).

This June we’re trying something new.

This June will be a full month of free time to think, explore, mock up, prototype, whatever. People can go solo or put together a team – it’s entirely up to them. This is a month to unwind and create without the external pressures of other ongoing projects or expectations. We’re effectively taking a month off from non-essential scheduled/assigned work to see what we can do with no schedule/assignments whatsoever.

Some companies are famous for their 20% time where employees get 1/5th of their time to work on their own projects. In spirit I like this idea, but usually it’s executed by carving out a day here or a day there – or every Friday, for example – to work on your own projects.

But all time isn’t equal. I’d take 5 days in a row over 5 days spread out over 5 weeks. So our theory is that we’ll see better results when people have a long stretch of uninterrupted time. A month includes time to think, not just time to squeeze in some personal work around the edges.

The culmination of this month of free work time is Pitchday – the first Thursday in July. That’s when everyone will get a chance to pitch their idea, mockup, prototype, or proof of concept to the whole company. The better the pitch, the more likely the project will happen.

Some people have already paired up and recruited others to work on an idea together. Some are going solo. And some are taking the time to work on a combination of smaller things they’ve been meaning to work on for a while.

I’m really excited to see what people come up with (and share what I’ve come up with, too – David and I are working on something together). Hopefully our customers will see the results of some of these pitches over the coming months.

We’ll report back if we have anything interesting to share.