Since Kohl's is a huge department store, the quantity of categories and subcategories can get really populated.
Additionally, and due to the growth of its digital division, the actions a user can implement through digital channels is really extensive.
In the need of creating a visual language that fits all channels it was important to create a consistent and flexible icon library that can even be used for printed pieces.
Before starting to create the library, and since many designers were going to be involved, it was very important to define a set of standards that every one should follow while designing.
All icons were created inside a pixel grid inside a 32 x 32px artboard.
The pixel next to the edge was considered the limit and we avoided placing anything inside it. The pixel next to it was considered the safe zone (marked with green in the image above).
All vector points for every detail of the icons were placed in absolute positions. No decimals were allowed. This specific standard was implemented with developers in mind, just in case someone needed to recreate any icon by coding it.
The stroke used was 2pt with inside borders. Rounded corners allowed were 2 or 4pt depending on the angle.
All this details maintained consistency and similitude between all icon possibilities created by different designers.
During the first rounds the team had to create more than one variation for each icon requested. My job was creating icons, reviewing the ones created by the rest of the team and delivering a revised selection to a Kohl's art director.
The first version of the library took us around 4 months to complete.
This library ended up being an alive document with more than 250 icons that has been updated with new ones during the next 3 years after the first official release of the library. New icons are being added every time a new category or action is identified or resurfaces due some actual necessity.
