The best Business Analyst (BA) Web’s infographics are self-contained summaries of what the reader needs or values. They should be designed to display content in clear ways, so everyone can understand complex relationships, cause and effect or patterns quickly.BA Web has an extensive library of charts, tables, interactive maps and easy to customize templates to help you to present information and convey insights in impactful ways that communicate the most important facts quickly and clearly.
Here’s my Top 10 List of key features to make your infographics better:
1 – Floating Panels
2 – Conditional Images
3 – Copy Element from Another Template
4 – Share an Infographic Template
5 – Multi-Area Comparison Table
6 – Comparison Geographies
7 – Nearby Tables
8 – Conditional Style Lists
9 – Background/Overlay Images
10 – Copy Cell Style or Conditions
Each of these features improves your workflow and the reusability of your best infographic elements. I think of my infographics as a reusable library of styles and components that I can use to quickly build a new design to meet the specific needs of my audience. Thinking about infographics in this way and curating my ever-growing collection of design elements has saved me hundreds of hours working on new ideas, concepts and customer focused designs.
Let’s explore the Top 10 List in more detail:
#1 – Floating Panels
Most of the Esri infographic templates use a grid design, where each element in the infographic fits into a specific cell on the grid. This makes it very easy to create uniform templates that are aligned both horizontally and vertically. While you can merge and resign individual cells this has an impact on other cells in the template, so all designs look very rectangular.
Floating panels remove those constraints to allow you to design panels which can be of any size, live anywhere on the canvas and overlap. You get pixel perfect control of the size and positioning of each elements. Three other capabilities make this my number one feature – alignment, display order settings and automatic resize.
Like PowerPoint or other design software, you can align your elements with other objects on the canvas and you can change the order of panels to send them backwards or forwards in the display. This lets you float text boxes as titles in charts, build compound elements or move infographic “furniture” such as your company logo, copyright information, data source references. All of these non-interactive elements are best moved into the background allowing your to you work more productively on the key charts, tables and graphics that are the meat of your infographic.
Finally, when you resize a floating panel sub-element, like images and text, it will automatically resize, so you make any individual panels larger or smaller with confidence.
The Tapestry Profile infographic above uses floating panels extensively to align logos and titles to the design, add text such as Household Income/Home Value index over the key facts infographic and turn a square map into a teardrop shape.
#2 – Conditional Images
Any attribute can be restyled using conditional text and image formatting. In the 3D Graph example below, conditional image rules based on the percentage of people in each educational attainment group has been used to create a stacked cylinder graph. The graphs grow and shrink with the variations in each class, and the graphs are labelled, using a floating panel, within the chart.
Conditional images and floating panels were used to construct the Age Profile chart as well. Each age band is sliced into 10 categories with a different size and colored bar for each category. Using conditional lists (Number 8 below) I copied the style for each of the 18 bands and aligned and ordered the elements to create the bar graph.
#3 – Copy Element from Another Template
I often reuse and restyle elements between infographics. My Home Affordability design uses multiple elements which were copied from other infographics in my library. The donut chart of educational attainment was restyled from a bar graph in another design and the workforce profile was reoriented from horizontal to portrait to fit this new design layout.
By using a design theme I could quickly change the blues in my original to the all-white style of this template. Design themes and infographic style didn’t make my Top 10 list but they are fantastic ways to add your corporate branding and quickly restyle infographics to your needs. I encourage you to check them out.
#4 – Share an Infographic Template
Shared templates let you and everyone in your organization get access to the best work, designs and elements. Esri has provided a “starter kit” of design that I copy from all the time and I shared a couple of my designs, the Executive Summary and Tapestry Profile infographics, with the development team who added them into BA Web so now every user can access them.
The data summary descriptions in the Chain Link infographic shown below are often copied by my team members to add to their own designs.
#5 – Multi-Area Comparison Table
Typically, infographics are compiled for an individual area. Multi-area comparison tables let you see the demographics or site attributes of multiple areas side by side and compare your functional geographies – like drive times and rings – with formal geographies like post boundaries, counties, urban areas or the entire nation.
Multi-area comparison tables also allow you to interactively highlight the characteristics of each area by hovering over the map or a column in the chart. Better still any column can be sorted or filtered to show which geographies match your leading indicators. For example, if you are looking for areas with income above the national average use a filter to select just those geographies. All data can be swapped between a table and chart view to provide different visualizations.
In the CCIM Benchmark Demographic example shown below, I have grouped key attributes like generations and age profiles together, while other tables contain key facts by topic.
#6 – Comparison Geographies
Charts can also be visually compared with different geographies. In the Site Summary infographic below, graphs and tables have a drop down which allows the user to compare the current area with other formal geographies they cover like ZIP code, counties or states. If an area covers multiple formal geographies they will be shown in the drop-down list, just like in multi-area comparison tables.
When using comparison geographies in charts the details of the formal geography will be shown as a line on the chart, so the reader can quickly view differences. Once again, the panels allows you to switch between chart and table view.
#7 – Nearby Tables
Nearby Tables are another interactive feature which can be added to infographics. Esri has a curated list of businesses by type which you can automatically add as a table and interactive map. In addition to restaurants, shops, convenience stores, etcetera, you can add your ow nearby point using maps from ArcGIS Online. The Nearby Tables show which points are in your current trade area and how far away they area from your site.
In the What’s Nearby example below, I have added schools, parks, libraries and other destinations published by the City of Los Angeles into a residential neighborhood infographic. Each table lists the closes facilities, which can be filtered by name, direction or distance. Schools, hospitals and parks are shown with different symbols in the map and hovering over the map pin highlights the feature in the corresponding table.
I particularly like the fact that I can add a data source, like farmers markets, as a table but not show it in the map. This reduces map clutter and improves readability, while still providing a dynamic table of points of interest.
#8 – Conditional Style Lists
I often need to develop tables that reuse styles and images. In the Segmentation Summary infographic below, I am comparing 9 different attributes for each of the 14 Tapestry LifeMode groups. The color and size of each dot in each cell is determined by the value average value of the attribute for each segment with 9 different conditions for each attribute. That’s 1,134 different conditional tests if I were to hand code each one!
Conditional lists let me set up a rule set that I can apply whenever needed. Each list contains the categorical groupings (greater than/less than XYZ) and the image used for each category. By applying a list, I can quickly slice any variable different ranges and then style the text according using font and background colors or replace the text with an image. If I need to use a different category interval or style I can simply edit the currently styles and rules which is considerably faster than defining those rules each time. Similarly, if I need fewer or more conditions I can add or subtract them and be assured that I maintain the same style rules.
Conditional lists are my secret weapon to creating many different visualizations but there are some many other features I love that it came in at Number 8 on my list.
#9 – Background/Overlay Images
Another secret weapon is using images behind or above other elements to enhance them. In my Key Facts infographic, I use an overlay image to turn the map into a porthole and as the honeycomb background. By using floating panels, I can accurately position, align and group the 19 different facts into the center of the honeycomb image.
Many other infographics like Chain Link, Tapestry Profile and Home Affordability use images to enhance the design or provide the reader more information using legends and key art. I often use transparent and full-page images to add design effects to infographics such as drop shadows, texture and brand colors.
#10 – Copy Cell Style or Conditions
Last but certainly not least on my Top 10 List, is cell-based copy and paste. I built the crazy retro Sound Deck visualization using almost every one of the non-interactive features in this list. It used background and overlaid masking images, 3D shadows, conditional lists to add textures to each cell and multiple, floating panels to develop the entire effect. Key to achieving the final product was my ability to copy and paste styles between cells and data variables.
The slider button visualization was created using a conditional style in a table that contained 10 different variables. I wanted each variable to be shown in a position that reflected its variation from a target score. By copying the style of my master cell, I was able to style each column in the table in a consistent way. Using a conditional style meant only needed to change the ranges for the different variables. I also used this technique to set the text style on the read-out displays in the bottom right of the infographic.
Give It a Try Yourself
Creating beautiful, communicative infographic designs in BA Web is much easier than most people imagine. Each one of these techniques takes just a few minutes to learn and master. With a little creative flair or inspiration that you find in other shared infographics or on the Internet, you’ll be well on your way to helping your reader understand much more about the demographics of an area that they can get from simple tabular reports.
Commenting is not enabled for this article.