1. An Overview of INFOGRAPHICS Webinar, Wednesday, November 14, 2012 Brandy Thatcher, Instructional Media Developer & Mehdi Zadeh, Instructional Technologist Teaching & Learning Center, Illinois Central College Visuals Knowledge Data This presentation is available at www.slideshare.net/icctlc2www.slideshare.net/icctlc2

2. WHAT IS AN INFOGRAPHIC Data visualizations that present complex information quickly and clearly. Visual representation of data, information, and/or knowledge Visual elements - colors, graphics, icons, signs, maps, etc. Content elements – text, facts, statistics, time frames, references Knowledge – the facts and conclusion to convey the overall message or story

3. Infographics as a Creative Assessment Watch the video by Kathy Shrock http://vimeo.com/25328216# A great overview and visual introduction to Infographics

4. Introduction to Infographics How does it work? Utilizing available data, information, and/or knowledge the designer will create a visual representation. Who’s doing it? Almost everyone - companies, educational institutions, non- profits, etc.

5. Introduction to Infographics Why is it significant? Conveys visual representation of relevant data Engages audience What are the downsides? Data can be skewed and/or have a margin of error which would make the data irrelevant. Data is constantly changing on a daily basis, so the information presented could be outdated.

6. Introduction to Infographics Where is it going? More and more tools are emerging to support the user to create infographics easier and quicker What are the implications for teaching and learning? Capture the students attention with relevant data with visual graphics. This can be a way to have learning occur since in today’s world we are presented with information in “bytes”

7. Good Example Hamburgers: http://www.mint.com/blog/tren ds/hamburger-10122010/ http://www.mint.com/blog/tren ds/hamburger-10122010/ INFOGRAPHICS

8. Good Example A Modern History of Human Communication: http://googlemobile.blogsp ot.com/2010/06/google- voice-for-everyone.html http://googlemobile.blogsp ot.com/2010/06/google- voice-for-everyone.html INFOGRAPHICS

9. Evaluating Infographics Not all infographics are good or accurate Just like you validate a website, you should validate an infographic before using it A Few Good Question to Ask: 1.Is it legible? Can you read it and make sense of it? 2.Can you sum up the point or message in two sentences or less? 3.Does it have a clear and meaningful title? 4.Are there spelling or grammar errors? (if there are errors, chances are there are errors in the data) 5.Who is the author? Is there any credit or information to identify the author as reputable? 6.Are there sources for the data? Visit the sources? Are they valid websites/sources? 7.Color and graphics? Are they legible and easy to read?

10. Characteristics of an Effective Infographic *based on University of Mary Washington, Infographics Blog http://infographics2011.umwblogs.org/2011/11/16/rubric-for-effective-infographics/ http://infographics2011.umwblogs.org/2011/11/16/rubric-for-effective-infographics/ UsefulnessLegibilityDesignAesthetics Easy to understand Easy to readGraphics should reflect purpose and audience easy to follow Clear purposeColor scheme should not hinder ability to read Graphics are good quality, not distracting and consistent Overall design facilitates understanding Reliable data (sources cited) Graphs/diagrams labeled appropriately Space used effectively (no excess clutter) hierarchy/organization of data Informative – viewer learns something Font choice, size and color used to make legible Appropriate use contrast and color

11. Evaluating Infographics Poor Infographics “Ending the Infographic Plague” by Megan McArdle: http://www.theatlantic.com/business/archive/2011/12/endi ng-the-infographic-plague/250474/ http://www.theatlantic.com/business/archive/2011/12/endi ng-the-infographic-plague/250474/ Anyone can create an infographic and put it on the web Evaluate your infographics carefully before using them A Few Red Flags: made by random sites without particularly obvious connection to the subject matter Examine the sources and sites the infographics are made by – if the site is only advertising, poor reputation or contains little or no content Source for data very few or an overwhelming number and are typed very small or worse no sources at all – check the sources Infographic appears threatening or to cause fear or terror

14. Using Infographics in Your Course Supplement lecture In class discussion starter Students can make predictions or conclusions based on trend or data Have students evaluate an infographic using a rubric http://kathyschrock.net/pdf/Schrock_infographic_rubri c.pdf http://kathyschrock.net/pdf/Schrock_infographic_rubri c.pdf Insert in discussion board to start a discussion. Assign students to research and share or present on an infographic, either in class or through discussion board/blog entry. Group infographic presentation

