In order to make the web design process for BCBS.com more efficient and effective, I developed a modular design library for the website.

Client

Blue Cross Blue Shield Association

Role

Visual Design, Web Design, Illustration


Overview

The BCBS website was in need of a design library that could provide consistency and efficiency in design. In order to improve the web design process for BCBS.com, I developed a modular design library that could be applied to many different situations.

An important first step was to establish a formal grid which would tie the entire system together. Once a grid was established, I developed a look for several common page and content types and began to document the modular elements.

 
BCBS Webpages_Grid.png
 
 

Documenting the system, I housed all elements in one location for easy visual review. In addition, I created a library file which consisted of each element as a live, editable symbol, to be shared across multiple users and quickly updated if changes were necessary.

 
Snapshot of the library

Snapshot of the library

 
 


pictograms / icons

I also developed a new set of pictograms / icons for BCBS to use in digital and web applications. The system of icons was built as a modular system that could be used either standalone or in combination with an additional set of modifiers that I developed. These modifiers are intended to provide additional context or meaning to any of the icons in the set and also expand the sets use to a wider variety of situations.


 
BCBS Icons__gradient2.png
 
 
BCBS Icons_Modifiers.png