This course has ended
The course will be taught again in spring 2014.
This blog contains the complete syllabus and all assignments for an undergraduate course taught in the College of Journalism and Communications at the University of Florida in the United States. This course has been offered every spring semester since 2000. After three or four years, the course content changes completely. In the first years, we focused on video editing, compression and players. After that, we focused on database design and interactivity using Web back-end databases. Next, the focus was on Adobe Flash for several years. Now, we code.
For information about the course, please follow the navigation links above. Start with About This Course.
For PowerPoints shown in class, you can see a complete list at SlideShare, where you can also download the PPT files.
I believe in sharing knowledge. Teaching materials should be open and free. If you want to use anything from this course, you are welcome to do so.
Double major in journalism and computer science
This quote –
… the fields of mathematics, statistics and computer science are ever more important to the emerging fields of data journalism, information graphics, and news applications. That’s where the jobs are. That’s where the industry is heading (arguably, already it’s already there). That’s the new quality and standard to which we need to hold journalism.
We’re never going to fill these jobs or really make impact in this space and push forward if we don’t properly teach and prepare the young’uns coming up. Myself included.
– comes from an article written by a journalism student. You should read it:
Re-thinking J-school, by Katie Zhu.
Examples of interactive journalism – Week 16
To see all posts in the “Examples” series, view the category “Examples.”
This is the final post in this series for 2013.
In this week’s example, a 3D model shows the locations of the bombs that exploded on the day of the Boston marathon. Click the buttons to zoom in and get additional details about each of the bomb sites. This graphic appeared on the morning of April 17 with just three buttons. It was updated later, with two more buttons (and scenes) added. (The marathon took place on April 15.)

Your Reply
Leave a comment on this post to submit your example for this week.
- Post only ONE link.
- Make sure your link is correct and functional.
- Include the title or headline of the example you are linking to.
- Write one sentence about why we should appreciate it.
Read the details and rules on the Required Work page, under the subheading “Extra credit.”
How GitHub can help you
I just came across a GitHub repo that can help you learn more about beautiful typography with Google Web Fonts.
> See the beautiful typography examples
You could download the whole repo as a zipped file even if you do not have an account at GitHub.
Here’s my blog post about Git and GitHub (lots of links in the post):
Get started with Web coding. Part 5: How to use Git and GitHub
Have fun!
Week 16 assignments: Complete your project!
This is the final week of meetings for the semester. If you like, you can sign up for a meeting on Monday of finals week to try for 1 or 2 additional points on that one day.
For Monday, April 22, you will complete the work you’ve specified for WEEK 3 in your approved project plan. If you have unfinished work from Week 2, finish it.
Bring your completed work to show at your individual meeting with me.
Examples of interactive journalism – Week 15
To see all posts in the “Examples” series, view the category “Examples.”
This is the next-to-last post in this series.
This week’s example, Reframing Mexico (2011), was produced by students — a group from the j-school at the University of North Carolina, Chapel Hill, and a group from Tec de Monterrey University, Mexico. It’s a big package of many different stories, including information graphics, videos, and more. The visual design is rather old-school — there are even some Flash interactives inside — but the sliding features are all jQuery.
You should spend some time with this and see what you think about it. Make some notes about what you like, and what you don’t, and why. Sometimes a collection like this can seem too overwhelming to the site visitor. If that’s how you feel, what would you do to improve the experience?

Your Reply
Leave a comment on this post to submit your example for this week.
- Post only ONE link.
- Make sure your link is correct and functional.
- Include the title or headline of the example you are linking to.
- Write one sentence about why we should appreciate it.
Read the details and rules on the Required Work page, under the subheading “Extra credit.”
Week 15 assignments: Continue with your project plan
For Monday, April 15, you will complete the work you’ve specified for WEEK 2 in your approved project plan. If you have unfinished work from Week 1, finish it.
You should always work on your project items for one hour a day, seven days a week.
Bring your completed work to show at your individual meeting with me. Also, if you have run into problems, or if you have questions, WRITE them down so you remember to ask me. If you need advice during the week, of course you should email me.
Do not change what you’ve agreed to do. Your project plan is a contract.
Examples of interactive journalism – Week 14
To see all posts in the “Examples” series, view the category “Examples.”
USA Today has a spiffy new website design (you should look!), and this graphics package about North Korea’s aggression is jam-packed with interesting stuff.
The map package at the top is really simple — just buttons that change the map images, no animation. You can make this! The timeline (second image below) appears father down on the page, below a short video — all the text for the timeline can be seen in the HTML, starting on line 21 (view source).


Your Reply
Leave a comment on this post to submit your example for this week.
- Post only ONE link.
- Make sure your link is correct and functional.
- Include the title or headline of the example you are linking to.
- Write one sentence about why we should appreciate it.
Read the details and rules on the Required Work page, under the subheading “Extra credit.”
A sample job ad for a journalism story designer
Twitter just showed me a job ad, based in Washington, D.C., for a news organization. Here is part of the job description:
Candidates should describe their success conceptualizing and building news apps, data visualizations, and interactive graphics. If you are a visual storyteller, someone who sees the narrative in numbers, and thinks in code, this is your opportunity to make a mark. Expect your journalism skills to be as important as your programming skills. This editorial position will ask you to tell stories differently and inspire others to do the same.
The work will require advanced experience with HTML5, CSS, JavaScript (jQuery); an understanding of responsive design and proficiency with interaction design and user interfaces; familiarity with mining and manipulating data and Web scraping. Light Ruby or Python helpful. Responsibilities include producing daily and project-based digital journalism that will appear on the bureau’s McClatchyDC.com website and be integrated into other McClatchy desktop and mobile publishing products.
A good example of responsive design
Designing Stories has a really nice responsive design on the home page. Open it on your MacBook and on your phone and compare!
If you forgot what “responsive” means, review my PowerPoint from Week 7.
I like the site’s color palette too!
