MMC4341 | Advanced Online Media Production

About the Course

Advanced Online Media Production is intended to provide fundamental skills required of a modern multimedia producer and Web designer. This includes CSS (Cascading Style Sheets), design principles (color, typography, etc.), images, usability and accessibility. This course will use software to help you master these concepts, particularly Adobe Flash. However, Flash is used as a tool to make you better at information delivery and storytelling.

This is a design and production course. If you are interested in writing for the Web, look for JOU4341 | Reporting and Writing for the Web taught each fall semester.

Students are expected to be careful and conscientious coders. Advanced CSS techniques will be covered, but you are expected to be proficient in CSS and XHTML markup when you come the first day. If you have not taken the prerequisite, MMC3260 | Communications on the Internet, you need to drop this course. No previous experience with Adobe Flash is expected.

This course is normally taught by professor Mindy McAdams. The detailed assignments are taken nearly verbatim from her. The original versions can be found on her syllabus. I wrote the five XHTML/CSS exercises.

Course and University Policies

Objectives

It is impossible to cram everything a modern Web designer must know into one semester. Instead we will focus on fundamentals that are broadly applicable. I will introduce other concepts such as unobtrusive JavaScript, object-oriented programming and Web administration. I will do my best to play to your strengths and provide you starting points for future learning.

Commitment

This course will take a lot of time. Expect to spend as much as 10 hours outside of class each week. Some assignments are shorter; some are longer. Start early. I've been where you all are, and I understand many of the concepts will be new, foreign and confusing. But I have no sympathy for students that do not ask questions, do not attend office hours and do not turn in quality work on time. Procrastinate at your own peril.

Software

I try to incorporate open-source or free software when possible. However, you must have reliable access to Adobe Flash. The current version is CS3. Any version from 8 or more current should work for the book assignments. Plan your workflow around open lab hours. An e-mail pleading for an extension because the labs are closed is not acceptable. You can buy Flash alone for $250 or within Creative Suite (includes Flash, Dreamweaver, Photoshop and others) for $550 or so. That is a bit pricey, even at educational pricing, for students. I don't expect you to buy.

Attendance and Attitude

Students are expected to show respect for one another and for the instructor. Attendance and punctuality are essential. Any absence without prior clearance or medical proof will result in a 5-point reduction of a student’s final grade. We only meet once a week, so this policy in non-negotiable. Quizzes will be administered at the beginning of the class periods. You cannot make quizzes up if you are late or absent. All attendance and grading questions will be answered during the instructor’s office hours. Do not bring these topics up during class or via e-mail. The instructor will not respond.

Deadlines

Late assignments will not be accepted. Assignments will only be accepted at the beginning of the class periods unless otherwise requested by the instructor. As with attendance, advance notice and documentation of illness or personal emergency is the only exception to the deadline policy.

Academic Honesty

Dishonesty of any kind will not be tolerated. Cheating hurts you, hurts our college and hurts the industry. Any dishonesty will be reported to Student Judicial Affairs, and the student will receive a failing grade for the course. The university’s Academic Honesty Guidelines provide additional details. You are expected to know and understand these guidelines completely. You are encouraged to ask the instructor for clarification if you are in doubt.

Students with Disabilities

Reasonable accommodations will be made for any students with disabilities. If you have a disability, the Dean of Students Office will give you official documentation. You must provide this to the instructor. More information is available at the Dean of Students Office’s Disability Resources page.

Book Requirements

Weekly reading assignments are indicated in the Schedule

Required Books

Beaird, J. (2007). The Principles of Beautiful Web Design.
McAdams, M. (2005). Flash Journalism: How to Create Multimedia News Packages.

The lectures and quizzes will be based on assigned book and Web readings. You must own these books to succeed in this course. These textbooks are available at the UF bookstore in the Reitz Union.

Grading Criteria

For descriptions of the assignments, see Required Work

Total: 100 points

Assignments

15 points — 3 Written Critiques
10 points — 5 HTML/CSS Exercises
20 points — 4 Flash Exercises
15 points — Flash Slideshow
30 points — Portfolio
10 points — Quizzes

Grading Scale

90 – 100 : A
88 – 89 : B+
80 – 87 : B
78 – 79 : C+
70 – 77 : C
68 – 69 : D+
60 – 67 : D
Less than 60 : F

Discussing Grades

All grades will be confidential and only handed to you personally. I will not deliver or respond to grade issues via e-mail. Please come to my office hours or schedule an appointment for any grade-related discussion. In-class questions will be ignored.

Course Schedule

Key Dates

Jan. 7 — Classes start
Jan. 11 — Drop/Add ends
April 23 — Classes end

UF Holidays

Jan. 21 — MLK Day
March 10 — Spring Break

