Icons for Qlik Sense apps

Developing apps on Qlik Sense is lots of fun, but also poses some challenges.
The look and feel of your Sense apps is really important when it comes to end users’ first impressions of Sense. Digging deeper into the possibilities of Sense, extensions are an interesting way to enhance the capabilities of your apps.

Once you start using extensions though, apps start to diverge in terms of visual look look and feel.
That might be fine, but then you have icons, which are used for buttons, to visually categorise data in tables, they are used in mashups etc.
Lacking a common set of icons and app/sheet thumbnails, developers will add their own icons to apps, eventually resulting in a non-consistent end user experience.
A lot could be gained by all Sense app developers in your organisation using the same set of icons.

Enter Font Awesome (=”FA”). It really is open source at its best:

“Font Awesome is fully open source and is GPL friendly. You can use it for commercial projects, open source projects, or really just about whatever you want.”
Font Awesome by Dave Gandy – http://fontawesome.io

My idea was to make it really simple to bring FA into the Sense domain. There are two parts to this: Making the icons available as general bitmaps, and as sheet/app thumbnails.
Turns out it is pretty easy. The basic steps are:

1. Convert the FA icons to bitmaps (.png files).
2. Create variants of the bitmap icons that have the aspect ratio needed for sheet/app thumbnails to look good.

Once again turning to the open source community, a couple of projects give us all we need: icon-font-to-png and imagemagick.

Assuming you are on OS X or Linux (sorry Windows users…), this GitHub script will download all 700+ icons from Font Awesome, convert them into 256×256 icons using any named color you pass on the command line, and also create a separate folder with 8:5 aspect ratio png images that can be used as app or sheet thumbnails.

Import into a couple of Sense resource libraries (one for the square icons, and one for the 8:5 ones) and you have a very comprehensive set of icons to use in your Sense apps.

An obvious improvement would be to automatically upload the icons to Sense using the QRS API – there is always room for improvement. Feel free to fork the repository and add the needed code.

Onward!