# Story of the shield - design to the rescue

**URL:** <https://discourse.opensourcedesign.net/t/story-of-the-shield-design-to-the-rescue/2962>\
**Category:** Uncategorised\
**Created:** [May 18, 2022, 5:49pm UTC](https://discourse.opensourcedesign.net/t/story-of-the-shield-design-to-the-rescue/2962 "2022-05-18T17:49:00Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ian](https://yyz1.discourse-cdn.com/flex029/user_avatar/discourse.opensourcedesign.net/ian/32/2184_2.png) [@Ian](https://discourse.opensourcedesign.net/u/Ian)\
**Post date:** [May 18, 2022, 5:49pm UTC](https://discourse.opensourcedesign.net/t/story-of-the-shield-design-to-the-rescue/2962/1 "2022-05-18T17:49:00Z")

</div>

Many projects use shields like the one below to indicate their current status, number of followers etc:

![build: passing shield](https://olivierlacan.com/assets/shields_build_status.svg)  
Back in 2013 these shields were very inconsistent in appearance. It turns out we have a designer to thank for standardising them into what we see today:

> Basically, the badges were often neither functionally optimal nor aesthetically pleasing. I saw a missed opportunity there. So, despite my rusty design skills, I hopped into Photoshop. Some time later I emerged with a [rage diamond](https://github.com/badges/shields/commit/0a6bc1ab5be03d6369799303ac6c1db3c8c50bb4). It was a simple Photoshop file with a badge template that I took the time to design properly: consistent padding, a more legible typeface despite a similar font size, better contrast, softer colors, a more subtle gradient, etc.

They go on to say:

> Shields is the most successful open source project I’ve ever been involved with in a major way, and for a while it didn’t contain a single line of code. I think design-savvy developers and designers have a lot to contribute to the open source world, and Shields is my proof.

Read the original blog post [An Open Source Rage Diamond](https://olivierlacan.com/posts/an-open-source-rage-diamond/) and visit the project itself at [Shields.io](https://shields.io/).
