Audio & Video Streaming Supporting Student Skills Development Wayne Britcliffe E-Learning Development Team University of York.

Slides:



Advertisements
Similar presentations
Implementing Tableau Server in an Enterprise Environment
Advertisements

Concepts & Techniques for Accessible, Closed Captioned Web-Based Video 10th Annual Accessing Higher Ground: Accessible Media, Web and Technology Conference.
CHAPTER 15 WEBPAGE OPTIMIZATION. LEARNING OBJECTIVES How to test your web-page performance How browser and server interactions impact performance What.
1 CGICGI Common Gateway Interface Server-side Programming Lecture.
UNIT K: INCORPORATING VIDEO AND AUDIO 1 Encoding: the process of transforming moving image and/or sound into a digital file. Each encoding method known.
Video, audio, embed, iframe, HTML Form
© InLoox GmbH InLoox Web App product presentation The web client for project management on the Internet.
Computer Monitoring System for EE Faculty By Yaroslav Ross And Denis Zakrevsky Supervisor: Viktor Kulikov.
Retrieving compound pages This work is licensed under a Creative Commons Attribution-Noncommercial- Share Alike 3.0 License. Skills: none IT concepts:
Different Streaming Technologies. Three major streaming technologies include:
Academics as film makers Wayne Britcliffe & Simon Davis E-Learning Development Team University of York Pedagogies and support.
© De Montfort University, Web Servers Chris Hand And Howell Istance De Montfort University.
© InLoox ® InLoox PM Web App product presentation The Online Project Software.
Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course materials.
ITIS 1210 Introduction to Web-Based Information Systems Chapter 41 How Animation on the Web Works.
Paul Trani Adobe Certified Instructor/Expert Resources:
Images speak louder than words….. Publish multimedia into the Blackboard products, SymposiumLIVE is a uniquely embedded building block & Powerlink that.
Download & Play E-Learning System PROPOSAL draft1.0.
CHAPTER 18 INTEGRATING AUDIO AND VIDEO. LEARNING OBJECTIVES How the HTML 5 and tag pair can be used to include a video file within a webpage How video.
Turn the Faucet On! Investigating and producing podcasts for teaching and learning Merlot 2006 Pre-conference Workshop Patrick Lyons Educational Development.
PLUG INS flash, quicktime, java applets, etc. Browser Plug-ins Netscape wanted a method to extend features of the browser became an unofficial standard.
1 CS 3870/CS 5870 Static and Dynamic Web Pages ASP.NET and IIS.
1 CS 3870/CS 5870 Static and Dynamic Web Pages ASP.NET and IIS.
Comp2513 Forms and CGI Server Applications Daniel L. Silver, Ph.D.
NODEJS, THE JOOMLA FRAMEWORK, AND THE FUTURE IAN MACLENNAN.
Unit 3: Multimedia The Development Process. What is Multimedia? An interactive piece of software using several types of media: –Text –Graphics (photographs.
Advanced Level Course. Site Extras Site Extras consist of four categories: Stationeries Site Trash Designs Components.
London April 2005 London April 2005 Creating Eyeblaster Ads The Rich Media Platform The Rich Media Platform Eyeblaster.
1 SEG3120 Analysis and Design for User Interfaces Flash Anis Zarrad Parallel Simulations and Distributed Systems (PARADISE) Research Laboratory SITE, University.
Introduction The PrinterOn Campus Printing System is an innovative solution that: Makes printing easier Reduces your support costs Enables wireless.
The Development Process
Embedding CenterView and Hosting External Content.
1 Accelerated Web Development Course JavaScript and Client side programming Day 2 Rich Roth On The Net
Cross Site Integration “mashups” cross site scripting.
Motif 2.0 Summary Motif is built on the strength on Macromedia and Double Click. The heart of Motif is the Motif Ad Kit – let you create preview and publish.
Tutorial 8 Programming with ActionScript 3.0. XP Objectives Review the basics of ActionScript programming Compare ActionScript 2.0 and ActionScript 3.0.
Putting it all together Dynamic Data Base Access Norman White Stern School of Business.
Tutorial 7 Planning and Creating a Flash Web Site.
1 Geospatial and Business Intelligence Jean-Sébastien Turcotte Executive VP San Francisco - April 2007 Streamlining web mapping applications.
Software. A web site is a collection of web pages on a particular topic. A web page is a document written in HTML code. Web pages are linked together.
Reading Flash. Training target: Read the following reading materials and use the reading skills mentioned in the passages above. You may also choose some.
1 A Basic Introduction to Flash. Outline What is a flash? Macromedia Flash MX 2004 Flash concepts Flash Demos Conclusion Additional help 2.
CONFIDENTIAL - 1 USTUDIO HTML5 PLAYERS. CONFIDENTIAL - 2 Power Any Experience 2.
GOSS iCM Gary Ratcliffe. 2 Agenda Webinar Programme V10 Overview Version Information Supported Browsers Architectural Changes New Features.
 Web pages originally static  Page is delivered exactly as stored on server  Same information displayed for all users, from all contexts  Dynamic.
CentralCampus Group: May13-26 – William Van Walbeek & Paul Wilson Client: Google, Muthu Muthusrinivasan Advisor: Manimaran Govindarasu Abstract Introduction.
Copyright © 2002 Pearson Education, Inc. Slide 3-1 Internet II A consortium of more than 180 universities, government agencies, and private businesses.
Introduction to PresentED 6/2014. PresentED is a software solution merging Video & Presentation, Attachments & Links in a single, powerful and uniform.
Oman College of Management and Technology Course – MM Topic 7 Production and Distribution of Multimedia Titles CS/MIS Department.
XP Tutorial 8 Adding Interactivity with ActionScript.
California State University, LA Presented by Amanda Steven StevenAamirObaid.
WHAT WE OFFER Go-To-Market Services MICROSOFT AZURE APP BUILDER PROFILE: MxHero MxHero, launched in 2012 in New York, is a cloud-based application that.
Modes of Video Production & Delivery for Learning & Teaching Wayne Britcliffe E-Learning Development Team University of York.
Chapter 8 Adding Multimedia Content to Web Pages HTML5 & CSS 7 th Edition.
Create Course with video lesson. Course Coverage What covered in this course? Video lesson creation – Using external site embed iframe tag – Using third.
A S P. Outline  The introduction of ASP  Why we choose ASP  How ASP works  Basic syntax rule of ASP  ASP’S object model  Limitations of ASP  Summary.
Supporting and enabling the use of video at the University of York Julie Allinson Anthony Leonard Wayne Britcliffe Digital Library Manager System Integrator.
Arklio Studija 2007 File: / / Page 1 Automated web application testing using Selenium
Creating a Flash Web Site
CIIT-Human Computer Interaction-CSC456-Fall-2015-Mr
The Client-Server Model
Creating Dynamic Web Pages with FrontPage Barry Sosinsky Valda Hilley
NUUO Tools Welcome to NUUO general education service. This session allows users to have the overview of NUUO tools for system design. (Click)
Building a Custom Video Player
Chapter 18 MobileApp Design
Database Driven Websites
InLoox PM Web App product presentation
CLINICAL TRIALS UNIT REDCapCloud What it can do for you.
Western Mass Microsoft Technology Users Group
Retrieving compound pages
Presentation transcript:

Audio & Video Streaming Supporting Student Skills Development Wayne Britcliffe E-Learning Development Team University of York

Learning & Teaching Drivers  Increasing demand from staff wanting to deliver audio/video resources in support of their teaching activities  A number of departments have a particular need for audio/video delivery: –Music –Film, Theatre and Television –Health Sciences –Language and Linguistics –Hull York Medical School  A central push towards developing student induction/transition resources and student skills materials that draw heavily on video clips

Technical Considerations & Drivers  Staff won’t necessarily have html or audio/video development skills  Audio/video will need to be consumed both on and off campus  Audio/video resources need to be as secure as reasonably possible  The same streaming server and player should be leveraged in the VLE and also the public domain  The player needs to be as accessible as possible and preferably Flash based

The Streaming Server  First trial: Helix –Didn’t support Flash and tied to Real –Can be secured but is an expensive solution  Second trial: Flash Media Server –Security required custom coding server side which had to be in ActionScript –Need the more expensive flavour of server  Third trial: Wowza Media Server –Allows H264/AAC and FLV/F4V streaming –Server side uses Java –Strategically neutral (not Adobe/Real tied) and used quite ubiquitously

The Client Side Video Player  First trial: User installed players –WMP, QuickTime and realPlayer  Second trial: Custom built Flash player  Third trial 1: JWPlayer –Has a Javascript interface for customisation but harder to develop for in comparison to Flowplayer  Third trial 2: Flowplayer –Well documented Javascript API for customisation (with many examples) –Out of the box extension for accessibility (fully documented)

How we integrated it with Blackboard The Building Block creates a Content Item that has iFrame code built into it. This points back to the Building Block When the page is requested the play button square is drawn When the square is clicked the Building Block is triggered to make security checks - Still stream-able? - Adaptively release rules?

How we integrated it with Blackboard  The Building Block creates a Content Item that has iFrame code built in to it that points to the Building Block  When the page is requested the black square play ‘button’ is drawn  When the play button is clicked the BBlock is triggered and makes security checks: –Still streamable? –Adaptive release?  If happy then the BBlock sends a re-direct to the systems player Cold Fusion application (external) with parameters (location/width/height etc). The BBlock also generates a ‘golden ticket’ (this includes its life span and shared secret signature)  The Cold Fusion returns more HTML but mainly Javascript to configure FlowPlayer. The Javascript has the start playing request inc. the golden ticket info. The browser loads and renders Flowplayer (a flash Movie)  FlowPlayer makes the streaming request to the streaming server (Wowza) inc. the extra parameters. Our custom code checks the shared secret is valid and decides whether to serve the video

One or two whys  Why an iFrame? –allows us to deliver one player only (to both public & VLE requests). Easier to maintain –Felt to be less problematic than Javascript delivered into the currently rendered page (less chance of local conflicts etc.)  Why not security check at the streaming server? –The Building Block has immediate access to all the relevant security information (though the Blackboard API) –All the streaming server has to do is validate the ticket

How staff store their media clip

How staff embed their media clip

Student Transition (demo)

Practical Work in Chemistry (demo)

Education & Development (demo)

Feedback  General feedback from staff –Easy to upload/integrate –Streaming off campus vital (Chem) –Support & guidance required for processing video (Chem/Ed Studies/History)  From students (Chemistry) Very good to show how to carry out a procedure which you may not have done before. Also, they were good to remind you even if you had performed the procedure before. They were not too long either so were easy to watch. Think they are excellent, hope they are a permanent feature on the VLE. It enables us to see how to do things much more effectively than written instructions and some lab demos.

Moving forward  Staff Issues: –Audio/video editing/export –Hardware use/choice –Digitisation –DVD Extraction –Copyright/licensing –Support  Future Development: –Student video uploads –Back-end video processing –More flexible embedding of video –Automatic bandwidth selection

Questions

Useful information  (Flowplayer)  (JW Player)  (Wowza)  diaserver/ (Flash Media Server) diaserver/  services/helix-server-proxy.aspx (Helix) services/helix-server-proxy.aspx  bb_bb60/user/vlesupport/Opportunities/C lick_here_to_access_links_to_ (This presentation on our wiki) bb_bb60/user/vlesupport/Opportunities/C lick_here_to_access_links_to_  (Our support site)