Weekly Schedule

  • Week 3 | Jan. 21
  • No class — MLK Day
  • Due: Exercise 2
  • Read: Beaird pp. 38 – 66
  • Week 6 | Feb. 11
  • Due: Exercise 5
  • Read: McAdams | Chapter 1 (pp. 3–21), Lessons 1 and 2 (pp. 45–72)
  • Read: Beaird pp. 129 – 163 (optional)
  • Lecture: Multimedia Presentations
  • Week 7 | Feb. 18
  • Due: Flash 1
  • Read: McAdams | Chapter 2 (pp. 23–41), Lessons 4 and 5 (pp. 89–116)
  • Week 9 | March 3
  • Due: Flash 3
  • Read: McAdams | Lesson 9
  • Week 10 | March 10
  • No class — Spring Break
  • Week 11 | March 17
  • Read: McAdams | Lesson 7
  • Lecture: Photos in Flash | (audio)
  • Week 12 | March 24
  • Due: Flash 4
  • Read: McAdams | Lesson 8
  • Week 13 | March 31
  • Due: Critique 2
  • Read: McAdams | Case Study 2 (Star Tribune) and Bios (pp. 445–457)

Required Work

Written Critiques

Three short (500 to 1,000 words) printed papers collected at three separate deadlines. Critique the strengths and weaknesses of online journalism examples. (details)

HTML/CSS Exercises

  1. Layout and composition
  2. Color
  3. Textures
  4. Typography
  5. Imagery

Flash Exercises

  1. Symbols and animation
  2. Buttons and timeline control
  3. News package with animated graphic
  4. Package with embedded images

Flash Slideshow

The last Flash exercise builds on Lessons 7, 8, 9 and 10 of the Flash Journalism textbook. (details)

Portfolio

You will build an online portfolio showcasing your work from this course, along with anything else you choose to include. I expect a quality product that will impress potential employers. (details)

Quizzes

Quizzes will be based on assigned readings and administered at the beginning of class. No make-up quizzes will be given for late or absent students. However, there will be a few extra quizzes that you may drop if necessary. The highest 10 quizzes will be counted in your final grade.

Using Lightwindow.js with a SWF that loads external content

Apr 21, 2008

The technique in the Lightwindow documentation for launching SWFs does not work with externally loaded data. Essentially, the movie loads and shows the last frame. To get around this, you need to ensure your Flash publish settings generate a SWF and and HTML file. Create a new folder just for your Flash project with the HTML, SWF and all your assets (JPGs, MP3, TXT, etc.). And here’s the correct anchor to launch it:

<a href="projects/Lesson10/slideshow10.html" class="lightwindow page-options" params="lightwindow_type=external,lightwindow_width=650,lightwindow_height=340">Slideshow with external images and audio</a>

Obviously remember to change the path and set the dimensions accordingly.

Using SWFObject for your portfolio

Apr 14, 2008

Many of you may be working on a modal technique (eg. Lightwindow, Thickbox, etc.) for displaying SWFs within your portfolio. Another important technique is the use of a JavaScript DOM replacement such as SWFObject. This technique allows you to cleanly serve a SWF or provide alternative content in case the user doesn’t meet specified requirements.

Download (from Google Code)
Documentation (from Google Code)
Demo of “dynamic” option (from class)

FlashJournalism Exercises 10.9 and 10.10

Apr 07, 2008

If you code Exercises 10.9 and 10.10 correctly, you’ll get an unexpected result — the SWF goes straight to the last photo. And you cannot restart the movie to see your photos. This is a compatibility problem between the newest Flash Player and the ActionScript 1.0 code used in our book. It’s easy to bypass.

With your FLA open, go to File > Publish Settings. Click on the “Flash” tab. You need to set the Flash Player version to “6” and the ActionScript version to “1.0” within this window. You can publish or just click OK. Now test your movie. Should work like a charm.

Lightwindow code

Mar 31, 2008

You can look at the site of former student Brett Roegiers for some good use of Lightwindow to display SWFs. The chocolate fondue example is directly from MMC4341. You should be able to copy and paste his anchor tags.

Beware of the relative paths for files. Brett starts each CSS and JS link in the head with a forward slash (/) indicating relative to the server root. This won’t work if you are hosted on Plaza. Removing the forward slash should fix the head links. Bring your code to next class or stop by office hours if you have trouble.

NYTimes remake project files

Mar 25, 2008

I fixed the file of the Rafael Nadal graphic from The New York Times. The second version I showed in class used gotoAndPlay(); on button release and required stop(); on each frame of the main timeline. The third version in the ZIP replaces with gotoAndStop(); and only a stop(); on the Frame 1 of the main timeline. This may seem like an insignificant change to the code because the function of the package remains the same. But your life with code is easier when you keep it as clean, logical and simple as possible. Get the files.

About

Welcome to the professional and academic portfolio of Dave Stanton.
I am a doctoral student at the University of Florida studying mass communication and statistical modeling. I teach courses in the online sequence within the College of Journalism and Communications.