15. 8 SOURCES FOR FINDING INFOGRAPHICS 1.http://visual.ly/http://visual.ly/ 2.http://infographixdirectory.com/http://infographixdirectory.com/ 3.http://www.mashable.com/follow/topics/mashable- infographics/http://www.mashable.com/follow/topics/mashable- infographics/ 4.http://www.infographicsarchive.com/http://www.infographicsarchive.com/ 5.http://www.thinkwithgoogle.com/insights/library/infogra phics/http://www.thinkwithgoogle.com/insights/library/infogra phics/ 6.http://pewinternet.org/Data-Tools/Get-the-Latest- Statistics/Infographics.aspxhttp://pewinternet.org/Data-Tools/Get-the-Latest- Statistics/Infographics.aspx 7.http://www.educause.edu/library/infographicshttp://www.educause.edu/library/infographics 8.http://davidwarlick.com/graphicaday/http://davidwarlick.com/graphicaday/

16. Creating Infographics 1. Gather your data You need some hard numbers! Use more than one valid resource 2. Determine your purpose 3. Plan your infographic. Create a sketch, outline or flow chart 4. Start laying out your plan with software or an online tool Gather and determine graphics, clip-art, photos 5. Evaluate your data and determine the best way to get it in a visual Pie chart, diagram, bar chart? Cite your data in a sources section 6. Apply a color scheme & choose fonts 7. Step back and evaluate it, get feedback and edit

17. Creating Your Own Infographics 2 Methods 1.Build entirely online with infographic website Advantages: easy, quicker, graphics and creation tools provided for you, publish and share Disadvantages: limited data input, limited template and design choices, may not be high-res for printing, maybe restricted to their website 2.Use image editing software to build it, then host it online Advantages: more design freedom, build it high-res for print, use it/output it many formats, host it online easily Disadvantages: more work, requires a little knowledge of image editing/design principles, find sources for hosting/sharing

18. Tools for Creating Infographics on the Web 1. http://visual.ly/ limited – choose from template and can not insert own data, must use data from twitter or facebook http://visual.ly/ *good choice for hosting infographic, can upload your own and give it meta-date and get url and embed code for sharing 2. http://www.easel.ly/ my favorite – easy to use. Choose from 15 themes or a blank art board. http://www.easel.ly/

24. Great Technology Seminar Infographic Great Technology Seminar 2012 Envisioning the Future of Education Technology at ICC Session Participants were divided into four groups Participants were asked to develop a SWOT analysis for Illinois Central College Based on the ECAR 2011 National Study of Undergraduate Students and Information Technology Infographic http://www- cdn.educause.edu/visuals/shared/ECAR/Stud entHub/fullInfographic.jpg http://www- cdn.educause.edu/visuals/shared/ECAR/Stud entHub/fullInfographic.jpg

25. GTS Infographic Easel.ly created by Brandy Thatcher https://s3.amazonaws.com/easel.ly/all_easels/41 319/GTS2012_Students_Tech/image.jpg http://visual.ly/student-technology-icc

26. Tools for Creating Your Own Infographic Image Editors PowerPoint or Publisher – set page layout settings for single slide to rectangular portrait shape – save as.jpg when done, upload to visual.ly or other host Photoshop is great because of layers (learning curve) Free Software: Paint.Net www.getpaint.net/ – careful to click Pain.NET v3.5.10 link in upper right (lots of extra ads to download junk on page)www.getpaint.net/ Gimp http://www.gimp.org/ – free image editing softwarehttp://www.gimp.org/ Inkscape http://inkscape.org/– vector, drawing, layershttp://inkscape.org/ Free Online Image Editors: Photoshop Express http://www.photoshop.com/http://www.photoshop.com/ Pixlr http://pixlr.com/http://pixlr.com/ Sumopaint http://www.sumopaint.com/start/http://www.sumopaint.com/start/ There are also a ton of apps in both the Apple and Android store for image editing.

27. GTS Infographic Publisher/GIMP created by Mehdi Zadeh http://visual.ly/swot-analysis-student- technology-icc

28. Infographic Tools Data Sources http://www.google.com/publicdata/directory http://getthedata.org/ http://www.numberof.net/ http://www.gallup.com/ http://datamarket.com/ http://www.pewinternet.org/ http://data.worldbank.org/ http://chartsbin.com/

