The Joy of QlikView Grid Layouts

By Barry Harmsen

While most QlikView Designers are familiar with the works and principles of data visualization gurus such as Stephen Few and Edward Tufte, when it comes to dashboard layout many (including myself) are more likely to follow the design principles of that other visualization expert: Bob Ross.

Dashboard Design - The Bob Ross way

I plot different objects on the sheet, basing their location on my experience, sound judgement and the overall aesthetic appeal. “Maybe in our world there lives a happy little treemap over there.” Apply a little horizontal and vertical alignment and I’ve finished another ‘masterpiece’. It’s much more of an art than a science, or at least that’s what I like to think.

While this approach is a lot of fun, it’s not a very fast way to get things done. Not every layout works immediately, and reshuffling objects after “happy little accidents” can take a lot of time.

Grid layouts

9x9 grid example

Enter the Grid layout, a more “paint by the numbers” approach that let’s you quickly create visually balanced layouts. I won’t go too much into the details of how and why you would want to use them as other Qlik bloggers like Patrick Tehubijuluw have done this quite nicely already.

Some might worry that using a methodical approach might take away some of the creativity (and fun!) of designing QlikView applications. I definitely have not found this to be the case, there are still many areas where you can focus your creativity. Of course YMMV.

Actually using the Grid layout

While I was quickly convinced of the benefits of using a grid layout, it took me a little longer to actually start applying them. For two reasons:

  • Available grids didn’t meet my needs. The 12-column grid that is included with QlikView Desktop is very cool if you happen to be designing for a 940 pixel wide display, but not so useful otherwise.
  • Online tools focus on columns only. There are many online grid calculators out there. Unfortunately not one of them meets my needs, as I’d like to have both columns and rows in my grid, to make both horizontal and vertical alignment easier.

Manually creating a grid is a hassle, so I’d only create one for projects (and resolutions) where I knew that I would need it frequently. For all the others; the Bob Ross technique.

Introducing GridMaker

GridMaker v1.0

A few weeks ago I came across Karl Pover’s post about a Grid System Tool based on macros (which was triggered by my earlier post about macro use cases). While I liked the tool, there were a few minor things nagging me. The main thing was that it starts from the column/row width/height instead of the overall width and height. My requirements are usually in the form of “design for a resolution of X by Y”. I’d like to take that as the starting point and determine column width/row height from there. I also prefer using a background image instead of text objects, as the text objects interfere with lasso’ing multiple objects.

So, I decided to use Karl’s idea of a macro-based solution, add what I thought would be improvements and create my own version of a grid generator: GridMaker. A tool that creates a custom grid based on your specifications and saves it as an image. You can then use this image as a temporary document background while you design your application.

While it’s still not perfect, it creates pretty big BMP files instead of smaller PNG files, I’ve decided to put it out there. Perhaps someone will improve upon it further 😉

Download GridMaker v1.0

I’d like to wish you happy Qlik’ing!

Thanks for joining today!

Still here?

Still reading? Good! Research has shown [citation needed] that only the most hardcore Qlik enthusiasts (with matching attention spans) make it this far. So, I thought this would be the only logical place to mention that we have a new Masters Summit for Qlik coming up on April 5 – 7 2016, in Milan, Italy. An intense 3 day training that will take both your QlikView and Qlik Sense skills to the next level!

Masters Summit Italy - April 5 to 7 2016

It’s not just about training though, you will also have ample opportunity to network with your peers, exchange success and horror stories, discuss (and expand upon!) ideas and just plain have some fun!

Can’t make it this time? In fall 2016 we will also be visiting Johannesburg, South Africa and Austin, Texas. More information can be found on our website. See you there?

 

About The Author

Barry Harmsen

Hi there, I'm Barry and I'm a Business Intelligence Consultant at Bitmetric and based in the Netherlands. Originally from a background of 'traditional' Data Warehousing, Business Intelligence and Performance Management, for the past 10 years I have been specializing in Qlik and a more user-centric form of BI. I have done numerous QlikView and Qlik Sense implementations in many different roles and industries. In 2012 I co-authored the book QlikView 11 for Developers. You can follow me on Twitter at @meneerharmsen.

12 Comments

  • 1
    February 4, 2016 - 22:27 | Permalink

    Nice update to my design grid generator and one hell of a macro. My only complaint is that you didn’t superimpose your head-shot over Bob Ross’s afro and beard.

    Karl

  • 3
    Steen
    February 8, 2016 - 23:15 | Permalink

    Hi Barry,

    When I’m trying to generate a grid with the application, then it just opens the macro when I click on the “Generate Grid” button and nothing else happens. Do I need to do anything to make it generate the grid?
    I’m not experienced in working with macros in qlikview, so maybe I’m just missing something obvious?

    • 4
      February 9, 2016 - 22:00 | Permalink

      Hi Steen,

      The macro requires system access to write the file to disk, did you allow this when you first opened the QVW? Alternatively, if you chose “Open with” instead of “Save to” (or something similar) then the file may have ended up in a temp folder that the macro cannot write to.

      Kind regards,
      Barry

  • 5
    Mark
    February 9, 2016 - 10:16 | Permalink

    Very recognizable issues and an excellent tool for UI designers.

  • 6
    Allard
    February 10, 2016 - 10:45 | Permalink

    Nice. I like it, thanks for sharing this.

  • 7
    Vekku
    February 18, 2016 - 14:27 | Permalink

    Hi
    Useful tool.
    If you try to use more than 1000 pixels in the width or height it just opens the edit module window.

    • 8
      February 25, 2016 - 23:45 | Permalink

      Hi Vekku,

      So it works fine for anything 1000 pixels? That’s very strange. I am able to generate whatever size I need, so am not sure what the issue could be.

      Kind regards,
      Barry

  • 9
    Eric Pulgar
    June 29, 2016 - 21:13 | Permalink

    We don’t make mistakes, just happy accidents

  • Read previous post:
    Join me in the Qlik Sense Cloud

    Want to build a quick dashboard or analyze some data? Want to share your findings with others or publish charts...

    Close