A couple of days ago we launched the new Highrise marketing site. We’ll be posting a lot of design-related articles about the design process — including the unreleased versions — over the next few weeks.

A peek behind the scenes

Today I wanted to give you a peek behind the scenes at an app we built to help us maintain the “Fresh News & Buzz” strip in the sidebar. This element is called out in red below:

Extra Extra

One of the things we wanted to do with the new site was to have a place where we could display current comments, ideas, and conversations going on around the web about Highrise. We’ll be rolling this out to the other product sites as we redesign them as well.

To do this, Sam built an internal app called Extra Extra. Sam will be talking about the technical aspects of Extra Extra next week, but for now I just wanted to show you how it looks and how we use it.

This is what it looks like:

Extra Extra scours the web and Twitter every hour or so for keywords including 37signals, Highrise, Basecamp, etc. It displays matches in a list view. We can then review the matches and select which product sidebar gets which blurb by just clicking the icon.

Some blurbs may be appropriate for multiple sites, so multiple icons can be clicked. You’ll notice the fourth one is selected for both 37signals and Highrise. Once an icon is clicked the entire row turns yellow so it’s easier to spot which ones have already been published. Blurbs that aren’t appropriate are just ignored.

Once an icon is clicked, the item gets published to the appropriate product’s feed. Right now the Highrise site is the only site with the sidebar, but we included all products and the 37signals logo (for the 37signals site) so we can get into the habit of selecting content for those sites too. Once the new sites launch we’ll already be ready with content.

If we spot something on the web that Extra Extra doesn’t pick up we can add it manually by clicking the “Add a news item” button at the top.

How it works on the sites

In the sidebar we pop in a DIV with some Javascript that looks like this:

      <div class="extra_extra_news" count="8">
        <script type="text/javascript" src="http://news.37signals.com/feeds/highrise.js?no_expire"></script>

The Javascript pulls the appropriate feed from the Extra Extra app and the count=”8” tells it how many entries to display.

More soon

We hope you enjoyed this little peek behind the scenes at Extra Extra. Sam will be following up with technical details soon and we’ll have a lot more design related posts about the new Highrise site soon.