Home Graphic Design ARTICLES Article Details
Graphic Design
How It’s Made: Learn How To Create Your Own Infographic With Designer Mike Wirth
Posted 02/28/2013 11 minutes
By Brad Zomick
By Brad Zomick

It’s hard not to notice the explosion in the use of infographics on the web today. However, the infographic is a concept that is far from new – think back to your elementary school textbooks, where pictures told the story of an abstract concept. Or USA Today, which has been running with an infographic on their front page every day for as long as we can remember. The infographic is the solution to a basic problem: how can we make complex and mundane topics easy to understand for a broader audiences? In an age where content marketing is more important than ever, the infographic presents a solution – but they are not particularly easy to create. We take you through the skills and tools needed, and the key phases of creating these visually stunning and highly informational graphics.

Meet Mike Wirth, World-Class Infographic Designer

This week we had the great pleasure of discussing how to create your own infographic with Mike Wirth, infographic designer, artist, and Director of the New Media Design Department at Queens University in Charlotte, NC. Mike’s predisposition for design came at young age. Growing up in Long Island in the 1980’s, he was fascinated with graffiti. He also loved National Geographic, which is known for taking readers on a visual journey. Finally, he grew up playing original Nintendo games like the map oriented Legend of Zelda, which developed into an obsession with maps. These all became sources of inspiration for many of Mike’s designs.

Mike-Wirth-Potrait-Screenshot

Mike Wirth, Infographic Designer, Educator, and Artist

Mike first started studying design in high school while participating in a vocational training program during his junior and senior years. Mike continued his studies in design and received a BA in Digital Art and Design from Long Island University, and an MFA Parsons School of Design. After graduating, like many designers he got involved in freelancing, working on a variety of design projects from website design to video production. He did his first infographic for the Siemens Cogeneration Power Plant at Hudson Valley Community College in 2004, back before infographics were popular. The graphic helped explain the complex process of converting methane from a landfill to electricity used to power the HVCC campus, and is still displayed in a museum on campus today.

After that Mike went back to working on different design projects (and now even has a resume infographic to display that). During the 2006 mid-term elections, infographics starting gaining popularity, and Mike was turned on to them by Randy Krum, a friend and collaborator, and curator of Coolinfographics.com, a popular infographics blog. He started making his own for fun and to build his portfolio. In 2008, he teamed up with his father-in-law, Rick Lyke, a drinks journalist that writes for beer and wine magazines. They worked together to create the Best Beer in America Map for Rick’s blog, Lyke2Drink. The graphic went viral over night and put Mike on the map in the world of infographics. In 2010, Hubspot hired him to do a Twitter Map. That’s when the onslaught of e-mails and calls started coming in. Since then he has done graphics for many well-known organizations including GE, Yum Brands, Mozilla, and USAID.

Behind The Scenes

We have all thought, “Gee, that is a cool looking infographic. How the heck can I create my own?” Well today you are in luck because Mike is going to take us behind the scenes to see how he and his co-conspirator, Suzanne Cooper-Guasco created the ‘How Our Laws Are Made’ infographic. In 2010, Professor Cooper-Guasco sought out Mike’s help in preparation for the Design For America contest. The design was critically acclaimed and took first place. Since, it has been republished by the Washington Post, Huffington Post, The AtlanticComedy Central, and is the feature graphic on Wikipedia‘s Procedures of the US Congress Page, so it is a prime example of how a great design can be come viral.

How laws are made infographic

How Our Laws Are Made’ created with Suzanne Cooper-Guasco is one of Mike’s most viral infographics.

What Skills & Tools Do I Need

Before we get down to the nitty-gritty, we had to ask Mike about the skills and tools involved with creating your own infographic. Mike says, “Believe it or not, infographics design is a hybrid of many skills. Aside from the obvious graphic design skills, you need to be adept at market research, analysis (math, statistics, etc.), and data visualization.” If you are weak in one of these areas, don’t worry because the creation of an infographic is often a collaborative effort.

Information design is also a crucial skill. To be a good infographics person you should be comfortable with data, which can be ugly, tedious, and cumbersome. To be a pro at slicing and dicing data, you are going to want to brush up on your math skills as well as graphing and charting skills. If you are not a natural math whiz that’s okay too, because tools like Microsoft Excel make working with numbers a lot easier.

