Course Description: Information design is the practice of organizing data within a logical, coherent framework to help people fulfill their information needs. It can be applied to a variety of platforms
including websites, handheld devices, way finding systems and editorial info-graphics. Students will create data visualizations that are dynamic, consumable and engaging presentations of information.
At the conclusion of this course, the student should be able to…
1. Analyze audience, purpose, and situation as they pertain to the information need.
3. Synthesize information from diverse sources for project purposes.
4. Apply appropriate software solutions to design problems.
5. Demonstrate both verbal and visual presentation skills.
6. Create Portfolio piece as per Portfolio Requirements
Figurative Infographic Project
“An information graphic… is completely figurative when the relationship between the referent and its representation is perfectly mimetic.” – Alberto Cairo “The Functional Art” pg 52. Cairo describes the figurative infographic in opposition to the abstract infographic.
For this first project we are focused on describing physical processes, spatial relationships and/or physical mechanisms. Your visual explanation should be concerned with physical phenomena (not data centered). We are less interested in visualizing data, displaying abstract, numerical proportions or numerical trends. If your research yields a great idea for data visualization, store that idea away- there are two more projects devoted to data visualization.
The kind of story is important: The information being explained is physical, material in nature.
You are creating an illustration (or interactive feature) for publication in a newspaper or magazine, print and/or website. Your role is educational/journalistic: creating clear, dynamic visual representations of the story of your chosen subject.
If your project is interactive, but outside your current coding skills, it may be a mockup in the form of an interactive pdf. We will review a method of mocking up interactivity from a past class next week. Adobe Muse could be a simple way of making your infographic interactive. Consult Instructor’s workshop for a variety of resources to assist in execution.
The subject of your project may be a scientific: explaining a physical, chemical, physiological process, anatomical system. The application of such projects can be commercial/technology industry, educational or court/legal graphics. Is there a kickstarter project that needs better infographics to explain a physical product?
Your project may employ a number of different methods of visual explanation, including an exploded view diagram, a cutaway drawing, or image mapping. Your project should synthesize information from diverse sources for project purposes, arriving at new conclusions or uncovering new aspects of your subject.
Establishing the destination for this project:
website? if so, how much real estate in pixel dimensions do you have to work with, how many pages? What do you images/screenshots do you need to establish this project in context?
print? if so, what magazine, newspaper? What dimensions do you have to work with? other destinations- a motion graphics spot on the local or national news.
On Campus: Faculty Boxes/smansfield/Outbox/Examples/Information Design/Project 1
A health section feature: A visual explanation of the hazards of piercing
NYT: Inside the Towers
SR 99 Detour
How to Nap from The Boston Globe
A Guide to Herbal Medicines
Proportion by skyscraper
Final Project 1 Deliverables Due Week 5.
Case Study pdf. containing parts listed below. The Native file(s) for this project will be submitted along with the project case study. If your project is interactive, its final form may be submitted separately: flash file, web site folder, interactive pdf. Project case study will be submitted as a print quality (though not printed) 11″ x 17″ landscape format .pdf.
Case study in landscape format, under 10 mb in size. It will include, in this order:
- A creative brief/project statement. (see below)
- Sources for the information being presented. Project should synthesize information from diverse sources for project purposes. Include, where appropriate, screen grab images alongside source information
- Competitive analysis and research images and information sources. What is out there already? What am I competing with?
- Inspiration and influences
- Drawn thumbnail process drawings, scanned and included. Meaningful sketching process demonstrating preplanning and ideation. Brainstorming, mind map.
- Digital process. Include resource images, if used, credited, project in process. Elements on their own, icon development, color scheme options.
- The final project alone. (Again, submitted separately if necessary)
- Native file(s) submitted with project -.ai file, any font files. Embed all links.
Select one single benefit that the audience will experience upon reading the objective(s) you have set.
6. Support Statements/ Reasons Why
These are the reasons why the key benefit outweighs the obstacles and the reasons that what you are promoting is beneficial. These reasons often become messages.
What feeling should your communication have? Should it be authoritative, light, or emotional? Pick a tone.
What channel(s) or form will the communication take? Television? Radio? Newspaper? Poster? Pointof-purchase? Flyer? All of the above?
- Creative Considerations Is there anything else the creative people should know? Will it be in more than one language? Should they make sure that all nationalities are represented?
In Class assignment: Title your word doc: “Last name P1 Research”
Brainstorm/mindmap 12 ideas minimum. Research and collect links to relevant information sources. Do not redesign an existing infographic. Consider creating online or print collateral supporting a kickstarter campaign.
Look at news articles which are currently missing or are underserved by accompanying infographics. You could provide a better alternative, or a dual processing option for readers.
Establish a client for this project: who pays for this? Why? Explain the client and the destination(s) for this project. Explaining fully the real world context of your project will improve your final result. Imagine a plausible scenario.
Establish the destination for this project:
Print? if so, what magazine, newspaper? What dimensions do you have to work with on the page/pages?
Website? if so, how much real estate in pixel dimensions do you have to work with. How many pages? What do you images/screenshots do you need to establish this project in context?
Will you prototype an interactive infographic in XD or Adobe Muse?
Group review of research at end of class.
for week 2:
P1 Project Process
- Write a project statement. Word .doc title: “Lastname P1 project statement.doc”. Use standard template. This document will include additional pages of research, links to sources of information. Hotlink URLs. Start a case study in which to represent all of the above content.
- Start Sketching. Vigorous process on paper. This is key. Arrive with a well developed plan on paper. We will review your work at the beginning of class, week 2. Come to class week 2 prepared to propose your project to your class mates and to and continue creating your project in class. 4 pts.
Review of project statement and process sketching, peer critique, written notes. Further examples, related considerations. Lab time. Progress folders due end of class. 1 point. Assemble pdf of progress thus far.
Preliminary Group critique of project in progress, beginning of class. Present Case Study to class with project statement, research, thumbnail process, project in progress. 3 points. Grade of final dropped by one grade without participation in preliminary critique.
Lab time. Progress folders due end of class. 1 point. Prepare final case study for critique at beginning of class week 5.
Project case study due, beginning of class for final critique. 30 pts.