29. Tools to Create Graphics Online Tools to Create Graphs http://www.gliffy.com/ - create free diagrams https://cacoo.com/ - create online diagrams, save out as.png http://www.gliffy.com/ https://cacoo.com/ http://creately.com/ - create free online diagrams http://creately.com/ Image, Icon & Graphic Sources http://www.iconarchive.com/ - free sets of quality clip art http://www.iconarchive.com/ http://thenounproject.com/ - free symbols http://thenounproject.com/ http://pixabay.com/ - public domain photos http://pixabay.com/ http://www.tagxedo.com/ - create word clouds based on several options, save as image http://www.tagxedo.com/

30. Copyright Be aware of copyright, when you are creating infographics Cite your sources for data 5 Tips for Sourcing you Infographics: http://columnfivemedia.com/5-rules-sources- infographics/ 5 Tips for Sourcing you Infographics: http://columnfivemedia.com/5-rules-sources- infographics/ Creative Commons: http://creativecommons.org/ http://creativecommons.org/ http://search.creativecommons.org/ Use images that appropriately licensed for projects Don’t just pull any image off of the web

31. Student Infographic Assignment Discuss an infographic Evaluate an infographic Create an infographic http://edu.glogster.com/ A Rubric for Assessing Information Literacy in Infographics (from Loyola University, New Orleans) http://connect.ala.org/files/Rubric%20for %20Assessing%20Information%20Literac y%20in%20Infographics.pdf

32. The Next Big Thing… Interactive Infographics http://www.dipity.com/ (create an interactive online timeline) http://www.dipity.com/ http://www.tableausoftware.com/public/ community (live metric tracking) http://www.tableausoftware.com/public/ community http://news.bbc.co.uk/2/hi/in_depth/int eractives/default.stm http://news.bbc.co.uk/2/hi/in_depth/int eractives/default.stm Video Infographics http://www.coolinfographics.com/blog/tag/video The Elements: http://youtu.be/d0zION8xjbMhttp://youtu.be/d0zION8xjbM Format: A Brief History of Data Storage http://vimeo.com/9602282 http://vimeo.com/9602282 How Did We Get to 7 Billion: http://youtu.be/VcSX4ytEfcE http://youtu.be/VcSX4ytEfcE

33. WEBINAR REFERENCES http://www.schrockguide.net/infographics-as-an-assessment.html http://theasideblog.blogspot.com/2012/10/teaching-with-infographics.html http://www.queness.com/post/9942/how-to-design-your-own-infographics http://mediaspecialistsguide.blogspot.com/p/infographics.html#.UI68YsXA8sd http://davidwarlick.com/wiki/pmwiki.php?n=Main.MakingNumbersTellTheirStory http://www.teachersfirst.com/iste/infographics/resources.cfm http://www.techchef4u.com/?tag=infographics-as-a-creative-assessment http://infographics2011.umwblogs.org/ http://www.fastcodesign.com/1670019/10-steps-to-designing-an-amazing- infographic http://www.fastcodesign.com/1670019/10-steps-to-designing-an-amazing- infographic http://dailytekk.com/2012/02/27/over-100-incredible-infographic-tools-and- resources/ http://dailytekk.com/2012/02/27/over-100-incredible-infographic-tools-and- resources/ http://blog.visual.ly/source-code-the-5-rules-of-researching-and-sourcing- infographics/ http://blog.visual.ly/source-code-the-5-rules-of-researching-and-sourcing- infographics/ http://columnfivemedia.com/5-rules-sources-infographics/ http://learning.blogs.nytimes.com/2010/08/23/teaching-with-infographics-places- to-start/ http://learning.blogs.nytimes.com/2010/08/23/teaching-with-infographics-places- to-start/

34. An Overview of INFOGRAPHICS Webinar, Wednesday, November 14, 2012 Brandy Thatcher, Instructional Media Developer: bthatcher@icc.edu Twitter: @bthat bthatcher@icc.edu@bthat Mehdi Zadeh, Instructional Technologist: Mehdi.Zadeh@icc.edu Mehdi.Zadeh@icc.edu Teaching & Learning Center, Illinois Central College: tlc@icc.edu Twitter: @icctlc tlc@icc.edu@icctlc