chart of what people call each color

It’s an infographic designers job to take an ugly pile of data and make it look pretty.

It’s an infographic designer’s job to take that mess of data and make it beautiful. That entails be able to think and visualize the data and see the “colors” of design. Designers often use the LATCH method, which will look data through the lens of its Location, Alphabetical order, Temporal (time) position, Category, or Hierarchy. The Cadillac of infographics is in interactive modules that involve people, much like you might see in a museum. Once you get into interactive infographics, designers need knowledge of user experience design (UXD) to help  get inside the mind of the user and create an ideal interactive experience.

In terms of design, an infographic designer needs to be able to draw and sketch. Most preliminary ideas and sketches are done in brainstorm sessions with whiteboards and notebooks. Once you get to the design phase there are lots of tools that can be used. For static infographics, Adobe Illustrator is the tool of Mike’s choice, as it is best for vector-graphics editing. Vector graphics are lines, shapes, and curves that are based on actual mathematic expressions and hard data, so Illustrator makes it easier to play with data and resize corresponding objects. It’s also better for maps. Photoshop is also be used but it’s more so for designing the aesthetics of an infographic.

Mike also happens to do fair amount of animated and interactive infographics, and has done some very cool projects with museums in Charlotte. These infographics require additional toolsets. For animation and 3D graphics, he recommends using Adobe After Effects. Interactive design is considerably more technical and has an array of options including HTML5, D3, Actionscript, Flash, Java, C++, and Processing, all of which are programming languages. This may seem daunting but the good news is that most of the infographics you see online or in print, including ‘How Our Laws Are Made,’ were done with Adobe Illustrator and Photoshop, which do not require learning how to code a programming language.

How’s it Done!

I’m sure most of were thinking that infographics were all about designing but a large part of the process is really preparing for the design stage. As Mike says, “The first thing you need to think about is data, then structure. Styling is the final consideration in the process.” The truth is no two design processes are alike, so conveniently Mike devised a subway map-like infographic to help explain the creative process. As you can see the process contains many back loops.

How to transform info infographic

Mike created an infographic to describe how he makes an infographic. Its not a straight line but a series of looping tunnels.

1. Conception

The first step is to come up with a great concept. Mike and Susan came up with the ‘How Our Laws Are Made’ concept because it tells a great story most Americans learned once in high school but have long since forgot.

2. Data Analysis

Next you need to conduct thorough conceptual due diligence and market research. Susan was given the difficult task of sifting through the vast amount of information out there and aggregating into one place, and making sure it all corresponds to what is currently reflected in the Library of Congress. But that’s not enough! The content needs to be simplified. As you might imagine, the rules behind bringing a law into effect are guided by series of complex and jargon laded bylaws. Nobody will be able to read an infographic written in legalese so it all needed to simplified and translated to terminology and wording that most people use on a daily basis.

3. Visual Metaphor 

An infographic needs a great visual metaphor. On this project, it was Mike’s responsibility to come up with a visual structure that would help readers make a connection to the underlying information. Some of the initial structures considered included an assembly line, canal lochs, and even a distillery! In the end, Mike used elements of a fun board game structure that was akin to Candy Land or Chutes & Ladders but in the shape of an inchworm, something that would readers could connect with and help get them excited to read the content.

4. Design

Infographic design is an iterative process that is constantly changing. With the layers and complexity required in designing an infographic, it would be difficult to summarize all of this design processes in a single paragraph. Mike may even have trouble distilling that into a short novel! The good news is Mike has published a series of learning videos to help you design fun and accurate infographics.  The following video tutorial explains how to create custom timelines via brushes for infographic and information design. For those who seek more, he has posted 25 additional videos that cover other aspects of making infographics in Adobe Illustrator.

5. Publish & Socialize

What we are all forgetting that is that one of the main reason infographics are created is so they can be shared, and often business seek to create a viral effect that will link back to their website, and help them generate credibility, trust, and authority. Thus for businesses, infographics are actually an exercise in marketing, specifically public relations and branding. Mike’s partner, Brittany Lyke, helps with that aspect of the business.While Mike works on the design Brittany is simultaneously doing keyword research to make sure the title of the graphic is something people are looking for. The title not only needs to be search optimized but it needs to be an exciting and buzz worthy title. Once that is set she generates a list of blogs and industry contacts that would be interested in the infographic. Mike and Brittany also have a good reputation in the infographic design industry so they use that footprint to push the graphic out to all of the relevant sites (Visual.ly, Information Aesthetics, etc.) where the graphic can get viewed and shared by millions of people. According to Mike, “If you’ve done a good job getting the word out there, the Pulitzer Prize of infographics is getting republished on Fast Company and Guy Kawasaki’s Holy Kaw.”

