pixel

ChartMat In-Depth Review – Exploring Its 5 Core Features

Review written by Kim J. Baaden aka ‘Kimbro’

 

CheckMate – That’s what I picked up when I saw the name for the first time. And indeed, I became very curious to check if ChartMat will make the competition CheckMate or not.

Another close relative of the name is “charmat”, without the first ‘t’ (pronounced French: shar mah). The charmat method is used for producing sparkling wine under high pressure.

Same here, let’s see how ChartMat will perform under high pressure usage.

In this Chartmat review, we will focus on Chartmat’s usability, feature descriptions, analysis, and evaluation. Then we’ll get to the competitor comparison later on.

Let’s dive into it and find out what ChartMat can do for us.

 

What is ChartMat?

 

As ChartMat explains itself, it is a…

“Dashboard and app builder based on Google Sheets. It’s designed to beb simple and easy to use”.

In short, ChartMat is about Data Visualization with the help of Google Sheets.

That means:

With ChartMat we can enter our data in Google Sheet and visualize these data with different types of charts, hence the word “Chart” in ChartMat. Now, please don’t ask me about the meaning of ‘Mat’ in ChartMat…

But there is more to it:

Not only can we visualize our data, but we can also embed a code into our webpage and enter data directly from web browser forms on our webpage. The connected chart or charts will be updated in real time and can be seen in another ChartMat tab, all on the same webpage where we have embedded our code.

So, basically what we can do with ChartMat is:

  • Enter data into our Google Sheet
  • Make calculations in our Google Sheet as usual
  • Visualize these data in chartsUse it privately or embed the code into our webpage
  • View live dashboards online on our webpage.

This all happens in real time, automatically, and in different ways, as we will see later.

 

Native vs Progressive Apps

 

ChartMat describes itself as a “dashboard and app builder”. We must note here that building apps with ChartMat does not create native applications which we can download from app marketplaces like Google Play Store (Android) or the Apple App Store (iPhone iOS). Rather, our created ChartMat “apps” look and feel like apps when we use them on mobile phones or laptops.

We could say, these are interactive dashboards looking like functional apps. Simply said, we enter something and another resulting thing will happen. That’s the basic characteristic of an app. And this is something that ChartMat can achieve.

Technically speaking, ChartMat creates ‘Progressive Web Applications’ (PWAs) rather than ‘Native Apps’. A native app runs on a mobile device, while PWAs run inside a web browser. Native apps are developed in the programming language specific to a platform (Objective-C and Swift for iOS and Java for Android), whereas PWAs use HTML, CSS, and JavaScript.

 

The Structure of ChartMap

 

In ChartMat we will first land on the ChartMat ‘Dashboard’. From there we can select our ‘Workspace’ and create unlimited ‘Boards’ within this workspace. Within the boards we create ‘Sections’. In each section we can place unlimited ‘Blocks’. There are 4 types of blocks: Forms, Charts, Tables, and Grids. Within each block we can fine-adjust the settings.

The hierarchy looks as follows:

 

ChartMat Hierarchy Structure

 

It is important to note that there’s a difference between the dashboard of the ChartMat app and the dashboards which we will build with ChartMat. To distinguish them we could define them as ‘App Dashboard’ in the first case, and as ‘Dashboard Apps’ or simply ‘Dashboards’ in the latter case.

The smallest units when building dashboards are the blocks. Let’s see how they look like:

 

Smallest Units: The 4 Blocks

 

Currently, we can use 4 types of blocks to create our ChartMat Board:

  • Forms: Use forms to easily add data to your spreadsheet
  • Charts: Use charts to display and visualize data
  • Tables: Use tables to display only specific data
  • Grids: Use grids to display a photo, a line of text and some buttons

 

4 Types of Blocks in ChartMat

 

We get the option to create our ChartMat Boards from scratch or to use the ‘done-for-you’ pre-made templates, currently 16 in number, and to modify them as per our requirements.

 

Built-in Templates in ChartMat

 

1. Charts

 

One of the most important features of ChartMat is data visualization. We can build online dashboards which update themselves in real time. As soon as we enter data into Google Sheets, the charts in the dashboard are automatically updated without any delay.

The ChartMat team is about to develop more chart options. Currently the following six chart types are available:

  • Line
  • Bar
  • Radar
  • Pie
  • Polar Area
  • Scatter

 

2. Forms

 

Forms are the second type of block. We currently have 5 form types to choose from:

  • Input = 1 line input field for text, numbers, or any kind of characters
  • Select = We provide options from which the user can select one
  • Date = The user can enter or pick a date from the calendar pop-up 
  • Text Area = multiple lines input field for text, numbers, or any kind of characters
  • File = The user can upload a file (including a video, photo, document, etc.)

 

3. Tables

 

Tables are the third type of block. Tables allow the user view single or multiple columns from our Google Sheet.

 

4. Grids

 

Grids are the fourth type of block. They are very similar to the table block with the difference that the content of the tables are not shown in table design but in grid design. It means, we can’t see any table structure in the background of the data but the data is displayed on a clean background and in a grid display instead. This is perfect for displaying images as we will see later.

Let’s have a look at how we can enter data into our Google Sheets:

 

6 Ways to Enter Data into Google Sheets

 

Externally, in Google Sheets:

  • By hand, directly into a Google Sheet document
  • With the import feature in Google Sheets
  • Per Zapier, Pabbly Connect, or KonnectzIt directly to Google Sheets

Internally, in ChartMat:

  • By ChartMat Forms which we create ourselves 
  • By ChartMat General API access
  • By ChartMat External API access

 

API vs API – No spelling mistake!

 

ChartMat offers 2 types of API access. We must not be confused between the both.

  • General API access
  • External API access

Ad 1: General API access:

  • Enterprise Plan only
  • It allows us to edit our spreadsheets from our APIs (push)

Ad 2: External API access:

  • Pro Plan and Enterprise Plan (currently in development) 
  • We will be able to pull data from any API into our Chartmat Board (pull)

In the first case, we push (edit) the data inside Google Sheets and in the second case, we pull the data in.

 

Workflow & Experience

 

How do we get through the app to build a dashboard with a data entry form and data visualization? The workflow follows the structure discussed above.

 

ChartMat Workflow

 

1. ChartMat Login

 

First we need to log in to ChartMat through their website:

https://chartmat.com/

When we click on the “Get Started” button we will be transferred to the app. Alternatively, we directly can access the app under the following URL: 

https://chartmat.app/

 

ChartMat Login Page

 

In the login page, We are offered two options:
Login with a Google email addressLogin via a URL link sent by email

Interesting here is that a login via password is not provided which is absolutely fine since we need to have a gmail account anyway to use Google Sheets for this app. Please, just make sure you enter the correct email in both cases to get back to your account. Otherwise you will land in a new and empty account because they will not check if the entered email is connected with any account. For that 1 star less. Otherwise ok.

Pro:

Easy login with 2 options

Con:

No email verification (yet)

Interesting:

Password-less login

Rating:

⭐⭐⭐⭐

 

2. Dashboard

 

Once we are logged in we will land on the dashboard page.

 

Create new workspace in ChartMat

 

The dashboard is the place where we view our existing workspaces and where we create new workspaces. The number of workspaces we can have is determined by our plan for which we pay.

It is important to note that each workspace…

  • is mapped to exactly one domain
  • is linked to exactly one Google Sheet (account)
  • has its own users which are separate from other workspaces

In the beginning we don’t have any workspaces so, let’s create one by clicking on “New Workspace”. On the ‘new-workspace’ page we need to enter…

  • A name for our new workspace
  • The subdomain name such as in https://subdomain.chartmat.app

Setting up new workspace

 

When we enter a subdomain name it is important to choose a name which is not yet used by any other ChartMat users. Otherwise you will receive an error message ‘A workspace with this subdomain already exists’. In this case, we simply change the name and carry on, by clicking on ‘Create Workspace’. We will land on the workspace page now.

Pro:

It’s very easy to create a new workspace. All works fine.

Con:

None

Interesting:

We must select a subdomain name which is not used yet by other ChartMat users.

Rating:

⭐⭐⭐⭐⭐

 

3. Workspace

 

We are on our workspace now which is the biggest unit from which we operate. Two things need to be managed in the workspace:

  • Connect the workspace to Google Sheets
  • Create blocks

Let us first connect our workspace to Google Sheets.

 

Connect Workspace to Google Sheets

 

We simply click on “Connect Google” to connect to any of our Google Sheets. It is interesting to know that we don’t need to connect with the same Google account with which we are logged in. We can connect with any other Google account and its Google Sheet also.

After giving permission to ChartMat to access our Google Sheet we take the next step and create boards.

 

Boards Display on ChartMat

 

We click on “New Board” and after that we are provided either with the option to choose from one of the templates or to start from scratch with a blank board. The option “Blank” is a little hidden in between the list of templates. See the red marking here:

 

Board Templates on ChartMat

 

Let us create a blank board by selecting “Blank” and by giving the board a path name.

 

Setting up subdomain for your ChartMat

 

We click on the “Create” button and carry on.

Pro:

We easily accomplish 2 tasks here, connect to our Google Sheet and create a new Board. We can create unlimited boards at this place, depending on your paid plan.

Con:

The explanation ‘Use index if you want to show it on the homepage of your workspace.’ is not clear enough for a new user.

Interesting:

We can link our workspace also to a Google account other than our login account.

Rating:

⭐⭐⭐⭐⭐

 

4. Board

 

In this board section we can populate our board with sections and blocks. The Board is the basic unit where we create dashboards or progressive apps.

 

5. Sections

 

Before we add blocks, we need to create sections. For that, we click on ‘Settings’ in the top menu bar.

 

Settings option on ChartMat's header

 

We get to the following page where we need to enter the ‘sections’ of our board. Later, we can select the sections by clicking on the respective tab. Optionally, we can enter a name and description of the block and modify other design features and data source, if needed.

 

Setting up your board

 

After clicking on “Save” we land on our still empty ‘Board’ page from where we can add blocks. The basic structure is made now and it can be always changed in the ‘Settings’.

 

Board GUI on ChartMat

 

Pro:

Once we know that we first have to define the sections the setup is easy to accomplish.

Con:

Nowhere is mentioned that we have to define the ‘Sections’ before we add any blocks. The place to define the sections is hidden under ‘Settings’. This is a major flaw in workflow management so I will cut 2 stars because of the lack of clarity.

Interesting:

We can change the board settings at any time, also the number and names of the sections.

Rating:

⭐⭐⭐

 

6. Blocks

 

Forms

Now, after we have set up the sections we can add blocks. For that we simply click on “Add Block” from where we can select the block type we need.

 

Selecting a block type

 

Let us select “Form” to reach the Form Block management page. We give this block a title and select the ‘Section’ (= Tab) where the block shall appear. Then we click on ‘Save’.

 

Section input

 

Now, we have to modify our Google Sheet by hand: We need to add the column names. Row number 1 is occupied by defining the names of each column.

 

Google Sheet test for ChartMat

 

We need to manually sync the changes made in Google Sheet by clicking on the update icon in the upper left corner.

 

Refresh button on data source

 

After that a new partition will open below the Block page.

 

Setting up axes

 

In this partition we select and define the axes (columns in Google Sheet) we want to use. Our changes are reflected in the live preview in the upper right corner. By this, we can say we have a WYSIWYG built-in editor.

Once finished we click on “Save”. We reach the preview board page with the different sections. That’s how the dashboard will look like later when we use it. And here we can start entering our data.

 

Input to the table block

 

These data are automatically updated in the Google Sheet. We can go there and check the same. All entered data are added. Our sample data and our example are just for testing and may not make much sense. Here is what we get after entering some random data.

 

Sample Sheet

 

Charts

 

Now we have defined section 1, the “Input” section. Likewise, we populate the ‘output’ section in a similar way, just that we use the “Chart” block instead. For that, we click on “New Block” in the upper navigation bar.

 

New Block Button

 

We select the block type “Chart” to reach the chart block configuration page.

The block configuration page looks like the following and has two main parts: The upper part is here called “Block Config.” and it defines the X axis. The part below is called “Axes” and defines the y axis or the y axes.

 

Setting up the X and Y axes

 

In the x axis configuration we need to adjust the following options:

  • The Section (in our example it is ‘output’)
  • The X axis (in our example it is ‘Day’)

I am wondering why the option for ‘X axis’ is at the very bottom of the pages since it is of essential importance to do it right. However, not a big issue.

Apart from these 2 essentials I recommend checking out the options ‘Label Position’ and ‘Show Scale Label’ and, of course all other options.

 

Section to output and X axis

 

It is important to note that we can have exactly one x axis only and either one or more y axes.
In the y axis configuration we need to adjust the following options:

  • Add the columns with the related data (here: ‘Guests’)
  • Select the chart type (here: ‘bar’)

Apart from these 2 essentials I recommend checking out the options ‘Internal Labels’ and ‘Duplicate X Axis’ and, of course all other options.

 

Setting up the X axis

 

One thing to note: If we use duplicate values on our x axis, ChartMat automatically calculates either the sum or the average of those. This currently can’t be switched off. However, it makes sense in most of the cases since it eliminates duplicate entries.

Here is how our example looks like in the ‘output’ tab (section):

 

Chart Output on ChartMat

 

Grids

 

By now we have created an input and an output section. The input section serves to enter data by hand while the output section visualizes these data in charts.

Let us test another block, the grid block. We want to display images in a third section.

After saving our block configuration, we get back to the block view in which all blocks and sections are displayed. Let us click on ‘Settings’ in the upper navigation bar to add a new third section. This new section shall have the name ‘Images’ and we want to display images inside that section.

 

Setting up a new section for photos

 

We click on ‘Save’ and aim to add the grid block now. For that we click on the new ‘Image’ tab and click on the button “New Block”.

 

Adding a new block on the section

 

As a block type we now choose ‘Grid’. After that we get to the Grid block configuration page.

Here, the most important options to update are:

  • Choose the right section (in our example ‘Images’)
  • Check out that the right y axis is selected (here: ‘Images’)
  • Detect the type as ‘images’

Please, also check ‘Columns’ and uncheck (if you like) ‘Round Image’.

 

Image type on new block setting

 

Of course, the image will only be displayed if there are images saved in the spreadsheet of Google. It’s important to note that you need to place an image link and not the image itself.

 

Link to the images in Google Sheet

 

After adding the links by hand please remember to reload the data source.

 

Update button

 

Once the section ‘Images’ is configured and saved (please, never forget to save, otherwise all is lost!) we can view the results under the ‘Image’ tab.

 

Grid view showcasing images

 

So, by now we have tested three out of six block options:

  • Tables (data input by hand)
  • Charts (data visualization)
  • Grids (image display)

We can do much more with the blocks, for example creating mini-shops, displaying tables, and using markup language.

Let’s evaluate the block part of ChartMat.

Pro:

Once we get used to the workflow it is easy to follow and to create interesting dashboards and progressive apps. The tab structure is awesome. The configuration options are well thought of.

Con:

It takes some time to understand the workflow, especially what comes first, and what is most important to modify. However, if you read this review you should be able to manage the workflow better even though it’s just a starting point. The learning curve in the block section is ‘medium’ I would say. It requires a little bit of testing around. There are help files also but still not all subjects are covered. We also must take special care to save our work from time to time and, please, don’t reload your browser page without having your work saved before. Otherwise all will be lost. Therefore, I give 1 star less, with the hope that these points will improve in the near future.

Interesting:

We can overlay unlimited different graph types in one and the same chart.

⭐⭐⭐⭐

 

Publishing

 

After we have created our dashboard or progressive app we can go to publish them.

The first step is to make our board public. We can do that in the board settings.

 

Settings option

 

In the settings we need to click — or enable — the option ‘Public’ so that ‘True’ appears.

 

Publishing your boards

 

After (and only after) our board is public we can start embedding it.

For that we click on ‘Embed’ in the upper navigation menu.

 

Embed option on ChartMat

 

We have here 3 options:

 

  • Embed the entire board
  • Embed a specific section
  • Embed a specific block
More options on how to embed your board

 

This is straightforward. After a few clicks the right code is displayed which we can copy and paste wherever we want our dashboard to appear.

Pro:

The embed function is very simple to use. Just a few clicks, and the code is produced in realtime.

Con:

None.

Interesting:

The fact that we publish either the board, a section, or single blocks is awesome.

Rating:

⭐⭐⭐⭐⭐

 

ChartMat Features

 

The main features are:

👉  Embed boards and blocks (via iframe)

👉  Mobile-first platform that can be installed on your phone

👉  Synced with private sheets

👉  Separate user permissions for each workspace (shareable with clients and teammates)

👉  Full customization (add your brand colors and board name)

👉  No Chartmat branding

👉  Access to all templates

👉  Custom Domains

👉  Integrations: Zapier, KonnectzIT, Pabbly Connect, and whatever integrates with Google Sheets

👉  Unlimited boards

👉  Unlimited rows

👉  Embed boards and blocks

👉  Workspaces

👉  Users

👉  And more…

 

ChartMat’s Competition

 

In this review article we also want to focus more on the usability test of ChartMat against its competition. It would go too far to include a comprehensive competition comparison here. However, let’s mention 2 similar apps to ChartMat:

 

Glide vs ChartMat

 

Glide or Glideapps describes itself as a tool to“build a powerful, data-driven app or website, without writing a line of code.” Glide has been on the market longer and therefore has a more polished user interface.

According to ChartMat, Glide differs from them in the following ways:

  • Both Chartmat and Glide use spreadsheets as their main data source.
  • Glide automatically imports all the data into the app (which doesn’t always work as you would like with custom data). Chartmat lets you select the specific data intervals that you want to display.
  • Glide is focused on mobile Websites and Apps. Chartmat is focused on Dashboards, Charts, Data Visualization AND Apps.
  • Chartmat works with blocks. Glide doesn’t divide the space into segments. Glide can be best compared to Chartmat’s Grid block.
  • Chartmat is potentially easier to get started with and allows for more customization
  • Glide is more targeted at building apps for end users (consumers), Chartmat is more targeted at building dashboards for businesses.
  • Chartmat allows for further customization with HTML, CSS
  • To summarize it: Glide is built with the idea of the final app in mind. Chartmat is built to use data that already exists in your spreadsheets and that you need to visualize/build an app with.

 

Grist vs ChartMat

 

Grist also can generate dashboards which can be embedded on websites. However, the main difference is that Grist is not linked to Google Sheets but that it is 100% based on database architecture. Therefore, Grist has a steep learning curve. If you know about the principles of database structure and if you have some knowledge of Python programming then Grist is an option but not a real alternative to ChartMat. The way to build dashboards and apps is definitely much easier in ChartMat.

 

Conclusion

 

ChartMat is a dashboard and progressive app creator built on Google Sheets. We can either add data by hand or fetch data automatically from outside through integrations. Once the data land in Google Sheet, the dashboard will be updated automatically and in real time. Everything can be embedded on a public website or viewed in private.

The ChartMat workflow is easy to follow until we get into the block configuration pages. These block pages do not look very modern and it will take some time to become familiar with them. Help files are available but still some important topics are missing. I would wish that the workflow in the block part would be more intuitive or even guided or visual.

However, once we know the tricks and secrets, ChartMat is very easy to use, and very powerful dashboards and apps can be created fast. Compared with alternative software based on databases, ChartMat with Google Sheets is made for non-coding users. You don’t need to have an extensive coding knowledge to get started. ChartMat is very versatile and we can build very diverse types of dashboards. The template section can help us in getting started quickly even though I would like to see more templates being added. Finally, ChartMat is mobile-friendly, has just released new filter options, and has the ‘power of simplicity’ as a guiding principle.

Two things ChartMat needs to improve first is to modernize the UI and to make the UX more intuitive. Apart from that, the concept of ChartMat is awesome and I believe in its bright future.

All together, and by seeing the team actively developing ChartMat toward a bigger brand I would give it an overall 4 out of 5 stars. By averaging the stars above, we would arrive at 4.3 stars.

 

⭐⭐⭐⭐

 4 out of 5 stars

 

We hope that our ChartMat review has been helpful to you so you’ll be informed of the capabilities of this software. You can find more of our reviews here.

 

Get fresh updates in your inbox 👇

Ken Moo