Styling a Pantsuit

image
Using style guides for efficiency and consistency

There are many aspects to a pantsuit that people don’t consider but one thing that rings true is there are a few unifying factors. While pants and a suit are the most obvious among them having a uniform set of guidelines to define this “suit” or group of styles helps to give the viewer a clear definition as to what makes the pantsuit. Otherwise, you wind up with a mixed bag of elements that prevent your design from providing consistency which is extremely important in this brand-centric world.

Out of many come one.. Pantsuit

Mina Markham is a senior developer at Slack and a former front-end developer for the “Hillary for America” campaign. Coming into the campaign she noticed many of the different fonts and design elements for a wide range of items pertaining to the Clinton campaign’s websites. Markham was tasked with creating a unifying style for the collection of sites pertaining to the campaign and dubbed it the Pantsuit UI. This allowed the entire campaign to use the pattern library and style guidelines for rapid building while maintaining a uniform style that would prevent the campaign designs from looking inconsistent or off-brand.

What’s in a name?

As Markham noted in the speech she was initially reluctant to share the “Pantsuit UI” name she had coined for the style library but after running it by a few superiors they were more than happy to go with the moniker. The Pantsuit pattern library was such a hit, among the campaign and within web development circles, that it wound up being featured in Wired Magazine.
(style library example photo)

Coming away from the speech, I got a greater sense of how applying consistency to a project site-wide. Mina’s important lesson will strive to make our style guides more comprehensive roadmaps for all projects in the future. Now all that is left is to think of a name for a style guide that is anywhere near as clever as “Pantsuit”.

Share this post