Blog - HubSpot Product Team

Design Consistency and the Brilliance of Twitter Bootstrap

Written by Adrian Mott | Mar 9, 2012

Sometimes the database schemas and app development aren't the only challenging issues facing a product development organization -- consistency of the design of all apps within a product and platform can present a major hurdle.  

Design consistency is something that many companies making web applications today face head on and deal with in different ways.  It just isn't that easy to have many small development teams, each working on different apps, magically create apps that have the same look and feel for the user.  

More and more, especially with the recent popularity of Twitter Bootstrap in recent months, the rise of style guides has shaped the way companies are handling their design and development efforts.

Part of the success of Twitter Bootstrap isn't just the ease if gives developers to pop it into a project and have the design taken care of (which is really nice), but it's the idea of unified style rules for an entire development organization. It just takes the guess work out of design consistency, and that idea alone is worth its weight in gold. 

Here at HubSpot, we have a great group of designers, who work with each product team to make sure that their apps look awesome.  You'll see some of their work in some upcoming releases of new core HubSpot apps. Much of the success that we're now seeing in the design of the products comes from the idea that Bootstrap imparted - create a unified style guide that all apps can use (we actually ported out style guide here from Bootstrap, but used Sass and Compass, as well as HTML and CSS). Laying the "design foundation" down and allowing for designers to spend more time on polish has really helped the team's productivity as well.  

It brings up another great thing that the Twitter team did with Bootstrap: they open sourced it.  Putting it up on GitHub (where it has become one of the most popular projects) and licensing it under the Apache License allows for free use by other developers, but also and immense amount of collaboration and added ideas and code back into the project - a fundamental benefit of all open source software.  

I thought this article on A List Apart is a really good account of how Twitter Bootstrap came to be and where it's going. I hope it's the start to seeing many more excellent style guides coming out in the near future.