1. Video Tutorials and e- Learning Development TECM 5180 Dr. Lam

2. Before we start… We’ll watch several video tutorials Take a sheet of paper and write down: 1.Type of video it is (screencast, animation, or video of speaker) 2.Positive attributes of the video (what made it “good”) 3.Negative attributes of the video (what could make it better) 4.Methods you wish to incorporate in your own video tutorial

3. Let’s start with some examples http://www.youtube.com/watch?v=NSoj86mXfNU http://www.youtube.com/watch?v=JZdv5lrJs4U http://www.youtube.com/watch?v=9odXQ3tstrk http://www.youtube.com/watch?v=ENjiuxG-9- k&feature=c4-overview- vl&list=PL83417FBC931B2923 http://www.youtube.com/watch?v=ENjiuxG-9- k&feature=c4-overview- vl&list=PL83417FBC931B2923 http://www.youtube.com/watch?v=ok_VQ8I7g6I

4. Types of Video Tutorials Screencasts (typically used for software procedures, but can also be used for other types of tutorials) Animation and voice (optional video of speaker) Video of speaker (sometimes with additional visual elements)

5. Choosing a type Pick a video tutorial type that matches your content Pick a type that matches your abilities Pick a type that matches your constraints (technology, time, ability)

6. Process of Creating a Video Tutorial 1.Outline your content 2.Create a storyboard (visual outline of major events in your video) 3.Write a script 4.Rehearse 5.Record audio (simultaneously for screencasts; separately for other types of videos) 6.Record video 7.Combine and/or edit your video and audio 8.Publish

9. Technology Hardware Microphone to record audio Video camera to record video (optional) Software Software to record audio Audacity Windows or Mac freeware (e.g., garage band) Screencasting software (Most record audio and video) Camtasia studio mashable.com/2008/02/21/screencasting-video-tutorials/ Post-production software (putting it all together) Windows movie maker iMovie

10. Let’s go back to your notes… What types of videos did you prefer? What is most feasible? What methods/characteristics were positive? What methods/characteristics were negative?

11. E-Learning Development Your design document needs to be done ASAP Mock-ups should be done before the week is over Development should begin BEFORE next Monday’s class

12. Process from Mock-up to Development 1.Site-level map – This should be created (pretty easily) based on your task analysis The most important attribute of this is a clear relationship between content and user access (i.e., what will the user be able to see and control?) 2.Page-level mock-up – Create multiple mock-ups or wireframes based on the different types of pages you have in your course. Focus on things like primary navigation, secondary navigation, content display, and other user control.

13. Process from Mock-up to Development 3.Create blank HTML/CSS templates of each page type (based on your mock-ups of course). Don’t worry about content quite yet. This can be done by hand, by a WYSIWYG, or an e-Learning authoring tool 4.While someone on your team is developing the templates, someone else needs to be actually writing the content. Writing and developing content doesn’t have to be done in HTML/CSS. Do it in Word or Powerpoint All content must be original. Any content that comes from an external source must be repurposed and cited.

14. Process from Mock-up to Development 5.Insert content into your page templates. 6.Connect pages of content using navigation. 7.Test – perform a task-based usability test on at least one user and write up the results. Focus on one module (or a part of one module) Focus on macro-level elements (elements that span across modules like navigation, layout, ease of use, etc.) 8.Revise – Make necessary and feasible revisions 9.Finish – Host your site somewhere that accessible via the web. See first video tutorial for instructions on hosting via google drive.