Fundamentals of Multimedia Storytelling

Fall 2019

Basic numeracy and coding proficiency are critical for any working journalist today. They're also terrifying and/or completely unappealing to many.

If nothing else, this semester I hope to help you absolve those fears and give you the foundational knowledge to operate in today's journalism ecosystem. You may even learn to like this stuff, which would be super for you, because coding and data are bar none the most powerful tools for reporting and storytelling that exist in the modern world.

Most important rules for this course:

» Keep an open mind

» Never say "I can't do this."

» Accept that it is O.K., even expected, to not know something

Course Description:

This three-credit course will introduce you to conceptualizing and producing content across multiple platforms — from Web sites to tablets and mobile devices — by exploring essential concepts, tools and interactive story forms.

You’ll learn how the news industry is adapting to new technologies and ways to map or illustrate data and news. You’ll also explore ways to add interactivity to audio and visual storytelling.

More specifically, this course will introduce you to the basics of HTML/CSS. We'll explore all these tools and technologies within the journalistic context of pitching, reporting, producing data and interactive-rich news packages.

The course covers fundamental technical skills that will serve as the foundation for your interactive work at the CUNY Graduate School of Journalism.

By the end of this course, you’ll be able to:

» Produce journalism for the Internet

» Build basic HTML pages and layouts

» Manipulate web content design using CSS

» Use Github to publish content online

» Find and use data responsibly and effectively

» Learn the math required to effectively analyze data

» Produce basic maps and charts that convey information clearly and at a glance

» Report and produce stories with data and interactivity

» Craft questions to ensure receive technical guidance from web programming communities

The Biz

CUNY J-School Alum Carla Astudillo

"I like how you called it The Biz, it’s very 'backwards hat how do you do fellow kids' of you"

What you should know about me: I'm not a hard ass, but I also don't suffer fools gladly. If you're open and honest with me about anything that's going on, I'll make sure you get what you need to succeed here. Just please don't lie to me.

For any of the categories below, if any issues arise, please talk to me ASAP. It's a lot easier to make space for the unforeseen when I know what's going on quickly.

Attendance

Because of the collaborative/workshop nature of this course, I encourage you to come to all class sessions. You do have one day available to you to use for sick days, mental health days, travel, etc. Email me if you want to use it, and work with your group members to catch up on any missed classwork. Any additional sessions missed will result in the loss of a percentage point per day.

Technology

This is a technology-centered course that will require you to have your computers with you during class sessions. Keep your focus on the task at hand and PLEASE don’t open Facebook or Twitter or email or Slack or anything else that will be distracting.

That being said, keep your phones away unless they specifically pertain to an activity we’re doing.

Deadlines

Missing a deadline results in an automatic half-grade reduction. Your grade will continue to drop by half a grade for each subsequent day after the deadline until you file your assignment.

Plan ahead and remember that in journalism: done is better than perfect. It will always be better to hand in something than nothing. If you are having trouble with your assignment let me know immediately, do not wait until it is too late.

Story Guidelines

Your work for this class should be your own original reporting. However, if you've done reporting for another class that you'd like to expand on in an interactive project, I encourage you to return to stories you know well.

Every story you produce for our class should include clear source information for any data or images that you did not produce yourself.

Plagiarism and Copyright

It is a serious ethical violation to take any material created by another person and represent it as your own original work. Any such plagiarism will result in serious disciplinary action, possibly including dismissal from the CUNY J-School. Plagiarism may involve copying text from a book or magazine without attributing the source, or lifting words, code, photographs, videos, or other materials from the Internet and attempting to pass them off as your own. Please ask me if you have any questions about how to distinguish between acceptable research and plagiarism.

In addition to being a serious academic issue, copyright is a serious legal issue.

Never "lift" or "borrow" or "appropriate" or "repurpose" graphics, audio, or code without both permission and attribution. This guidance applies to scripts, audio, video clips, programs, photos, drawings, and other images, and it includes images found online and in books.

Create your own graphics, seek out images that are in the public domain or shared via a creative commons license that allows derivative works, or use images from the AP Photo Bank or which the school has obtained licensing.

