⟵ back to the overview

Showcase · Website relaunch Munich Technology Centre

How to explain
a building?

|Reading time: 5 minutes

Five floors, eight wings, up to 80 startups, meeting rooms, a lounge and a lively community. On top of that, the website has to answer the tenants’ big questions: where should I go for lunch today? The Munich Technology Centre has a lot to tell – and that left us with the challenge of showing all of it without anyone having to search for long.

How we work

Listen first, then build. And then start over.

We work with a human-centred, iterative process following DIN EN ISO 9241-210: first we get to know the people who will use the website later. Then we build prototypes based on their requirements and gather feedback – until the solution meets every requirement.

1Understandthe context 2Specifyrequirements 3Developsolutions 4Evaluatesolutions
The three office sizes Starter, Growth and Scaleup, furnished one after another
Ground floor of the MTZ at night, with the video room and conference area on the first floor

“When investorscome to see us, theoffice has to keep up.”

Starter, Growth, Scaleup: three office sizes that grow with you – each one shown furnished.

“Honestly, I only usethe website to bookmeeting rooms.”

Every room shows up where it actually is in the building – and can be booked right from there.

“Anything we have tomaintain by hand is outof date in three months.”

Menus, departures and startup news come in on their own. Food trucks, events and rooms are managed by the team in the backend.

“Honestly, all I everlook for on the websiteis the link tothe menu.”

01 · Understand the context

For the tenants, lunch was by far the number one topic. So lunch went where it belongs: right at the top, next to “View offices”. One click, and the building zooms out – canteens, café and food truck light up, with today's menu.

02 · Specify requirements

Two visits, two yardsticks.

Workshops, conversations and research turned into two user flows. People who work in the building come every day, mostly on their phone, and want to know in under a minute what's on today. People looking for an office come once, take five to fifteen minutes, mostly on a desktop, and want to know whether the MTZ is the right place. What matters when choosing an office we derived from studies on location decisions: flexibility, location, cost, amenities and community. These became requirements every draft had to be measured against.

  1. Today's lunch shows up in under three seconds, on mobile too.Tenants
  2. The 3D model explains instead of getting in the way.Tenants
  3. Spaces and prices are out in the open, service charges included.Office search
  4. Applying takes no detours.Office search
  5. Menus, departures and news update themselves.MTZ team
  6. The team maintains startups, events, food trucks and rooms in the backend.MTZ team
  7. Accessible to WCAG 2.1 AA, with an accessibility statement.EN 301 549
  8. Smooth on a mid-range phone, with no third-party services.Tech · Privacy

03 · Develop solutions

One switch, two kinds of light.

In the top right corner of mtz.de, a little sun rolls over into a moon. One click, a second and a half, and it's night: the colours change and the lights come on in the building. Both moods are rendered in advance in Blender – all the browser has to do is show them.

Home page of the MTZ by day

Fewer gimmicks, more usability.

  1. Round 1, Expert review: One continuous camera ride links all sections – Resolved: The model stays still until you choose something
  2. Round 1, Expert review: Hovering over a startup pans the camera along – Resolved: The camera stays put, the floors above lift by a gap
  3. Round 1, Expert review: Floors turn transparent, the lines vanish into the cream – Resolved: Nothing disappears: the building fans out
  4. Round 2, User test in the building: Far too close – the zoom goes right up to a single office – Resolved: The whole wing stays in view
  5. Round 2, User test in the building: The lunch button looks like plain text – Resolved: A real button with a border and a shadow
  6. Round 2, User test in the building: The lunch list is a wall of text on mobile – Resolved: One card per canteen, café and food truck
  7. Round 2, User test in the building: The team photos are too small – Resolved: Larger photos on the startup pages
  8. Round 2, User test in the building: On the iPad the page jumps whenever the address bar moves – Resolved: The page stays put, even when the address bar moves
  9. Round 3, Beta on real devices: The company list jumps between front and back every four seconds – Resolved: Sorted by wing, the camera circles calmly
  10. Round 3, Beta on real devices: Six variants of a control panel for the 3D model – Resolved: Two switches: ground floor and surroundings

The MTZ has always been more than an office building, you just couldn’t see much of that online. Now you can walk through the whole building before you first stand at the door, and see who works here and what goes on. And the most important question in the building is now answered by the website: what’s for lunch today?

Dr. Felix Brinkmann · Head of the Munich Technology Centre

Dr. Felix Brinkmann, Head of the Munich Technology Centre
⟵ more proband15