1 – Datawrapper
Checklist – visualizations: Make sure all the following is included/correct in every visualization:
- All numbers double checked: done through comparison with source
- Headline/title: done
- Spell check: done
- Axis and legend titles (If possible. Otherwise described in caption): I think in this case there is no need since it is clear that X-axis shows years (as usually happens in line charts) and Y-axis name is described both on the right and by the title
- Units: not needed in this case
- Y-axis starts at 0: done
- Conscious choice of colors – (explained on request): since it is only one line, any dark color on white background will be seen by every type of user
- Source: done
- Instructions for use (when needed): not needed
- Context or explanation (when needed): done
- Byline: done
- Accessibility (contrast, caption for screen readers, attached table etc) (explained on request): Alternative text has been provided. See also "Conscious choice of colors"
- Understandable for someone who sees the visualization for the first time: I think it is understandable since it represents a trend on only one line over time and there text to give context
(show it to someone outside the newsroom) - Url with the visualization checked on a mobile device: https://www.datawrapper.de/_/suxhw/ (since the visualization is iframe is set on Responsive mode, it should work on mobile)
Checklist – visualizations: Make sure all the following is included/correct in every visualization:
- All numbers double checked: done through comparison with source
- Headline/title: done
- Spell check: done
- Axis and legend titles (If possible. Otherwise described in caption): I think in this case there is no need since it is clear that X-axis shows names of countries and Y-axis name is described by the title
- Units: not needed in this case
- Y-axis starts at 0: done
- Conscious choice of colors – (explained on request): having a different color for each column can be confusing and less accessible
- Source: done
- Instructions for use (when needed): not needed
- Context or explanation (when needed): done
- Byline: done
- Accessibility (contrast, caption for screen readers, attached table etc) (explained on request): Alternative text has been provided. See also "Conscious choice of colors"
- Understandable for someone who sees the visualization for the first time: text and title add context to a simple column chart
(show it to someone outside the newsroom) - Url with the visualization checked on a mobile device: https://www.datawrapper.de/_/9QIxn/ (since the visualization is iframe is set on Responsive mode, it should work on mobile)
Other layout choices: in order to to make the more readable, some names of x-axis labels have been abbreviated (ex. United State of America > USA) and values has been added to the top of the columns.
2a - Infogram
Same choices as first exercise
2b - Flourish
Same choices as first exercise
2c - Evaluation
- Smartphone: How do the charts from the different tools appear on your smartphone? Are there any problems? Every chart is responsive
- Colours: How easy/difficult is it to change colors with the different tools? In no one of the tools changing colors is difficult. Probably the most user-friendly for this scope is Infogram.
- Text/labels: How easy/difficult is it to work with text/labels in the different tools? Infogram is the most uncomfortable tool. Flourish allows higher customization of the text as it permits to write HTML code in the header, the footer, the legend and so on. Datawrapper allows inserting notes and shapes inside the chart, which could be useful for example to underline a peak in the data and explain something about it.
- Flexibility: How flexible are the tools? Can you make the changes you want to do? Flourish is the most flexible tool, Datawrapper is the second one.
- Accessibility: Which different options for accessibility do the tools have? Every tool allows the designer to include alternative text in the chart. Datawrapper provides specific checks for color blindness.
Conclusion
What are the main benefits of:
- Data wrapper? Inserting notes and shapes in the chart, checks for color blindness.
- Infogram? It's a tool I don't like so much. As the name suggests, it's more useful for infographics than for data visualization.
- Flourish? High flexibility and interactivity make Flourish the best of these 3 tools.
Geoviz 1a
Google my Maps
Flourish
Geoviz 1b
Datawrapper
Flourish
Geoviz 2A - Datawrapper
Geoviz 2b - Datawrapper
Geoviz 2c - Flourish
Geoviz 2d - Flourish
Are they ok? Can you see the tooltips for example? Is there anything you have to change?
Describe your experience and how you solved the problems (if there were any) in your post at the website.
Every map is responsive. The tooltip experience is obviously less user-friendly since the user has to click on the regions instead of hover with the mouse