- About
- Submit
- Tools
- Guides
- Equity, Diversity and Inclusion guide
- Multimedia Consent Guide
- Formal studio portraits
- SFU News
- Brand guide
- Communication strategy
- Editorial style guide
- Media guide
- Project management
- Self-recorded video
- Social media
- Website content guide
- Website project guide
- Website Design Guide
- What makes a good story?
- URL request guidelines
- Blog
- C&M staff
Iconography
We use icons to help improve usability issues or to share messages in a strong and consistent way. While imagery is primarily used to tell a story, icons can enhance navigation and comprehension by quickly drawing attention to important messages, or actions that audiences should take. Used correctly, icons can both communicate actions without using text, and connect visually to SFU’s brand DNA.
Criteria
Simple shapes
Thick lines
Straight-edged corners
Single colour
Colour guidelines are outlined in our Brand Guidelines.
Resources
There is no fixed set of custom icons for SFU. Rather, we recommend using the above criteria when selecting or creating icons for your application.
Using icons that meet the style described above helps unify icon usage across SFU, enhancing the brand. Icons that meet the above criteria can be designed from scratch or sourced from online resources. Google’s Material Design Project is a free resource that contains downloadable icons that meet our criteria and support the best practices of user interface design. Another option is Font Awesome. However, license fees apply.
DO
• Use simple shapes familiar to your users.
• Maintain consistency.
• Test your icon. Consider adding a text label if meaning is not understood within five seconds.
• Consider using an icon when space is limited.
DON’T
• Flood your page or screen with icons.
• Use icons when a single word is more effective.
• Attempt to represent complex concepts as an icon.
• Mix different style icons.
Contact us
Not sure if the icons you would like to use are on brand? Email sfu-brand@sfu.ca for a consultation or
review.