Design

How to design a connected workplace—in a historical landmark

View all posts

At the beginning of 2014, my agency, 383, moved our studio to an unused factory in the heart of Birmingham’s Jewellery Quarter. We exist to help brands be more useful, so it only seemed natural to apply this purpose to our own space.

Here’s the story of how it went, what we discovered, and how we built a more "useful" studio.

We set out to design something harmonious with the building we fell in love with, but modern and connected.

7,000 square feet of potential—and history

Our new home occupied 3 floors and about 7,000 square feet of a larger development called Victoria Works. The complex was built in 1840 and had been converted into a mix of residential and commercial premises during the 1980s. As the English Heritage listing explains: “The building is listed because of its importance in the industrial development of Birmingham and because of the international importance of this first mass production of pen nibs.”

Joseph Gillott, inventor of the steel pen press, had Victoria Works built, and would create a truly global industry from its offices. The works churned out about 150 million pens, so many that “Birmingham” pens were used to write an estimated 75% of the world’s missives in the 19th century!

The smell of soot from the original fireplaces still lingered in the air, hundreds of years after the last fires had been put out.

Thanks to this august history, we were able to look at old sketches and photos of the original factory space as we stood in the very same rooms. Looking at the roof trusses, window arches, and glazing panes, you could clearly see how much of the original character still shone from the space. It felt like we now owned a little piece of Birmingham’s history.

Beneath a patina of dust and disuse stood a remarkably beautiful old building. We fell in love with the industrial-period features, from the traditional cast-iron window fittings to the bowed brickwork, and the smell of soot from the original fireplaces still lingered in the air, hundreds of years after the last fires had been put out.

feet of cables

Planning

We faced an enormous, but exciting challenge: how to design the space to suit 383’s business needs, without losing too much of the original aesthetic. We’d grown used to working in one large, open-plan space, so we needed to adapt not just our workspace, but also our workflow.

We also wanted to bring some of the building’s story back to life as we renovated, so we gave a few nods to its industrial past: leaving brickwork exposed, renovating the windows, and borrowing some of its beautiful typography for our new internal wayfinding system.

Building a connected studio

Next, we had to make myriad decisions about furniture, flooring, and lighting. We thought a lot about how we should use technology to create a more useful experience for our team. The foundation for this was cables. Lots and lots of cables. About 10 kilometers of cable now run around the office, not that you’d know to look at it. (That’s about 6.2 miles, for you Americans.)

cables 2

With this opportunity to build a new office basically from scratch, we particularly wanted to tackle some of the mundane aspects of running a studio space, and take control of the way the building and its services behaved. The first thing we did was to create an API that would underpin new digital and physical services to live in and around the building. The API would act as a platform to interact with connected hardware we have in the office and power some new things we’ve made from scratch.

In essence, the API is like a brain, connecting the nervous system of the building with the heartbeat of what’s happening in the company. Through it we can control a whole array of services already built into the structure and power a host of useful new tools for our team. Using the API as fuel for problem solving, we listed areas we felt could be improved in day-to-day office life and built useful solutions around them. Here’s some more detail on what we got up to…

In essence, the API is like a brain, connecting the nervous system of the building with the heartbeat of what’s happening in the company.

Who’s in the studio?

As the 383 team has grown, we often hear someone in the studio say, “Is X in today?” To answer this question, we built a mobile app for the team. The app talks to a network of iBeacons (low-energy Bluetooth devices), automatically checking in team members when they enter. We also decided to give this digital data a physical manifestation. So we built an in/out board, a Polaroid-clad, Arduino-powered picture frame that shows who’s in, who’s out, and who’s on holiday.

1623BI-in-out-board-original

This staff presence system is also replicated across other services, via the shared API, to provide additional experiences. For example, on the 383 desktop app (Launchpad), we trigger a Facebook Messenger-style popup that lets anyone see who’s in and who’s on annual leave by cross-referencing feeds from our HR software and Google Calendar.

But where are they really?

We’ve also set up the iBeacons to not only show who’s in, but where they are. Makes it a lot easier to find a teammate in our 3-floor, 7,000 square foot building!

DSC01572

A client’s coming in—are we ready?

We get a lot of visitors, so we tried to make this a more useful experience for everyone. Using some new tools, we’ve not only been able to ditch the manual visitor book at reception, but also added the ability to trigger specific playlists on our Sonos system and heat meeting rooms to a comfortable temperature before someone arrives.

Whenever a meeting gets booked, a 383 team member uses our Launchpad app to pick a room, attendees, and a time. Then all this info syncs with our client CRM system and Google Calendar to create the booking. Now, we know everything we need to know, before our visitors arrive, thanks to our API.

1542AM-client-signin-app-original

All we needed now was a way for visitors to say, “Yes, I’m here.” So we built a sign-in app that sits in reception and includes a list of all meetings scheduled for that day, along with the attendees for each. A few taps and you’re signed in.

Plus, the API lets the system automatically notify the event organizer that the client has arrived to our visitor Slack channel. Behind the scenes, we use Lightwave RF hardware to ensure the room’s at a comfortable temperature and queue up a friendly playlist at a sensible volume. This not only saves time, but also prevents anyone entering a walk-in fridge filled with deafening bump ‘n’ grind music.

Is that room free?

Finally, we wanted to encourage our team to utilize studio space as much as possible. We saw that people would often work in 1 place throughout the day for fear of messing up a space that might be needed later for a client meeting. We wanted people to be able to easily see if a room was free as they walked past and encourage them to jump in if it was.

To do this, we wall mounted a small tablet outside each meeting room. Each tablet displays a simple and clear traffic light system to tell the team at a glance if the room was free. But move closer and the UI gives you all the information you need, including when the room is free until and, of course, a quick picker to queue up some music on the Sonos while you’re in there.

We’ve been able to take multiple sources of information and design an experience that’s greater than the sum of its parts.

DSC01578

We’re in … and we love it

After 9 months of hard work by an amazing team of contractors—and our own team—we’re now in our new office! We set out to design something harmonious with the building we fell in love with, but modern and connected.

By creating an organizational API, we’ve been able to take multiple sources of information and design an experience that’s greater than the sum of its parts. Each of the use cases we’ve developed so far have been quick and efficient with a lot of heavy lifting already done by the API itself. We’re looking forward to creating more new experiences and services over the coming months, in the hopes that we can do Joseph Gillot justice too, by continuing to “think, design, and make” in the space he created.

Join over 3 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 3 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 3 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 3 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 3 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.

Follow us