Instructor: Chris Canipe, ccanipe@gmail.com
Office hours: By appointment
In this class you’ll learn basic skills and concepts behind interactive news applications. What does that mean? Good question! A “news application” can be a lot of things. It could be a slideshow, an interactive map, a chart or or even just a story layout with interactive elements. We’ll cover all of those things and learn how to write code along the way.
We’ll also spend a lot of time talking about design and storytelling, and how best to serve our readers. We’ll dive into a few datasets and try to find the stories they tell. Where we go will be up to you as we attempt some good old-fashioned journalism over the course of the semester.
- Learn the skills to make things for the web, We’ll cover the holy trinity of HTML, CSS and JavaScript, how to save and manage your code with Git, and how to work with tools and libraries that help us make charts, maps and other cool things.
- Work together to find stories in data and learn how to apply our data to web projects.
- Increase our collective vocabulary for design and interaction while exploring the relationship between content and readers for the web.
1. Navigate to your working directory via Terminal. (By working directory we mean the folder where you keep your working projects — not the project directory itself.)
2. Type the following: python -m SimpleHTTPServer 8888
3. Miller Time!
Identify an interactive news app that tells a compelling story and allows readers to interact with data. Analyze the design and user experience and how well it allows users to understand the story. Then, identify and interview the developer with the goal of understanding the goals of the project, the challenges that had to be overcome and the lessons learned in the execution and publication of the project.
- DUE MARCH 24TH (the Thursday before Spring Break).
- Introductions, talk through basic concepts of news applications.
- Homework:
- Read Code, the Newsroom and Self Doubt by Noah Veltman
- Read In Defense of Unicorns by Chase Davis
- Read New Year's Resolution: Learn to Code by Lena Groeger
- Peruse and be prepared to discuss examples from the last year in news apps:
New York Times, 2015: The Year in Visual Stories and Graphics
The Wall Street Journal, 2015: The Year in Interactive Graphics
LA Times, 2015: The year in graphics
Washington Post, 2015: A Year in Graphics
Propublica, 2015: Year in Visual Storytelling
- Discuss the reading
- Homework:
- Set up a virtual environment on your desktop
- Create a basic webpage and commit it to Git
- Homework:
- Read What is Code? by Paul Ford
- Discuss the reading
- Homework:
- We'll build a basic page with html and css and commit it to our Git repositories.
- Homework:
-
Read these:
- How election maps reveal the strange politics of geography by Katie Collins, Wired UK
- How We Built USA TODAY’s Election Night Maps by Dave Cole
- How NPR Designed Their Live Elections News App by Alyson Hurt
- Everything You Ever Wanted to Know About Elections Scraping by By Jeremy B. Merrill and Ken Schwencke
-
Visit and be prepared to talk about these Iowa Caucus results pages:
-
- Discuss the reading
- Homework:
- Class canceled on account of Democracy (New Hampshire Primaries)
- We did an in-class JavaScript follow-along, which covered JavaScript objects and arrays, jQuery selectors and For Loops. You can find a recap here.
- Working with JSON data. We'll cover basic AJAX requests and start playing with some actual data from the Missouri Department of Elementary & Secondary Education.
- We'll also get into some basic concepts of data visualization through For Loops and CSS.
- Homework:
-
For Thursday:
- Read Drawing Conclusions from Data by Jonathan Stray
- Come up with at least two story ideas based on the Missouri Dept. of Education data.
-
For Tuesday:
- Using the in-class exercise as a guide, create a new and different bar chart from the Columbia Public Schools data. The head, dek and sourceline should reflect the content of the chart and whatever trend or story (or lack thereof) might be evident in the data.
- Commit the project to your Git account and send me a link to the repository.
- A more complete and thoroughly-documented version of the Frederic Douglass High chart we started in class can be found here.
-
- Discuss the reading
- Talk about story ideas in the Missouri Dept. of Education data
- Review Git and code concepts in class.
- Homework:
-
Read (watch?) and be prepared to discuss in detail: Remove to Improve Gifs http://lenagroeger.com/blog/data-gifs/
-
Review tables markup:
- Discuss the reading.
- Homework DUE THURSDAY MARCH 3
- Make a table using a dataset I'll provide in class utilizing:
- A for loop
- HTML table markup
- Bootstrap styles and style rules covered in the ProPublica reading and the Remove to Improve GIF.
- Commit it to your Git repo and send me the link via email.
- Make a table using a dataset I'll provide in class utilizing:
- NO CLASS (Chris will be covering Super Tuesday.)
- Go over homework in class, expand on table styles.
- In class:
- Build a table using campaign contributions data from the Missouri Ethics Commission.
- Add sort, search and pagination functionality with the DataTables.js library.
- Convert datestrings using the Moment.js library.
- Repo for reference: https://github.com/chriscanipe/campaign-donations-table.
- NO CLASS due to the NICAR conference!
- In class:
- Mapping with the Leaflet.js library!
- Guest speaker: Travis Hartman of Reuters.
- Homework: Read Scott Murray's D3 Tutorials, especially:
- Fundamentals
- Setup
- Adding elements
- Chaining methods
- Binding data
- Making a scatterplot
- Guest speaker: Jon McClure of the Dallas Morning News
- Intro to D3.js, Part 1.
-
Guest speaker: Jon McClure
- Intro to D3.js, Part 2.
-
DUE TODAY: Graduate Assigment
- In class: Catch up on D3.js.
- Spend time talking about svg elements, scales and axis.
-
In Class:
- Ordinal scales and bars using the SAT data.
- Why do bl.ocks examples exist? How to start a D3 project and where to look for solutions.
-
Homework:
-
Make a Line Chart (Due Tuesday April 12):
- Build a line chart using this bl.ocks example as a starting point.
- Start by cloning this repository.
- The data is in the Excel file. You'll need to format it to tsv, csv or json. It's up to you.
- Scales hint: You'll need to parse the dates differently than in the example.
-
Final Project Proposal (Due Thursday April 14):
- Identify a story and a dataset you'd like to present visually.
- Proposal should satisfy three requirements:
- Journalistic value. Does the data tell a compelling story?
- Visual impact. Does the story have a compelling visual element?
- Doability. Can you build a news application using libraries and methods we've used in class?
- Submit a summary of the project and a link to the dataset to me and Mike via email.
- Please feel free to reach out to me if you need ideas, or if you have questions about how to approach a project.
-
Grading will be based on the following components:
| Weekly assignments and projects | 60% |
| Final project | 30% |
| Class attendance, participation & engagement | 10% |
| 94-100% | A |
| 90-93% | A- |
| 88-89% | B+ |
| 84-87% | B |
| 80-83% | B- |
| 78-79% | C+ |
| 74-77% | C |
| 70-73% | C- |
| 68-69% | D+ |
| 64-67% | D |
| 63-60% | D- |
| 59% & below | F |
| 94-100% | A |
| 90-93% | A- |
| 88-89% | B+ |
| 84-87% | B |
| 80-83% | B- |
| 78-79% | C+ |
| 74-77% | C |
| 70-73% | C- |
| 69% & below | F |
Accrediting Council on Education in Journalism and Mass Communications professional values and competencies
After taking this class, students should be able to: * Demonstrate an understanding of professional ethical principles and work ethically in pursuit of truth, accuracy, fairness and diversity; * Think critically, creatively and independently; * Understand concepts and apply theories in the use and presentation of information; * Conduct research and evaluate information by methods appropriate to the communications professions in which they work; * Apply basic numerical and statistical concepts; * Apply current tools and technologies appropriate for the communications professions in which they work, and to understand relevant aspects of the digital world.
Students are expected to attend class. Students who fail to attend class will miss receiving important information from instructors, as well as missing in-class lessons completely.
Academic honesty is fundamental to the activities and principles of a university. All members of the academic community must be confident that each person's work has been responsibly and honorably acquired, developed and presented. Any effort to gain an advantage not given to all students is dishonest whether or not the effort is successful.
Academic misconduct includes but is not limited to the following:
- Use of news or story content from another author without citation or attribution.
- Use of verbatim content from another author without citation or attribution.
- Extensive use of materials from past assignments without permission of your instructor.
- Extensive use of materials from assignments in other classes without permission of your instructor.
- Fabricating information in news or feature stories, whether for publication or not.
- Fabricating sources in news or feature stories, whether for publication or not.
- Fabricating quotes in news or feature stories, whether for publication or not.
- Lack of full disclosure or permission from editors when controversial reportorial techniques, such as going undercover to get news, are used.
When in doubt about plagiarism, paraphrasing, quoting or collaboration, consult with your instructor. For closed-book exams and exercises, academic misconduct includes conferring with other class members, copying or reading someone else's test and using notes and materials without prior permission of the instructor. For open-book exams and exercises, academic misconduct includes copying or reading someone else's work.
The use of open-source code freely shared or published on Github or in other ways is not considered plagiarism. Sharing code for graphics and interactive projects is a common practice in the world of interactive data visualization, and use of another designer’s shared coding is not considered unethical or an act of academic misconduct. This issue will be addressed by the instructors in class.
Classroom misconduct includes forgery of class attendance; obstruction or disruption of teaching, including late arrival or early departure; failure to turn off cellular telephones leading to disruption of teaching; playing games or surfing the Internet on laptop computers unless instructed to do so; physical abuse or safety threats; theft; property damage; disruptive, lewd or obscene conduct; abuse of computer time; repeated failure to attend class when attendance is required; and repeated failure to participate or respond in class when class participation is required.
IMPORTANT: Entering a classroom late or leaving a classroom before the end of the period can be extremely disruptive behavior. Students are asked to arrive for class on time and to avoid early departures. This is particularly true of large lectures, where late arrivals and early departures can be most disruptive. Instructors have the right to deny students access to the classroom if they arrive late and have the right to dismiss a student from the class for early departures that result in disruptions.
Under MU policy, your instructor has the right to ask for your removal from the course for misconduct, disruptive behavior or excessive absences. The instructor then has the right to issue a grade of withdraw, withdraw failing or F. The instructor alone is responsible for assigning the grade in such circumstances.
MU faculty are required to report all instances of academic or classroom misconduct to the appropriate campus officials. Allegations of classroom misconduct will be forwarded immediately to MU's Vice Chancellor for Student Services. Allegations of academic misconduct will be forwarded immediately to MU's Office of the Provost. In cases of academic misconduct, the student will receive at least a zero for the assignment in question.
The School of Journalism is committed to the highest standards of academic and professional ethics and expects its students to adhere to those standards. Students should be familiar with the Code of Ethics of the Society of Professional Journalists and adhere to its restrictions. Students are expected to observe strict honesty in academic programs and as representatives of school-related media. Should any student be guilty of plagiarism, falsification, misrepresentation or other forms of dishonesty in any assigned work, that student may be subject to a failing grade from the instructor and such disciplinary action as may be necessary under University regulations.
Students may make audio or video recordings of course activity for personal use and review unless specifically prohibited by the faculty member in charge of the class. However, to foster a safe learning environment in which various viewpoints are respected, the redistribution of audio or video recordings or transcripts thereof is prohibited without the written permission of the faculty member in charge of the class and the permission of all students who are recorded. (Collected Rules and Regulations, University of Missouri, Sect. 200.015, Academic Inquiry, Course Discussion and Privacy)
The University of Missouri System is an Equal Opportunity/ Affirmative Action institution and is nondiscriminatory relative to race, religion, color, national origin, sex, sexual orientation, age, disability or status as a Vietnam-era veteran. Any person having inquiries concerning the University of Missouri-Columbia's compliance with implementing Title VI of the Civil Rights Act of 1964, Title IX of the Education Amendments of 1972, Section 504 of the Rehabilitation Act of 1973, the Americans With Disabilities Act of 1990, or other civil rights laws should contact the Assistant Vice Chancellor, Human Resource Services, University of Missouri-Columbia, 1095 Virginia Ave., Room 101, Columbia, Mo. 65211, (573) 882-4256, or the Assistant Secretary for Civil Rights, U.S. Department of Education.
If you have special needs as addressed by the Americans with Disabilities Act and need assistance, please notify Jenner immediately. The school will make reasonable efforts to accommodate your special needs. Students are excused for recognized religious holidays. Please let us know in advance if you have a conflict.
If you have special needs as addressed by the Americans with Disabilities Act (ADA) and need assistance, please notify the Office of Disability Services, S5 Memorial Union, 882-4696, or notify Jenner immediately. Reasonable efforts will be made to accommodate your special needs.
The University community welcomes intellectual diversity and respects student rights. Students who have questions concerning the quality of instruction in this class may address concerns to either the Departmental Chair or Divisional leader or Director of the Office of Students Rights and Responsibilities (http://osrr.missouri.edu/). All students will have the opportunity to submit an anonymous evaluation of the instructor(s) at the end of the course.