Thanks for agreeing to create a tutorial for the University of Maine's New Media department! Depending on whether you are just creating the video or adding enhancements, here's what we'd like for each screencast.
Replace the sample values with your answers in an email to Jon Ippolito:
If instructed to do so, write a script of the words you will speak as the voiceover for your screencast, as an additional reference. (Sample here.) Your script should start with why you'd want to learn the skill in question, then the prerequisites necessary to understand your screencast, then a concise "how-to" demonstration step-by-step for your viewer.
You can write a full transcript, but an outline or bullet points will do.
For now, just save your script as an HTML document. You'll upload it to our server in a later step.
Create a 3-15 minute screencast (short is good!) for the script you have written according to these instructions for making screencasts.
If instructed to do so, save one version as MPEG-4 and a second in WebM (Miro Video Converter makes it easy).
A quiz is a momentary interruption in a script to confirm the viewer has understood what you've presented so far. Typically easy and scattered through the screencast, a quiz might ask the viewer to repeat something or describe what's on the screen at that point. Essentially the quiz asks, "Are you with me so far?"
Quizzes should have a cut-and-dried answer, as the browser cannot interpret answers that can be given in more than one way. It's simplest to ask multiple-choice questions; for example, instead of writing "What are the steps to opening a JavaScript window?", write "Type the number of the following command that is the correct way to open a JavaScript window."
To generate the quiz code, you'll need the basic tutorial metadata (creator, duration, video dimensions, etc.). For each individual quiz, you'll need:
Note that the rewind timecode needs to be at least 1.5 seconds after the start time for the previous quiz, or your user will end up having to re-take the previous quiz for no reason. So if your first quiz starts at 90 seconds in, make sure your second quiz rewinds to a point no earlier than 91.5 seconds. That will prevent the quiz lessons from overlapping.
To work, you'll need to encode the quizzes in JavaScript Object Notation (JSON). It's easiest to fill out our handy Quiz Generator and then just copy the code into a file named quizData.json.
Alternately, if you want to get fancy, you can also write the JSON by hand. Start by downloading a quizData.json template here and opening it in a code editor. Replace the dummy text in your version of quizData.json with the appropriate metadata for your quiz. Back in the JavaScript file, write in your custom times, questions, and answers, pushing as many quiz objects {...} as you need into the quizDataObjs array.
Completing a tutorial can earn a student a badge--a small emblem they can display on their own Web site, and which will link back to the tutorial site to prove they completed it.
We suggest the following design principles for badges:
You can export your badges in Illustrator by first creating a square artboard around each badge. (The current badge system requires all images to be square, even if that means leaving blank space around the sides.) Then choose File > Save for Web and Devices > PNG-24, and check the transparency button.
When you're done, you should have produced:
For inspiration, here are some beginner badges designed by David Searle and Anna Werner along with a suite of badges running from Beginning to Intermediate to Advanced to Expert.
Gather the files prepared above, and add to them a 100x100px photo of you and a screenshot of one still frame from your video to represent your screencast, as a .png. Make sure you have both the .mp4 and .webm version of your screencast.
The filenames should look like a brief title, lower-cased, separated by underscores.
Then get login credentials from the department and navigate to tutorials.NMDprojects.net/uploads/ using Cyberduck or another FTP client. (If you need help with FTP, see the last part of this screencast.)
Put your files in their appropriate directory on your harddrive, e.g.:
register_web_domain |_ quizData.json [Code for the quizzes] |_ register_web_domain.mp4 [Video for Safari] |_ register_web_domain.webm [Video for Firefox/Chrome] |_ gonzalez_mary_headshot.jpg [Headshot/s of tutorial creator/s] |_ register_web_domain.ai [Vector file for badge] |_ register_web_domain_max.png [Maximized badge] |_ register_web_domain_min.png [Minimized badge] |_ register_web_domain_screenshot.png [Still image for thumbnail] |_ register_web_domain_script.html [Optional: Tutorial transcript/outline] |_ register_web_domain.css, register_web_domain.psd, etc.[Optional: Related files of use to the learner]
Then zip the entire directory (Control-click > Compress...) and FTP to tutorialupload.NMDprojects.net/tutorials_zipped using the credentials given by your instructor.
Registering your tutorial in the Tutorial Pool makes it easy to get feedback on the process. First skim the sections of the Pool Walkthrough that explain how to add an intent, approach, and release.
Assuming you've received your Pool login from the department (or registered on your own), go to the Tutorial Pool, open the Options menu at upper right, and log in using the formula lastnamefirstname0X (where X is usually 1). Now click on the My Account button and fill out the fields in the account tab as instructed in the Walkthrough, including your self-ratings. Upload the headshot icon you prepared of yourself, and click Update Account Settings.
Click on Add Creation to add first an intent (the description you filled out in the first step).
Then open your new intent, select the little box at left, and Add Approach to link to your script. (You'll need the URL to your script--it should look something like tutorials.NMDprojects.net/register_web_domain/scripts/.)
Finally open the approach you just added and Add Release, including the URL to your screencast.
To finish off each tutorial entry, open the project panels, click +Add icon, and upload the badge you made for that tutorial. (If you don't see the option to add an icon, make sure you have the larger box encompassing all versions selected).