1Slide
12 April 2023© Shell IT International
Fast Track to Streaming Corporate Communications
Gerald “G” Tyler
Shell IT International
2Slide
12 April 2023© Shell IT International
Pre-Production
• Scope – ”Over the shoulder” DV interview or BetaSP with a set and teleprompter?
• Outline / Script – Describe the production / write script or topics of discussion
• Budget – How much funding is available?
• Schedule – Timeline? Deadline? Resource availability?
• Staff – Clarify roles and expectations
• Production Crew – Individual cameraperson? External crew? Cost?
• Equipment – Available in-house? Rental… 3-CCD camera, tripod, and lights. Post-production workstation? Outsourced? Cost?
• Location – Available light, noise, booking, logistics (HSE forms)?
3Slide
12 April 2023© Shell IT International
Pre-Production – Streaming
• Business Requirements– Business case / purpose– Usability requirements– Live-live, scheduled live, on-demand, download– Audience size, global reach, estimated concurrent users– Available bandwidth > concurrent user limit– Use external CDN?
• Assess Target Audience– Platform > Windows Media Player v6.4, v8 codecs
– Connection Speeds > 56k to broadband
– Available Bandwidth > 1 Mb
4Slide
12 April 2023© Shell IT International
Pre-Production – Streaming
• Usability– Slide / URL flips– Markers– Related Links– Feedback– Polls
• Parameters– Target bitrates > Audio Only 23k, Low 33k, Med 100k
– Balancing audio/video bitrates > Importance of audio
– Codecs > WMV v8, WMA v8 for music, ACELP.net for voice
– Metadata > Title, Author, Copyright, Description, Markers, Scripts, and don’t forget html Metatags!
– Image size > Low 240x180, Med 240x180, Widescreen 320x180
– Frame rate > Low 10fps, Med 25fps
– Create ‘profiles’ > Store parameters for repeated use
5Slide
12 April 2023© Shell IT International
Pre-Production – Streaming
• Media Output Requirements– Stream– Download– CD?– DVD?– Tape?
6Slide
12 April 2023© Shell IT International
Production
• Use broadcast production best practices – Proper lighting– Quality audio– 3-CCD camera– White balance– Turn off auto-focus and auto-iris– Good tripod– Close-ups and proper headroom
• Verify quality audio and levels with headphones before recording!
• Acquire elements – branding, slides, transcript, related links
• Create animations or Flash, if necessary
7Slide
12 April 2023© Shell IT International
Post-Production
• Involves everything after shooting…– Capture– Pre-process– Edit– Output– Encode– Metadata– GUI design– Web design– Test– Publish– Backup
8Slide
12 April 2023© Shell IT International
Acquire Footage
• Sometime’s you’ll be capturing your own footage
• Other times you’re acquiring footage or an edited master from a Post house or customer
• If outputting to tape, DVD, or CD, request an MPEG-2 file(s)
• For streaming only, MPEG-1 will do. But ask for the MPEG-2 anyway so you can off it to tape
• Setup an FTP space to transfer files quickly
• If the Post house doesn’t digitize, request a miniDV tape
• If the tape comes from overseas, you’ll probably need to convert to NTSC. Have them put the conversion on miniDV
9Slide
12 April 2023© Shell IT International
Capture
• Use AV hard drives – Firewire, RAID, etc.
• Research your capture card – consumer, prosumer, pro
• Conserve CPU power
• Optimize your hard drive – defrag often
• Capture at highest quality – 720x480, 29.97fps, 16-bit audio
• Keep a tape archive
• Avoid dropped frames– Use external drive– Backup projects to DVD or tape, then delete from drive– Defrag often… did I say Defrag often?– Capture after a fresh boot with no other apps loaded– Or outsource capture to video conversion / duplication house,
especially for longer videos
10Slide
12 April 2023© Shell IT International
Capture
• Acquire adequate workstation and peripherals – Firewire interface– Hard drive size / speed – external 120+Gb, 7200+ rpm– DVD+RW or tape drive for backup– RAM – 1-2Gb– 3-CCD DV camera (or cheaper miniDV camera for playback)– Analog-to-Digital converter (Canopus ADVC-100)– S-VHS deck– TV / Monitor– Possibly a multi-format VCR (NTSC/PAL/SECAM)
11Slide
12 April 2023© Shell IT International
Take a Break
12Slide
12 April 2023© Shell IT International
Edit – Video Pre-processing
• Understand video level differences for Web and tape… video looks brighter on tape, darker on a PC monitor
• Brightness – Controls the overall luminance value
• Contrast – Increases or decreases the range of difference between the darkest and lightest portions of the video
• Levels – Uses a valuable histogram to evaluate video levels such as black, white and grey points
• Gamma Correction – Used to adjust video brightness levels for playback on Macs which look brighter than PCs
• Saturation – Used to adjust the amount of color
13Slide
12 April 2023© Shell IT International
Edit – Audio Pre-processing
• Export audio to SoundForge or dedicated audio application
• Always check audio levels of source footage… don’t just turn your speakers up or down
• Normalize – Maximizes the volume level without causing distortion if set properly
• Volume – The overall level of the signal. Better adjusted through normalization
• Compression – Evens out the dynamic range of the audio. Useful for controlling level spikes and adding ‘presence’
• Equalization – Adjusts the tonality of the audio. Better to cut than boost
• Resampling – Files may need to be resampled to 48k. Premiere handles multiple sampling rates if you select “Best” in the Enhanced Rate Conversion dropdown in Audio Settings
14Slide
12 April 2023© Shell IT International
Edit
• Typically involves…– Applying pre-processing effects– Arranging various sections of captured clips into a timeline– Trimming In/Out points– Inserting transitions– Incorporating graphics or visual effects– Mixing and synchronizing audio– Adding titles
• Professional video editing is a learned skill through knowledge and experience
• Create quality transitions… cuts or fades that are properly timed
• Preview edits carefully before committing to them. Output to a short clip to verify before moving on
15Slide
12 April 2023© Shell IT International
Edit
• Confirm appropriate pixel width is specified
• Stick to cuts and fast dissolves
• Use titling in an external graphic, not in the video – think 160x120
• Export a frame of video for the Audio Only video area and web link
• Have someone transcribe the video for a downloadable transcript and assisting with CC
• Specify the default transition / duration and inserted graphic duration before starting
16Slide
12 April 2023© Shell IT International
Output
• Determined during Pre-production (Output Requirements)
• Image Size – Output to the highest size you’ll be offering online.– 240x180 AVI for encoding– 720x480 DV tape for master tape archive (for full-size video)– 720x480 MPEG-2 for DVD– 640x480 for CD
• Pixel Width – For streaming or CD, output square pixels. For tape or DVD, output DV pixels (0.9)
• Cropping – Crop out any tearing or black bands around the video. Maintain the aspect ratio. Crop on output vs. in the timeline
• Output audio to 16-bit stereo
• Use the MPEG-4 v2 codec with max settings for the encoding AVI file so file sizes are manageable
17Slide
12 April 2023© Shell IT International
Output
• Widescreen – Output to 320x180 with square pixels for a 16:9 version. For a 4:3 version, crop 40 pixels off each side. Sometimes you’ll need to vary the amount on each side so the speaker is centered
• Deinterlacing – Combines the odd and even fields (or deletes one set) to create progressive scan video
• Inverse Telecine – Used to discard the additional 6 frames the 3:2 pulldown process adds to film-to-tape transfers
• Calibrate your monitor
• Notate marker timecodes in ASI text file (if markers are implemented)
18Slide
12 April 2023© Shell IT International
Encode
• Various Methods– Windows Media Encoder– Real Presenter– Plugins for both through editing software– Standalone encoders… Procoder, Cleaner, Squeeze
• Encoding from editing software – advantages / disadvantages
• Profiles – create and share profiles for target audiences / bitrates
• Image Quality setting – Create a couple Low profiles with alternate settings between Smoother and Clearer. Smoother will stay more true to the frame rate but will appear smudgy with action. Clearer will keep minimal movement sharper but will drop the frame rate with action
• Pre-process video – De-interlace if over height of 240, inverse telecine if necessary
19Slide
12 April 2023© Shell IT International
Encode
• Encode to Med, Low, and Audio Only bandwidth options– Medium: 93k, 240x180, WMV v8, ACELP.net (voice) or WMA v8
(music), 25fps– Low: 33k, 240x180 (or 160x120), WMV v8, ACELP.net, 10 fps– Audio Only: 23k, ACELP.net
• Some companies just provide Audio Only versions to save video production costs
• WM9 warning – deletes v7 and v8 codecs, video not upward-compatible, renders ASI useless. Be wary of new software with v9 or DirectX embedded
20Slide
12 April 2023© Shell IT International
Take a Break
21Slide
12 April 2023© Shell IT International
Integrate
• Metadata – title, author, copyright, description
• Markers and Scripts – chapterization and page / URL flips
• Media Player Interface Design– Implement defined controls– Closed caption space
• GUI Design – Photoshop comp (770x475)
• Web Interface Design– Develop html files– Use generic filenames to minimize changes after copy / paste– Embed Media Player to web pages– Use ‘includes’ for repeated info / files
• Metafiles – metadata, playlists, and rollovers
22Slide
12 April 2023© Shell IT International
Integrate
• Markers– Allows users to view content in an interactive, non-linear fashion,
sometimes called Chapterization– Well-suited to training apps and long-form video– Embedded via Advanced Script Indexer, ASF Indexer, or ASFChop– The GoTo Bar is no longer supported in WM9. Use an area of the
web page to display markers and use Javascript to call them
• Scripts– Facilitates page / URL flips– Trigger anything from URLs to slides, JPGs, GIFs, PDFs, Office docs,
etc.– Implemented via a SAMI file and a little code… more flexible than
ASI
23Slide
12 April 2023© Shell IT International
Integrate
• Output slides to graphics– Open Powerpoint with slide file– Save As…– Scroll down to TIFF format in the Save As dropdown menu (TIFF won’t
compress it… compress to JPG or GIF from Photoshop)– Click Yes if you want all slides converted or No if you only want the one
slide converted– They will be output to the size specified in Page Setup at 96dpi– If you have full Acrobat, you can print to Distiller and have a PDF file with
high resolution… helpful for detailed slides
• Slide aspect ratio– Powerpoint slides can be in various sizes / aspect ratios… Letter, A4,
screen, custom, etc. It probably won’t match the size you’ve allocated in your web page. Open in Photoshop then crop
– For simple text slides, create them in Photoshop at the specific size you want
24Slide
12 April 2023© Shell IT International
Integrate – Player Interface Design
• Determine desired controls
• Embed Media Player code
• Add additional height for various controls– Controls – add 45– Status Bar – add 26– Display – add 74
• Include <EMBED> code for Netscape compatibility
• Put all files into a single folder to negate having to use the BaseURL parameter
• To load media into your Media Player (not a browser), just link to the metafile
25Slide
12 April 2023© Shell IT International
Windows Media Parameters
<OBJECT ID="MediaPlayer" WIDTH="240" HEIGHT="322" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/
nsmp2nf.cab#Version=6,4,7,1112" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject"><PARAM NAME="DefaultFrame" VALUE="main"><PARAM NAME="FileName" VALUE="med.asx"><PARAM name="SendKeyboardEvents" value=“True"><PARAM name="SendMouseClickEvents" value=“True"><PARAM name="SendWarningEvents" value=“True"><PARAM name="SendErrorEvents" value=“True"><PARAM NAME="ShowControls" VALUE="False"><PARAM name="ShowCaptioning" value="True"><PARAM name="ShowGotoBar" value="True"><PARAM NAME="ShowStatusBar" VALUE="True"><PARAM NAME="ShowDisplay" VALUE="False"><PARAM name="SAMIFileName" value="captions.smi"><PARAM NAME="AutoSize" VALUE="False"><PARAM NAME="EnableContentMenu" VALUE="True"><PARAM NAME="InvokeURLS" VALUE="True">
26Slide
12 April 2023© Shell IT International
Windows Media Parameters
Insert Netscape-compatible Embed code
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" name="MediaPlayer1" src="med.asx"
width="240"height="322"animationatStart=1autoStart=1DefaultFrame=mainInvokeURLs=1showStatusBar=1showgotobar=1 showControls=1showDisplay=0
showPositionControls=1 volume=0></embed></OBJECT>
27Slide
12 April 2023© Shell IT International
Integrate – Closed Captioning
• Suggested so challenged users have the same opportunity to experience multimedia
• Mandatory on federal sites
• The SAMI file
• Converting minutes:seconds to milliseconds
• Inline stylesheet to format text
• Implementing scripts via the SAMI file
• Can be used for different languages
• Don’t create the SAMI file until your edit is approved and signed off
28Slide
12 April 2023© Shell IT International
Integrate – Closed Captioning
Sample SAMI File<SAMI><BODY> <HEAD> <STYLE TYPE="text/css"> <!-- P { font-size: 9pt; font-family: Verdana, Arial; font-weight: normal; color: white; background: black; text-align: left;
margin-left: 2pt; margin-right: 2pt;
} .Captions { Name: Captions; lang: EN; } #Source { font-size: 12pt; font-family: Verdana, Arial; font-weight: bold; color: white; background: black; text-align: left;
margin-left: 2pt; margin-right: 2pt;
margin-bottom:-14pt; } --> </STYLE> </HEAD>
29Slide
12 April 2023© Shell IT International
Integrate – Closed Captioning
Sample SAMI File (cont’d)
<SYNC Start="2000"><P ID="Source">Malcolm Brinded</p><P Class="Captions">Hello, I’m here to talk to you about information security and why I believe </P></SYNC>
<SYNC Start="8000"><P Class="Captions">it’s very important that you take this training very seriously. </P></SYNC>
<SYNC Start="10000"><P ID="Source"> </p><P Class="Captions"> </P></SYNC>
</BODY></SAMI>
30Slide
12 April 2023© Shell IT International
Integrate – GUI Design
• Now comes the fun part…
• Start with a Photoshop comp sized to 770x475… effectively 800x600
• Open your branding elements and place them in… name the layers
• Plan on popping a new window so you can control how the presentation is viewed… no menu, toolbars, etc. Here’s the cleanest code I’ve found…
<a onclick="window.open('med.htm','videoView', 'width=770,height=475,noresize,scrollbars=no');return false;" href="#">
• When you’re done, don’t worry about cutting it up. Use absolute positioning via a CSS. Just save the entire design as a nicely compressed JPG. Use Save For Web instead of Save As
31Slide
12 April 2023© Shell IT International
Integrate – GUI Design
Example
32Slide
12 April 2023© Shell IT International
Integrate – GUI Design
Example
33Slide
12 April 2023© Shell IT International
Integrate – GUI Design
Example
34Slide
12 April 2023© Shell IT International
Integrate – GUI Design
Example
35Slide
12 April 2023© Shell IT International
Integrate – GUI Design
Example
36Slide
12 April 2023© Shell IT International
Integrate – GUI Design
Example
37Slide
12 April 2023© Shell IT International
Integrate – Web Design
• Create web pages for each bandwidth option based on your GUI design
• Layout your pages with absolute positioning with a stylesheet vs. html. MUCH more flexible!
#bg {position:absolute; left:0px; top:0px; width:771px; height:471px; z-index:1}#video {position:absolute; left:58px; top:14px; width:240px; height:50px; z-index:2}#cc {position:absolute; left:58px; top:220px; width:240px; height:72px; padding:5px;
background: Black; border:0; z-index:3}#buttons {position:absolute; left:58px; top:293px; width:240px; height:20px; z-index:4}#markers {position:absolute; left:25px; top:365px; width:300px; height:100px; z-index:5}#ppt {position:absolute; left:356px; top:14px; width:415px; height:287px; z-index:6}#links {position:absolute; left:364px; top:402px; width:220px; height:35px; z-index:7}
• Build your html with simple <div> tags… <div id=“bg”></div>
• Keep all the files in the same folder to negate having to use the BaseURL parameter
38Slide
12 April 2023© Shell IT International
Integrate – Web Design
• Metatags! Don’t forget to include descriptive metatags in the html such as Title, Description, Author, etc. but more importantly, Keywords… this is how people will find your video through the search engines
<html><head><title>IT for Shell Communications - Video Library</title><meta name="Description" content=“The IT for Shell Video Library"><meta name="Keywords" content="IT for Shell, video, audio, stream, streaming,
streaming media, video library"><meta name="Language" content="English"><meta name="Company" content="Shell Information Technology International"><meta name="Subject" content="IT for Shell Video Library, streaming media"><meta name="Author" content="G Tyler [email protected]"><meta name="Contributor" content="G Tyler [email protected]"><meta name="Owner" content="Hazel Gray [email protected]"><meta name="Effective date" content=“01Oct2004"><meta name="Review date" content="01Oct2005"><meta name="Robots" content="index, follow">
39Slide
12 April 2023© Shell IT International
Integrate – Metafiles
What is a metafile?• Small text files that trigger streaming media player
playback using MIME types. Different platforms have different names for them…– Windows Media .asx ‘redirector files’
<asx version="3.0"> <entry> <ref ref="mms://your.wmserver.com/YourStream.wmv" /> </entry>
</asx>
– RealSystem .ram ‘metafiles’rtsp://your.realserver.com/YourStream.rm
– Quicktime .qtl ‘reference movies’ rtsptext
rtsp://your.quicktimeserver.com/YourStream.mov
• Used as a redirector to point to the encoded files on the streaming server
40Slide
12 April 2023© Shell IT International
Integrate – Metafiles
• Can also contain other information, such as metadata, a playlist, or conditional statements that offer the player choices about what file to play back
• Will play clips one after the other with minimal buffering time or interruption between them
• Can also be used as a ‘rollover’ to different streaming servers for redundancy, load balancing, and increasing concurrent users
• Specifies the desired transfer protocol for the stream, and can be used as a rollover to different protocols, such as http to get through firewalls
41Slide
12 April 2023© Shell IT International
Integrate – Metafiles
• Windows Media metafile as a Playlist
<ASX version = "3.0">
<Title>2003 ITPS Academy Awards</Title>
<Author>G Tyler</Author>
<ENTRY>
<Ref href="mms://streamingserver.com/video1.wmv"/>
</ENTRY>
<ENTRY>
<Title>Video 2</Title>
<Copyright>2004 Shell IT International</Copyright>
<Ref href="mms://streamingserver.com/video2.wmv"/>
</ENTRY>
<ENTRY>
<Ref href="mms://streamingserver.com/video3.wmv"/>
</ENTRY>
</ASX>
42Slide
12 April 2023© Shell IT International
Integrate – Metafiles
• Windows Media metafile as a Rollover
<ASX version = "3.0">
<Title>2003 ITPS Academy Awards</Title>
<Author>G Tyler</Author>
<ENTRY>
<Ref href="mms://streamingserver1.com/Video.wmv"/>
<Ref href="mms://streamingserver2.com/Video.wmv"/>
<Ref href="mms://streamingserver3.com/Video.wmv"/>
</ENTRY>
</ASX>
43Slide
12 April 2023© Shell IT International
Distribute
• Live-live, scheduled live, on-demand, download?
• Internal server(s) or external CDN?
• Serve– FTP encoded files to streaming server(s) or CDN– Test– Publish html, metafiles, and downloadables to web server– Broadcast communications
• Manage– Stagger communications – keep hundreds of viewers from hitting server
simultaneously– Content Management – keep it fresh, zip older videos as a download,
archive to a separate web page, and delete from the streaming server– Statistics / Quality of Service – monitor traffic via log files
• For more detailed info, get Steve Mack’s “The Streaming Media Bible”
44Slide
12 April 2023© Shell IT International
Requirements
• What to ask for when building a presentation– Official name of the video program– Deadline or broadcast date– Branding elements and page colors, if required– Approved slogans to include– Names of people in the video, if applicable, for CC name titles– Slides or slide text to include– Marker names / times of video sections, if applicable– Transcript for CC– Related links to include– Descriptive text to include– Streaming server publishing point for FTPing the videos.
45Slide
12 April 2023© Shell IT International
Business Applications
0% 10% 20% 30% 40% 50% 60% 70% 80%
Webcasting
Web Conferencing
Video Email
Surveillance/Security
Sales Force Training
Product Anncmts
Int Exec Comm
Ext Corp Anncmts
Distance Learning
Company Meetings
Collaboration
SM3. Current and Planned Use for Streaming Media
Currently use No current use, Plan to use in next 12 months
46Slide
12 April 2023© Shell IT International
Q & A
Gerald “G” TylerShell IT International
(713) [email protected]
47Slide
12 April 2023© Shell IT International
Enterprise-Related Sessions
• Other enterprise streaming panels of interest…– Tools and Strategies For Content Creation & Encoding
A - Great America J (A101) Tuesday, 10:00 AM - 11:00 AM
– Outsourcing Versus Building An In-House Streaming Media InfrastructureA - Great America J (A102) Tuesday, 11:15 AM - 12:15 PM
– The Evolution of Enterprise Communications: What’s Next?A - Great America J (A104) Tuesday, 2:45 PM - 3:45 PM
– Building An Internet Or Intranet Streaming StudioA - Great America J (A201) Wednesday, 10:45 AM - 11:30 AM
– Effective Streaming Media Strategies For The EnterpriseA - Great America J (A302) Thursday, 11:30 AM - 12:30 PM
48Slide
12 April 2023© Shell IT International
Thank You For Coming
• Drop off your business card for a copy of the presentation
• Contact me anytime for questions during the conference or later at [email protected]
• Get “The Streaming Media Bible” by Steve Mack!
• Enjoy the conference
Top Related