Stephen Andrew Murrill
Design & Illustration
listing-hs-sm-icons.png

Help Scout Icons

Help Scout Icon Set

Icon Design

Help Scout is a product used by companies worldwide to communicate and deliver support to their customers. For quality customer service, quick and effective responses are key, so the app interface displayed actions when needed, and remained invisible when not. Icons are powerful visual communicators, and along with their ability to communicate internationally, they can maintain a subtle, almost invisible presence while offering a load of information to the user.

 
 
 
small icons.png
 
scouticons-casestudy-master-compose-bg.png
scouticons-casestudy-master-nav-bg.png
 

Details

Clarity is the key to an effective icon set. The goal of building Scouticons was to create a set that was cohesive, on brand, and most of all communicated informative in a crystal clear way. While a human element is allowed and encouraged in the product illustration, delight and form could never get in the way of functionality. Each icon in the set needed to exist as a family, as well. Creating cohesion in over 140 different shapes was a painstaking, but completely nessecary process. Each icon was itereated multiple times, and pixels were gently nudged countless until the whole set was a cohesive system.

 
 
 
 

Style

All Scouticons are built on a 24px grid, and in order to maintain visual consistency, are positioned within the grid in a congruent way. I established keylines within the grid as a constraint to maintain visual consistency. Each icon, with the exception of a handful of anomalies, had to align with these core shapes. Guides for stroke width, corner radius and spacing were also created to avoid any standouts.

 
 
 
hs-posts-casestudy-master_Artboard 2 a.png
icon-anatomy-02.png
scouticons-casestudy-master_Artboard 2 a.png
scouticons-casestudy-master_Artboard 2 a copy.png
scouticons-casestudy-master_Artboard 2 a copy 2.png