Blueprint for Trello

I made a really simple browser extension to use Trello for making service blueprints.

If you think of a journey map as an aerial view, the top-down plot of your user’s tour through a service — imagine each step involved registering for a new library card — then the service blueprint is its cross-section.

Think of the service blueprint as the cross-section of a journey map.

Sussing-out the systems and processes that underlie that journey returns a lot of value for your time spent in the way of insight, and I would guess that, like the journey map, the service blueprint might provide the most bang for your buck.

Blueprinting was born out of sticky notes and conference rooms and lends itself to being lo-fi, especially because it’s a team sport. And although the best UI for group-think is a wall, there is a need for remote tools like Mural that is priced for teams without an enterprise budget.

I noticed in Erik Flowers and Megan Erin Miller’s Practical Service Blueprinting Guide, this example —

www.practicalservicedesign.com

— that, to me, looks a little like Trello. Can you see it?

Trello is an organize-how-you-will collaborative kanban board, sort of.

Trello brings a lot to the table but in the world of budget-usability its real boons are that it’s free, ubiquitous, and extensible. It can be integrated into just about any workflow and accessed anywhere from any device. Updates are real-time. Shoot, I almost wish I had an affiliate link. I use it for everything — and, chances are, a lot of you do too — and for that alone it makes sense to me to leverage its consistency in our user experience work as a blueprinting tool, if we can.

So, inspired by Scrum for Trello — a browser extension that adds Fibonacci numbers and a burn down chart — I started Blueprint for Trello. All it really does is make items using shortcodes like [touchpoint] look more like the practical service blueprint.

Installation

1. Download and unzip the folder (Github).
2. Using Chrome, navigate to chrome://extensions and check the box “Developer Mode”
3. Choose “Load unpacked extensions”
4. Find the folder blueprint-for-trello or blueprint-for-trello-master
5. And, depending how you downloaded it, choose the folder of the same name inside it.

Usage

Blueprint for Trello applies styling to cards that include in their title a number of short codes:

• [touchpoint]
• [actor]
• [system]
• [stakeholder]
• [observation]
• [data]
• [question]
• [critical]
• [policy]
• [idea]

It replaces these with icons and applies a color to the cards.

From there, the Practical Service Blueprinting Guide should take you the rest of the way.

Enjoy.