Your friends at Viget present Inspire, a Design & Interaction Blog

Updated Omnigraffle Stencil for Bootstrap v2.2

Update

Feb 10, 2014

The stencil kit has been updated to match Bootstrap 3.0. Learn more...

In February of 2012, Elliott meticulously built and released an Omnigraffle stencil for Twitter Bootstrap 2. Like Bootstrap itself, Elliott's stencil was exhaustive and popular. His announcement ranks among the most visited posts all-time on Viget's Inspire blog.

Internally, while Viget rarely uses the Bootstrap framework for front-end development, the Omnigraffle stencil is a favorite tool among our UX team. For rapid wireframing, an extensive and current library of UI elements can be indispensable.

So when version 2.2 of Bootstrap was released a few months back, we started to rethink our stencil. In the end, we decided to rebuild the entire stencil from the ground up.

As with our first stencil, our primary task was to painstakingly recreate nearly all of the Bootstrap elements with visual accuracy. However, for this update, we wanted to devote more weight to utility. Speed matters when wireframing and pixel-perfect elements just aren't very useful if they breakdown with actual content.

Additional Notes

  • Most changes involved replicating new elements added to Bootstrap. Cosmetic edits were also made frequently to fonts, colors, and sizes.
  • Glyphicons were swapped out in favor of the more extensive and completely free Font Awesome.
  • Organization was changed slightly to surface the most universal elements first. Less common elements are still available in the last canvas of the stencil.

Thanks

A huge thank you should be extended to Elliott for building the first stencil and Todd for his continued support on GitHub. And props to @fat and @mdo for creating, maintaining, and updating Bootstrap. Impressive stuff.  

Download

Contents include Omnigraffle stencil, template, and color palette. Also check out the README file for instructions for how to install these files. If you have any comments or suggestions, please let us know!

zip file

github


Get More From Viget

Subscribe to get our monthly newsletter and occasional special announcements.