The new STM Website

a big project for Montrealers by Montrealers

STM Mobile on a phone

Montreal’s mass public transit system- the STM - needed a new website.

More than just a website actually. They wanted to give public transport users an online experience. Something to be used and enjoyed, not just consulted. Needless to say, the gang at TP1 was thrilled to be trusted with the task, mostly because there would be a lot of firsts with this project.

The first time that TP1 would be working on such a big project.

The first time that we would be addressing the needs of such a large (and varied) group of users.

On average, 50 000 people use the STM website every day. That’s a lot of users.

The first time that we would be entrusted with such an emotional brand.

Yes, Montrealers get emotional when it comes to their public transport. So the STM wanted to give them the customer service they demand.

The first time that we would be working with so many partners and talents.

And it was also the first true test of TP1’s agile method on a large scale.

There were some organizational challenges…

Creating a new production team that had never worked together.

Consulting with numerous client departments.

Facilitating communications between an agile digital agency immersed in web culture and a large, highly structured corporation.

And then there were the technical complexities of designing and building the new STM website. Which hadn’t been updated...

In 1997, Steve Jobs returned to lead Apple, the company he co-founded.

In 1997, the Pathfinder probe successfully landed on Mars.

In 1997, Mike Tyson “nibbled” on Evander Holyfield’s ear.

In 1997, Mother Teresa passed away at the age of 87.

In 1997, the first human case of avian flu set off worldwide panic.

In 1997, Notorious B.I.G. was gunned down, six months after Tupac.

In 1997, a civil court jury found O. J. Simpson liable in the wrongful death of Ronald Goldman.

In 1997, Dolly became the world’s first successful animal clone.

In 1997, we mourned the passing of the People’s Princess.

In 1997, do you remember this bus model on the streets of Montreal.

In 1997, mmmbop got us dancing – even if we were ashamed to admit it.

En 1997, Tiger Woods became the youngest world champion in the history of golf.

But the agile methodology is designed for tackling challenges– no matter the size.

Let’s take a closer look.

Understanding the terminology used by the STM and its systems.

(getting everyone to speak the same language)

TP1 created a glossary of terms to facilitate the learning curve.

Making sense of a complex data ecosystem with components developed by different parties.

TP1 used open source technologies to help databases communicate.

Communicating with various departments with complex (and occasionally conflicting) needs.

The STM named a product owner who would be 100% dedicated to this project – and nothing else.

Testing to ensure that the website meets the needs of all users

TP1 worked with Adviso, Yu Centrik, Callosum and AccessibilitéWeb to conduct a complete battery of user tests

Making the whole experience and design accessible for the visually impaired.

The STM is a public service, after all.

TP1’s UX designer worked together with the creative designers and developers to find the right tones, fonts and shapes to make the content accessible.

Challenge

Understanding the terminology used by the STM and its systems.

(getting everyone to speak the same language)

Solution

TP1 created a glossary of terms to facilitate the learning curve.

"A website is like a shop window, but we needed to clean up the actual shop first! TP1 and Adviso opened us up to the possibilities, introduced us to benchmarks and then showed us how to align those standards with the STM brand."
Photo Nicole Gruslin Nicole Gruslin Corporative web consultant
Wireframe and sketches mockups

We felt a great sense of pride in June 2013, when the STM officially launched its fully accessible new website with content built on user needs.

stm.info offers one of the best public transport experiences in the world.

Why?

STM Component

 

Having conquered so many firsts, we also learned a few lessons that we’d like to share with you.

1 Users use the site.

So the site had to answer their actual questions. To find out what those questions were, our partner Adviso conducted a card sorting exercise with actual STM users.

2 Better to speak often and from the beginning.

Rather than rarely and too late. (or, How to Avoid the Risk of Epic Fails, if you don’t like tongue twisters)

Two-week work cycles required the team to meet frequently and communicate often.

The STM product owner could communicate directly with developers, the ergonomist and designers.

3 Don’t be afraid of monsters.

(“monsters”, i.e. very complex problems with metaphorical sharp teeth and big hairy paws)

For example, when the project started, STM had many databases. All of which need to effectively communicate to provide users with the information they’re looking for.

For example, this is what happens when you request an itinerary from TP1’s offices to the Olympic Stadium.

show all required data to plot a simple itinerary

The team had to quickly find (and become proficient in) technological solutions and tools to help users get the information they need.

  • TP1 custom-built an API to enable communication between databases.
  • Chicoutimi agency Map Gears integrated Open Street Map to help users plan an itinerary.
  • All partners collaborated to create tests that would simulate the behaviours of so many different types of requests and at different times of day.

But nobody noticed all that when we introduced the experience to Montreal commuters. All they noticed was how well it worked. User needs have changed since 1997 – and they will continue to do so. That’s why we built a website that can evolve and grow in the coming years. And TP1 already has a team in place to support that growth!