How To Create Outstanding Modern InfographicsTutorial Details
Download Source Files
![]() Step 20Ungroup your graph so that you can make visual edits to it. Below, I’ve condensed the graph so it looks taller rather than wider. Of course I could have just drawn the box for the graph tall but this is after the fact. ![]() Step 21Below, I want the text that corresponds with the graph to be a set width. To accomplish this, use the Text Tool (T) and click and drag from the top highlighted circle to the lower highlighted area. This will predefine the text area so the information fits perfectly between the guides. ![]() Step 22To create the icon of the man, use simple shapes. Start with the Rounded Rectangle Tool. Adjust the radius of the corners by holding the up or down arrow as you draw the shape. ![]() Step 23Draw a rectangle with no rounded corners for the torso. ![]() Step 24Use another rounded rectangle for the shoulders. ![]() Step 25Finally, use an ellipse for the head. Select all the individual shapes that comprise the man and in the Pathfinder click Unite. This will give you one solid shape. ![]() Step 26To create a more stylized graph we’ll use the man to represent the information. Using the Stacked Column Graph Tool click and drag to draw the graph the same height of the man. Enter your variables then click the checkmark icon. ![]() Step 27Ungroup and get rid of the other numbers and lines. Using the Pathfinder Palette again, click Divide. Now, each section of your man is divided into accurate sections. Ungroup all the shapes and get rid of the extra gray shapes around the edges. ![]() Step 28Separate each section of the man by selecting them using the Selection Tool and pressing up or down once. ![]() Step 29To create the scissors you’ll need to use the Pen Tool (P) and freehand draw the shape as shown. ![]() Step 30This graph is created using the Line Graph Tool. ![]() Step 31Add the key to the bottom manually and the figures above the points manually. ![]() Step 32The last graph is created using the Stacked Bar Graph Tool. Again, add the details manually. ![]() Step 33To add some interest to the design I’ve layered in the circle graphic behind the graphs. There is no secret to the process… as long as it looks good and helps balance the design, go for it! ![]() Step 34To create the list of comments draw a text box like we did in Step 21. ![]() Step 35Since comments will span from one box to another click the plus sign in the bottom right corner then click anywhere on the page and a new linked text box of the same size will be created! ![]() Step 36When dealing with large amounts of text it’s a good idea to create styles for that text. In this case I’ve created a style for the date and tutorial title. Styles make it easy to change all the text at once if you ever need to go back and make a change to color, size, font etc. To create a style first select the text that you want to style. Next, in the Character Styles Palette (use the Paragraph Styles Palette if you’re styling a paragraph of text) click Create New Style. ![]() Step 37Double click the new style in the Character Styles Palette to open up the options panel. In the options panel adjust your text to suit your liking. Click OK. Note: Even though you check Preview, new styles that haven’t been applied can’t be previewed. ![]() Step 38With your text that you want to style still highlighted, SLOWLY double click on the style in the Character Styles Palette to apply the style. ![]() Step 39I’ve created a style for the tutorial title in addition to a style for the date. ![]() Step 40Finish your design by adding any pertinent details to the bottom. ![]() Final Image PreviewThat’s it! You’ve just learned how to create a modern infographic. ![]() |
|