Enhancing UX for the CTA’s Digital Signage

I live in Chicago and take the train to work every day. I’ve noticed that the CTA has been making a lot of system upgrades — many trains are new and stations have been updated (on the Red Line at least).

I really appreciate these updates but I feel the CTA has failed to capitalize on a great opportunity to make really useful digital signage.

With a few tweaks and a focus on the customer experience I think the CTA’s new digital signage can be much more effective.

Current Digital Signage

The current CTA signage as it exists is okay but doesn’t show the information I want to know:

Captured at the Bryn Mawr el stop (with CTA permission).

You’ll notice the screens scroll slowly. The cycle goes like this:

• 10 seconds for the time, weather, a no smoking reminder, and CTA logo,
• 10 seconds for the next two trains bound for the loop,
• 10 seconds for the next two trains to the loop, and
• 10 seconds for the next two northbound trains.

Then it repeats. This varies slightly based on how many trains are in the queue but that’s not super relevant to our discussion.

The point is that it shows information that is directly relevant to most customers (when the next train arrives) for 10 seconds, with 30+ seconds between those snapshots.

And look at this lovely gap in the middle that has no information… for ten whole seconds.

I ride the CTA every day and I barely stop when passing through the turnstiles (even though the “Ventra triple-tap” has slowed my roll). I’ve been counting my average time through a few CTA stations and it takes about 8 seconds from the door through the turnstiles and past the sign — not long enough to see anything more than one information cycle which may or may not be applicable to me and we can do better.

Improved Digital Signage

To improve this signage I recommend showing when the next few trains are heading north or south.

I did a few sketches to explore various options for what the sign could look like and made some notes about functionality including:

One of the ideation and sketch pages. Lower right is the final sketch.

• Support multiple lines on one platform. Platforms in the loop serve Brown, Purple, Orange, and Green lines all day. Differentiating between trains is important.
• Show which direction the train is going. Riders need to know when the next train they want is coming, not when the next train they don’t want is coming.
• Show how far away the train is. When you’re taking a trip, you should be able to check the sign to see where the train is and how many trains are coming.
• Show how often trains will come. If riders have a choice between a full train arriving in 4 minutes or a follower arriving in 5 minutes, they can make better decisions.
• Show system alerts. Knowing if one or more trains are delayed may affect how you plan your trip. Knowing when trains will go express is also helpful.

Once I had a rough idea of the interface, I made a low-fidelity prototype (which you saw above) and asked some of my colleagues for feedback.

With their feedback in mind I did another prototype. This annotated wireframe describes the way different portions of the final interface could function:

Some other ideas for displaying the information more densely and with less unused space are as follows:

Next I created a mid-fidelity prototype in Keynote to roughly illustrate how the animation could work.

Thanks for thinking this through with me Minoru!

Thanks for talking this through Scott!

I think this is a pretty effective proof of concept for how the trains could advance and appear.

Props to the colorblind community in /r/Chicago and the DePaul HCI Facebook Group for the great feedback!

Next Steps

This prototype does not solve all the signage issues perfectly and while it is only a first pass, I think it takes a big step forward in creating better digital signage. There are many opportunities to build on this first pass, like having the train destinations map to the side of the tracks the train will be arriving on, listing destinations below the train icons, and more.

To create truly effective signage the first step would be to do competitive analysis to see how other train systems have implemented successful systems. Next I would work with the CTA to identify the core CTA rider demographics and do a round of interviewing and observation to identify habits, needs, unstated assumptions, and expectations.

From there the project should create detailed personas for the various types of riders, identify the core persona, and begin to develop signage which met their needs while still accommodating less frequent riders. This signage would be much closer to the typical riders mental model and ensure I’m not biased in what I’m creating.

There are also accessibility considerations such as color-blindness, text size and iconography and hardware, software constraints, etc, but I think this is a totally manageable problem to solve.

Thanks for reading! Hit me on Twitter at @inhll or comment here!

Thanks to everyone for your feedback!