Written: 15.04.2021, by: Jesper Jakobsen
Estimated time to read: 7 - 8 mins.
Table of contents:
Video:
What is the Grid module?
The Grid module is one of the most powerful and useful modules in Actimo. It allows for very cool designs and has a lot of actions you can add to the tiles to navigate your app. It's great for designing the most visited messages in your employee app, it could be your front page, news page, handbook, and many other pages.
It allows you to add pictures to the buttons, so you can design and customize the grid to fit your companies design language, and create a highly customized app experience for your users.
There are many options and possibilities in the Grid module, it's probably the most customizable and designable module. Below you can see how the grids are put together, and how you can imagine designs and images for your app (For example created in PowerPoint or Photoshop) in both shape and size.
How do I use the grid module?
In the top right-hand corner, you will see "tiles pr. row" and the numbers 1 - 3.
Here you select how many tiles you want in each row of tiles. On the GIF below you can see what 1, 2 and 3 tiles look like and how much room they each take up. When you have selected the number of tiles you'd like, you can add text, images, and icons. The text and icons can be added to the composer, whereas the images will probably have to be designed and then uploaded. You can also assign actions so that the grids work as buttons for navigation.
You can follow these steps:
Choose amount of tiles you would like (1 - 3).
Add text or images to the tiles (we recommend designing your own images, in PowerPoint or Photoshop).
Choose if you would like notification badges to appear on the tiles.
Choose what happens when the tiles are clicked. (Go to message, go to social, go to academy, etc).
Choose what border settings you would like, you can edit the colour and the opacity. If you don't want visible borders, you can set the opacity to 0 %.
Choose what overlay settings you would like. You can edit the colour of the overlay and how also the opacity. Just like the borders, if you don't want an overlay you can set the opacity to 0 %.
What happens when clicked?
On the 'Add an action' dropdown menu, you can assign the different actions to each or all of the tiles.
You have these options to choose from:
Go to page: Navigates to a different page in your message, requires that you have more than 1 page.
Go to message: Navigates to a different message, that could be 'Employee Handbook' 'News' or anywhere in between.
Open social: Navigates the user to a Social Wall.
Go to academy: Navigates the user to an academy.
Go to URL: Opens a website, that can be your company website, a news overview, www.kahoot.it or anywhere in between.
Dial phone number: navigates to your smartphone's phone call app and puts in a number of your choosing.
Download file: Starts the download of a file that you have uploaded. For example a guide in PDF or a picture.
Once you've chosen the number of tiles and uploaded images to your tiles, you can choose to remove, keep or edit the borders and overlays. This can be done at the very bottom of the composer.
Tags: tiles, grids, navigation, design, frontpage, images, customize