Conveying information visually, one icon at a time

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/9c1ffd04-95e1-414a-94f0-ecb621c23f53/Icon_cover2.png

Overview


Introduction

Creating icon design style & library for a web platform

<aside> ⚪ Jump to final design

</aside>

Key stats

Context


Background

Icons are essentially shapes and symbols that conveys message often by deriving meanings from metaphors and imagery. However, they're also one of the most used tool of communication while designing digital interfaces.

In any UX project, icons plays a very crucial role as they reduce the dependency on words while improving the aesthetic appeal. However, like any other language, they do have a proper vocabulary and grammar which we refer as style. So the project was to design an icon design style for UNI.xyz

Project history

During my internship at UNI, there wasn't a central platform for hosting competitions as we have today. So for each competition we used to create a separate website. I also designed website for 2 competitions and both of them had very different visual styles and appeal. The icons I created for them are shared below:

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/4ff5523d-3e4d-4e60-b776-0c993b35adaa/Web_1920__3.png

This icon set was created for one of the website (and document) with a mix of line and fill in multi-fill (in shades of grey).