I have No Design Skills, Can I do this?

Wow! That was cool, so of course we asked Mike, if people could still create their own infographic with limited design experience, and the answer is YES! There are many tools and templates available online that can help someone with limited experience create their own infographic. Two such tools, Mike recommended checking out are Easel.ly and Many Eyes from IBM. There are also many people cobbling together infographics from stock images found online, with charting tools from Microsoft Excel and Apple Keynote. Another data visualization program, worth noting is OmniGraffle, which good for creating diagrams, flow charts, and illustrations, but it is sadly only available for Macs.

Omnigraffle visualization software

No design skills, no problem with OmniGraffle design software.

Another option you would never think about is to simply draw a picture and take a digital photo of it! One great recent example of this is the South of Power (SoPo) infographic that went viral in the New York area during Hurricane Sandy. Jessica Haggy of Indexed has been doing this since 2006 has three books of hand drawn infographics, and has been featured in other books about infographics. In fact, one of Mike’s most widely viewed infographics was hand-drawn. This past October, the Wall Street Journal contacted him to do a graphic on the Foreign Corrupt Practices Act. He first submitted a sketch, and then followed up with the rendered version, but the WSJ editors ended up going with the hand-drawn cartoon infographic!

If you want to scratch the surface and start learning more on your own, Mike recommends checking out, The Information Design Handbook which he uses as a text book for his class. Mike also has his own YouTube Channel where you can see how he makes his infographics. He also recommended checking out Tuts+ but generally takes the homegrown approach to learning, and recommends to his students that they forage online for resources on their own. He tells them, “I am not going to be there when you graduate, so you need to be ready go ‘in to the wild’ and find the answers yourself.

Yeah, it’s not that easy. But it’s also fun.

If you are successful in creating your inforgraphic, it has the potential to go far and wide in a short amount of time. We don’t want to delude you. Creating your own infographic is not easy, and getting it to go viral is even harder. With the explosion in use of infographics, run of the mill infographics are a dime a dozen. So, to get noticed your graphic has to not only look good but be thoroughly researched and tell a great story. Thus, outsourcing it can be a gamble. If you go that route, you have to not only work with the best, but stay involved in the process, especially during the research and conceptual development phases. Suzanne Cooper-Guasco and Mike Wirth are a prime example of how to collaborate on an inforgraphic. Since the publishing of ‘How Our Laws Are Made’ in 2010, it has been republished on over 600 times websites and blogs, and those articles have been tweeted and shared countless times, which is incredibly valuable for SEO purposes, as well as educating the public about an important message.

These days Mike is producing about 20 infographics year. That is about to change as he just started a multi-book partnership with textbook maker, McGraw-Hill. We pointed out to Mike that it looks like he is having a lot of fun while doing these infographics, and he said,  “That’s the way it should be. If you want to make a great infographic, pick a subject you know and love and it will not only be fun but informative and shareable.” Mike says that while his beer and Twitter map infographics were the most viral, his favorite is a Hanukkah infographic he made on his own, to help him explain the holiday to his friends in North Carolina. What started as a for-fun project was soon being republished and shared by Hillel, a Jewish collegiate organization, and colleges like Baruch College and Yeshiva University. Eventually it was published on HolyKaw and he received a call from the National Parks Association to produce an infographic about salmon spawning with a similar layout and background!

Hanukkah infographic

The Hanukkah infographic is one of many Mike designed to teach his friends in North Carolina about Jewish holidays.

You can’t expect that you will be able to create your own infographic at the same quality as Mike on your first try, but you certainly can’t get anywhere if you don’t give it a shot. While any content creator has a large incentive to get started and design infographics, this is particularly important if you work in an industry with mundane, or relatively boring content — infographics can breathe some major life into your content creation efforts. However, this guide is just that – a guide –you gotta take the next step.

Welcome Back!

Log In

Log In
  • Enter your email address to reset your password.
    ×