Beautiful Design & Chart Innovations From Qliktech – And The Elephant In The Dashboard

**POST NOW UPDATED AFTER WORDPRESS DELETED THE 2nd HALF – FULL .QVW NOW AVAILABLE***

It’s that man again; Michael Anthony (@mejadesign); Qliktechs relatively new in house designer has delivered another good…no; bloody good looking dashboard showing what’s sort-of, kind-a possible with Qlikview (as I’ll explain later).

Let’s start with the positive; I can’t fault the design of this dashboard;it achieves that all too difficult thing in design: it doesn’t shout it whispers and achieves all the more for it. Now I know some will be crawing “but you can’t use red as that signifies ‘bad’…”, well in many cases that’s true but if you can’t tell that red signifies the most recent year in this dashboard then quite frankly you’re in the wrong industry.

Now I don’t advocate that this is a dashboard style that should be used wholesale; it’s not going to handle reporting a full ERP system for instance but here, in this instance; I think it really works. It’s a style I’ve been working on recently for a current client in The City; it uses all ‘in-Qlikview’ objects & fonts apart from the logo of course (It’s a POC and all values / names have been changed and it’s blatantly ripped off from (aka ‘inspired by’) the https://testflightapp.com/ dashboard):

Lets look at some of the interesting innovations employed in Anthonys dashboard.

1. Oh, Mr Anthony; What a Nice Pair of InfoGraphics You have:

Both the charts on the left are a long way from standard QV objects but I think they really work here; they give the values relativity thus giving them added impact and resonance. They’re both made with images in conjunction with a dimension free stacked Bar Chart; simple yet really effective…but also very easy to get horribly wrong.

These are heading in a direction I’ll be looking to go in an upcoming post; making more ‘infographic style’ objects that are dynamic in that they react to selections but are largely tailored to the dataset, I think when used carefully they can get information across in a better way and could really be another USP for Qlikview (I have a really simple method up my sleeve that really opens up this space so keep watching.)

2. Range Chart

I’m sure this isn’t the first instance of this chart style in Qlikview however I think its usage here works well thanks to it’s subtle implementation. What it is and could allow one to show is a daily / monthly range; as here min & max temps or maybe min & max tolerances of stock prices as well as for me the really useful possibility; showing a projected forecast range. The method used here is pretty simple as well; it’s 2 charts layered over each other, the one showing the range has the min plotted as fully transparent filled line with the difference between min & max stacked on top of it – download the .qvw to get at the finer points.

3. Other Areas

It sounds simple but this dashboard works because it fully employs some basic design principals:

i: Everything lines up – sounds obvious but the number of dashboards that have objects floating around just dumped on the screen is ridiculous; just use Crtl+ arrow keys to get it pixel perfect.

ii: The colours are maintained throughout – again obvious but so many developers don’t take the time to ensure the colour scheme is persistent throughout their dashboard. Michael has used the same simple colour palette on all tabs; red for highlights, dark grey for headers etc etc.

iii: Consistent usage of fonts – yet again falling off a log simple but so often over-looked. Michael has chosen fonts that fit the overall style and feel of the dashboard (by bending the rules a little as I’ll explain below) and their usage is consistent across all the tabs.

Elephant in the Dashboard

So what’s the ‘Elephant in the dashboard’? Take a closer look at those fonts; there’s something a-miss. I have to admit; I’m a total Font-Geek, I’ve spent far too much of my life switching between 2 near identical fonts types to gauge which fits best, so seeing the fonts employed by Michael immediately got my attention. However; the fonts aren’t actually available in Qlikview; every single piece of non-data driven text in the dashboard has been created outside of Qlikview and then imported as an image; a massively onerous task especially to get it all lined up and sized as correctly as this. There’s no way that any sane ‘in the wild’ developer is going to commit enough time to create a dashboard via this method; that’s not to criticize Michael for doing it here; the result works brilliantly however the criticism is purely directed at Qliktech; why can’t we import new font types into Qlikview? (it seems as though some can be imported but others such as Helvetica remain elusive) Whilst we’re on the subject of fonts; why can’t we have multiple font types, colours & sizes within Text Objects?: it’s a small innovation that would really help to complete the ‘100% flexible’ layout design.

So; a more general plea to the creator of this dashboard: you’re the man on the inside, the first Qliktech employee who cares and understands about design, layout and aesthetics so PLEASE, PLEASE make sure v12 gives developers the tools to create dashboards like yours without having to resort to Photoshop. Personally I think it will open up whole new areas for Qlikview; namely what I’ll coin the ‘Interactive InfoGraphic’, just think of creating a companies annual report as a Qlikview app; beautifully laid out but fully interactive and available to all via the web…I feel a demo coming on.

The dashboard can be viewed online here: http://eu.demo.qlikview.com/detail.aspx?appName=My%20Life%20in%20Data.qvw

The actual .qvw can be downloaded here: https://docs.google.com/file/d/0B0nQ9tZcY4wzZms5QmhacjRUanlHUjUxR0NuT0hDQQ/edit (If anyone from Qliktech has an issue with me releasing this for the benefit of the developer community let me know and I’ll remove it)

Hope you find it useful,

Matt

Advertisements
Comments
7 Responses to “Beautiful Design & Chart Innovations From Qliktech – And The Elephant In The Dashboard”
  1. Matt,

    This application is available online as a demo ?

  2. qvdesign says:

    For some reason WordPress has kindly chopped this post in half and deleted the second half (about 400 words; thanks for that) so apologies for that.

    I’ll try and get it sorted today and I’ll also be posting a link to download the actual .qvw.

    All the best,

    Matt

  3. Lewis Johnson says:

    Here Here!

    I’d love to see more control and functionality around the ‘look and feel’ elements in Qlikview!

  4. Samichez says:

    Two things:

    Ctrl + Arrow Key = Mind Blown!

    Thanks for sharing your POC and the demo app from QlikView. Lots of inspiration there.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: