Visualize your data in style!

I discovered the profession of Information Designer through the inspiring work of Federica Fragapane, which consists of making the data visible, in particular the encrypted data.

Surely you have happened to have tables of numbers for several variables, and you have set out to present them in a graphic form rather than communicating them in their raw form. Perhaps you have said to yourself that the easiest way is to make a graph by variable. For example, countries according to GDP, then countries according to their number of inhabitants, then countries according to their population density, etc. But by separating each variable in this way, you ask your reader to cross-reference the information himself. So, why not produce a visual that brings together several layers of information?

This complex, enriching and essential work is called data visualization. And I am going to present you here a method and tools allowing you to push your skills and your curiosity of designs further!

Personally, I learned a lot by learning about this discipline, and I intend to use these new dimensions of knowledge in the development of my genetic data visuals as part of my thesis and the communication of my research work. . Applying newly acquired knowledge to an area that interests you personally or professionally is a good exercise that allows you to deeply integrate these new skills.

Below are simply presented the different stages, from data collection to the production of your visual, and for each stage tools or sources of inspiration that may be useful to you.

1) Collecting information

If you are at the beginning of your project, you must necessarily go through a data collection stage, either by going to seek them from different reliable sources (if you are carrying out bibliography work) or by producing your own data yourself. (through experimental work).

Here are some reliable sources of information: scientific articles published in journals after peer review. You can find this kind of article by keyword research on PubMed, Google Scholar, Our World in Data or World Bank for example, or the Researcher mobile application. Among the most famous scientific journals we find Science, Nature, Elsevier, … Some are more specialized than others (Cell biology, Medical biology, Physics, etc …), each field having its major scientific journals. Regarding Our World in Data and World Bank, you can directly download their data tables on the topics that interest you.

2) Gather, organize, sort

Once you have collected all the data you want, you need to collect it in one place, for example the same spreadsheet. To do this, you can use Excel from the Microsoft Office suite, Calc from Open Office or Libre Office, or Google Sheet for an online spreadsheet.


Once you have gathered all your data in a table, and you have given clear names for each of the columns, it is time to sort them: you may not be interested in all the data. Maybe you will focus on a period of time, a small number of countries, or whatever depending on your subject of study. So get rid of the data that does not interest you, and take stock of the number of variables you have left.

3) Define a visual model

Once you have listed all the data that interests you, prioritize them: put on one side those that are essential (the heart of your subject) and on the other those that serve to place a context. For example, suppose you are interested in CO2 emissions by country. Your main variables are: countries, and CO2 emissions. But to understand the difference in CO2 emissions between countries, you need a context, for example: the number of inhabitants of the country, its size, its GDP.

For each variable, define its own graphic design: this is your graphic alphabet, your visual language. Each piece of information can be represented by a different graphic: a difference in thickness, shape, color, opacity, size, position, texture, orientation, multiplicity of objects, etc.

For example, in our example on CO2 emissions, we could represent each country by a circle, and the quantity of CO2 emitted could be represented by a difference in size of these circles. We can then combine several variables at the same point: the color of the circle may change depending on whether the country belongs to a particular continent, a difference in opacity may be added to give an indication of the population density, etc. Thus, you create a visual containing multiple layers of information at one time. And because it is a complex visual, the legend must be done extremely carefully: each graphic element must be explained!

Attention, a very widespread idea is that a visual must be able to be understood very quickly and without effort. This is not true, it depends on its information content. As Federica Fragapane says, there is this same difference in complexity with the text: we can treat the same subject in 120 characters in a Twitter thread, or in 120 pages in a thesis, and the content could be good in both cases. quality. It just doesn’t have the same depth of complexity. Well it’s the same for the visuals!

4) Get inspired to open up the field of possibilities

Do not hesitate to take inspiration from what exists around you. Le Data Viz Project website provides a very complete panoply of the different existing graphics, which you can even consider combining with each other. Each type of chart is explained, and examples are given for each.

Another source of inspiration, essential for the design of personal, original and aesthetic visuals, is to seek images outside the fields of our subject of study. For example, in the form of the living world (algae, leaf veins, etc.), mineralogical, fantastic, etc. according to your own interests. Pinterest is a good tool for researching and collecting inspirational image banks.

5) Design the visual form of your data

Definitely my favorite part: take your pencils! Design on paper (or graphics tablet) the way you want to make your data visible: indicate your axes (abscissa and ordinate), use the visual alphabet that you have previously defined and combine each element in the clearest and most aesthetic way possible. The search for the best combination, the best arrangement, can be laborious: it is, therefore, a step that may take longer than you think and which should not be taken lightly! It is from this research that you will be able to come up with your best visual designs, so don’t skip this step.

6) Create a base

Now that you have defined what you would like your data to look like, let’s move on to creating the basis for your visual. A useful tool to help you is RAWGraphs, an online software where you can directly upload your data table. Then, select a graphic base for your visual, the one that you think is closest to your diagram. And you can then customize this base.

At this stage, two possibilities are available to you. Either you are already happy with what you got and don’t want to spend more time working on visualizing your data, or you want to take the design further, because your diagram on paper has led you to creations. original that you would like to implement, and in this case … Welcome to Illustrator!

7) Add multiple layers of information and bring an artistic touch

Illustrator (from the Adobe suite) is certainly paid software, but terribly useful for producing vectorized visuals (i.e. you can zoom to infinity, your image will never be pixelated), professional, on which you can then accumulate all the layers of information that you have gathered by listing your variables and making your sketch on paper.

The automatic alignment tools, whether in Illustrator or Inkscape (free software of which I have already described one of its many extraordinary features here) are extremely effective and work greatly to render your visuals impeccable! Another little-known tool in Illustrator is its charting-from-data feature (much like a built-in mini Excel), which is very handy for designing shapes with sizes proportional to your data.

Here you will be able to create artistic forms inspired by your image research and personal inspirations.

Federica Fragapane thus creates original and clearly inspiring visuals, examples of which you can find on the portfolio Domestika and below:

8) And finally, we take care of the typographies!

What will bring the final, but essential, touch to your visual is your choice of font. Take your list of variables and choose a more visible font for the main variables. Be careful, as explained in the last Tuto Grapho that I proposed to you last month (to read again here (fr)), choose a maximum of 3 fonts for the whole of your visual! One for the main title, one for the captions, one for the rest (variables and axes) for example. If you need to distinguish more than 3 elements, play with the differences in the font sizes or make them bold or italic. Too many different fonts will make your look flashy and take away credibility from your design.

I offer two free downloadable typography banks: Google Fonts and Dafont.

That’s all for today! I hope this article has shown you a different perspective on data visualization, and maybe you would like to try applying the concept to your own study topics?

And to make you dream a little, take a look at Federica Fragapane’s Instagram account: link here ! And to take his online course: Domestika, data visualization and information design.

Spread the word. Share this post!