If you’re repurposing code, be sure to keep the original licensing intact. If you’re not sure how to credit code, ask.

The exception to this rule is fair use: if your story is about the image itself, it is often acceptable to reproduce the image. If you want to better understand fair use, the Center for Media and Social Impact is an excellent resource.

When in doubt: ask.

Diversity

It's critical that you learn to include a diverse set of voices in your stories — something that is often glossed over when finding stories in spreadsheets and online sources.

Look for stories about and voices from communities that are underrepresented.

Grading

F (0-70)C (70-79)B (80-89)A (90-100)
Quality/ProfessionalismAssignment is not complete or plagiarized. There is a significant number of spelling/grammar errors. Could not be published. Assignment is completed needs significant editing. There are multiple spelling/grammar errors. Format or focus of the project is unclear. Needs more work to be published. Assignment is executed with skill and subtlety, there are some spelling/grammar errors, and the project could be published with another round of editing. Assignment is executed with skill and subtlety, there are no spelling/grammar errors, and is presented clearly and professionally.The project is ready to be published. 
Effort/Application>Work is not complete, and there is no attempt to use the relevant tools assigned. The work misuses the relevant tools. There are technical errors and the vision for the project isn't quite aligned with the assignment. Work is on time. The work attempts to take appropriate advantage of the relevant tools. There might be technical errors but the vision is right-on. Work fulfills the assignment. The work has been prepared with careful thought and attention to detail, and it takes appropriate advantage of the relevant tools.
JournalismThe work is plagiarized. DON'T DO THIS.  The work tells a true story that is reported originally by the student. Sources are appropriate but no clear effort has been made to seek out a diverse set of sources.The work tells a true story that is reported originally by the student. Sources are appropriate and are somewhat diverse in age, gender, ethnicity, sexuality, race, and political opinion. The work tells a true, compelling story that is reported originally by the student. Sources are appropriate and diverse in age, gender, ethnicity, sexuality, race, and political opinion. 
DiscussionYou have not completed the assigned reading/exercises to prepare for discussion. You do not participate in discussion (you're on your computer or looking at your phone). You are disrespectful of me or your classmates. You are often unprepared. You miss more than one class period without explanation. You are respectful of me and your classmates. You come to class having completed some of the work necessary to participate in discussion. You are somewhat engaged in the discussion. You are respectful of me and your classmates. You come to class having completed the work necessary to participate in discussion. You are engaged in the discussion by both paying attention and participating. You are respectful of me and your classmates. 

Assignment Grading Breakdown

AssignmentPercentage Value
Attendance/participation15%
Interactive news presentation10%
HTML/CSS Web page 25%
Data chart25%
Mapping assignment25%
TOTAL100%

Projects & due dates

Interactive news presentation (10%) Due: Schedule Here

We’ll start each class period with a presentation evaluating the interactive techniques used in stories published in 2019. I’ll assign your presentation dates the first week of class and post the schedule here.

These presentations should last about 10-15 minutes, and you should cover:

» What are the interacttive/graphic elements of this piece? Why do you like it?

» How might use these techniques to tell a different story? In what situations are they useful? Each element could have a different use.

» What does this bring to the story? Could it be improved?



Unit 1 Project: HTML/CSS web page/graphic (25%)

Due: Oct. 16, 10:00 pm (night before class 7) File here

Create a page using HTML and style it with CSS. You can use edited text/photos from one of your other classes, or do something new. You should have the following elements:

» Headline, text and at least four images that represent some important facet of your story.

» Build a graphic using ONLY HTML and CSS.

» Use icons in your graphic. Include your name somewhere at the bottom of your graphic.

» Use responsive techniques to insure key elements appear functionally on all screens.

» You MUST use the design principles we’ve discussed -- pay attention to font, alignment, color, etc.

Exceptional work (A grade) will go beyond simply meeting requirements and implement HTML/CSS into an aesthetically diverse design.

Logistics

Your project folder should be the name of your project slug (one or two words) Remember to use proper file names (index.html, all lowercase, etc) Have proper folder/file hierarchy to upload to Github pages. Figure out the URL (web address) for your piece. Fill out this form to file the piece.

Unit 2 Project: Data chart (25%)

Due dates: Pitch me by email by Nov. 6, 10:00 pm (night before class 10) Submit final assignment via Google form (https://forms.gle/1Ym7f3ZJCco2b5AQ7) by Nov. 14, 10:00 pm (night of class 11)

Logistics:

Find a topic you are interested in that involves data and datasets. Analyze it to find interesting, timely patterns or trends. By Nov. 6 at 10:00 pm, pitch me your idea (why is it interesting, timely and insightful. Pitch here.

Once I approve the pitch, call an expert on that subject who can evaluate the relevance and accuracy of the concept/trend you found in the data. Write a maximum 150-word piece (including the quote) and create a chart.

Build your own HTML/CSS responsive page with the following:

»Headline, Byline and at least 150 words of text.

»Chart with caption aligned left or right Link to original data set A photograph that reflects the topic, centered above the headline, with a caption and credit

» You will use Github to push the content to your site.

The final assignment is due Nov. 6 by 10pm. Please enter URL to the web page here.

Unit 3 Project: Mapping assignment (25%)

Due dates: Pitch here by Nov. 20 at 10:00 pm (night before class 12) Submit final assignment here by December 11, 10:00 pm (night before class 14)

Logistics:

This is a news short story — 150-250 words — that has a geographic component which you will illustrate using a map or maps. By Dec. 11 at 10pm, pitch me your idea (why is it interesting, timely and insightful). Once I approve the pitch, call an expert on that subject who can evaluate the relevance and accuracy of the concept/trends you found in the data. Write a 150-250 word piece (including quotes from the expert) and create a map to tell your story.

Build your own HTML/CSS page with the following:

» A meaningful headline that captures the story in a compelling way — not in a way that simply labels the map

» Your byline

» Your story text

» An interactive map. Do not create a static graphic

» Link to the original data set Link to the final clean data you used to create the graphic

» A photograph that reflects the topic as an illustration, centered

The final assignment is due by Dec. 11 at 10:00 pm. Please enter the URL to the web page here.

Coaches

If you are having technical issues, please don’t hesitate to reach out to these coaches! They’re here to help you.

Itameri, Kirsti

Coaching Area(s): design, WordPress, Illustrator, Photoshop, social media

Days/Hours: Wednesdays 5:30 p.m. – 7:30p.m., or by appointment

Location: Newsroom

Email: kirsti.itameri@journalism.cuny.edu

McCarthy, TC

Coaching Area(s): coding

Days/Hours: Thursdays 5 p.m. – 7 p.m.

Location: Newsroom

Email: tc.mccarthy@journalism.cuny.edu

McKenna, Christine

Coaching Area(s): multimedia production and packaging

Days/Hours: By appointment

Location: Room 432

Email: christine.mckenna@journalism.cuny.edu

Singleton, Malik

Coaching Area(s): data storytelling, WordPress, HTML, CSS

Days/Hours: Tuesdays 5:30 p.m. – 7:30 p.m.

Location: Newsroom

Email: malik.singleton@journalism.cuny.edu

Wells, Nicholas

Coaching Area(s): data storytelling, HTML, CSS, R

Days/Hours: Tuesdays 5:30 p.m. – 8:30 p.m.

Location: Newsroom

Email: nicholasbwells@gmail.com

Wolfe, Julia

Coaching Area(s): interactive data journalism, coding

Days/Hours: Wednesday and Thursday evenings by appointment only

Location: Newsroom

Email: juruwolfe@gmail.com

Saudi, Nour

Coaching Area(s): HTML CSS, JavaScript, data analysis, Excel

Days/Hours: Wednesdays 5:30 p.m. – 7:30 p.m.

Location: Newsroom

Email: nour.saudi@journalism.cuny.edu

CUNY Graduate School of Journalism

Design and Syllabus built on framework by Amanda Hickman & Alex Laughlin