using collaborative media services with flash in university applications

presented by

Joseph Labrecque

Adobe Education Leader Institute - San Jose, CA

July 28, 2010

USING COLLABORATIVE

MEDIA SERVICES WITH FLASH

IN UNIVERSITY

APPLICATIONS

Joseph Labrecque

Flash Platform Developer

Multidisciplinary Digital Artist

Adobe Higher Education Leader

• University of Denver Senior Multimedia Application Developer

Center for Teaching and Learning

• Fractured Vision Media, LLC

• An Early Morning Letter, Displaced

JOSEPH LABRECQUE - USING COLLABORATIVE MEDIA SERVICES WITH FLASH IN UNIVERSITY APPLICATIONS 2

About the University of Denver

• The oldest and largest private university in the

Rocky Mountain region, the University of Denver

attracts thought-leaders who are committed to

academic rigor, community engagement and global

responsibility. In this active, intellectual

environment, you'll discover unbounded

opportunities to affect change in our growing

global society.

• We enroll approximately 11,600 students in our

undergraduate and graduate programs.

• The Carnegie Foundation classifies DU as a

Doctoral/Research University with high research

activity.


About the DU Center for Teaching & Learning


The Center for Teaching and Learning (CTL) offers a variety of faculty development opportunities including workshops and seminars, grant funding for faculty-initiated projects, and support and development of technological applications that advance teaching and learning goals.

Two Units:

• Teaching and Learning Support

• Grants and Teaching Support

• Application and Services Support

• Research and Development

• Application Development (ColdFusion, Flash, Flex, AIR, Java, PHP)

• Technology Advisement and Forecasting


The Adobe Flash Platform

Multiscreen

Content and Applications

Flex

ColdFusion

Flash Media

Server Family Flash

Platform

Services

AIR

Flash Player

Flash Builder

Flash

Catalyst

Flash

Professional

Creative Suite Analytics &

Optimization

FL

AS

H P

LA

TF

OR

M

TOOLS FRAMEWORK CLIENTS SERVICES SERVERS

LiveCycle

Intro to Flash as a Collaborative Platform

• Many, many 3rd party ActionScript 3.0 APIs for connecting

to various public services: Twitter, Facebook, et cetera…

• Adobe Flash Platform Services: Social and Collaboration

• Flash Media Server and Stratus.

• Use Flash to interact with University services.

• Sometimes services with Flash will involve a proxy layer.

• AIR applications do not have this concern.


A Word About Social Connections

• Nothing is set in stone – there are no real rules.

• A social connection can be very simple or quite complex.

• Third party services can change overnight.

• Third party services can disappear overnight!

• Don’t bet on anything – lots of risk involved.

• Should not be core unless you can deal with the fact that your entire system is reliant on someone else’s.


CourseMedia™

• Web-based video clip generator

• Per-object narrative recorder

• Embed code generator for Blackboard

• Integrated media viewer

• Installation kiosks

• Content can be copyright-protected or

public

• Content providers can generate

embed codes for external, public

videos

• Media streamed (audio, video) and

verified (images) through Flash Media

Server

• Integrated media viewer with complete

teaching and learning toolset


Internal Example - coursemedia.du.edu

Tagging

Users help us improve searching by tagging media objects.

Tags are words or phrases that will be added to the

information available about this object so when someone

does a search, this object will appear as a result.

Sharing

Instructors can suggest an item to others to be used in

their teaching.

Object Embed Code

Instructors can make the entire gallery with full toolset

available outside of CourseMedia through a standard

embed code.


CourseMedia™ - Tagging


CourseMedia™ - Sharing


CourseMedia™ - Object Embed Code


CourseMedia™ Code Example


Facebook

“Facebook's powerful APIs enable you to

create social experiences to drive growth

and engagement on your web site.”

- http://developers.facebook.com/

Facebook is pretty far-reaching in that

you have a number of different points of

interaction:

• Connect with Websites

• Facebook Applications

• Mobile Applications


AS3 Client Library for Facebook Platform API


http://code.google.com/p/facebook-actionscript-api/

The ActionScript 3.0 Client Library for Facebook Platform API, fully supported by Facebook and Adobe, makes it easy to build applications that combine the strengths of the Flash Platform and Facebook Platform.

• Share: Create rich interactions for users to share with friends.

• Have fun: Make games social; let users compete against their friends.

• Connect: Let users connect to your RIAs with Facebook Connect.

• Solve problems: Build RIAs that harness the power of community.

• Reach people: Reach millions of Facebook users through social distribution.

Facebook Example - volunteer.du.edu



Facebook Code Example

Twitter


“Create cool applications that integrate with

Twitter”

- http://dev.twitter.com/

Twitter provides lots of different options for

creating applications, authentication between

apps, and consuming Twitter data.

• Authentication

• REST API

• Streaming API

• Search API

• @Anywhere

Twitter - Tweetr

Tweetr is a simple to use AS3 Twitter API

Library. As of 1.0b, the Library supports

all current Twitter API features and fully

supports Basic Authentication and OAuth.

Also included is a simple and easy to

install PHP Proxy Class (requires PHP5)

that allows the Tweetr API to be used for

flash content that is supposed to be

deployed on the web. Effectively

circumventing the twitter crossdomain

restrictions.

http://wiki.swfjunkie.com/tweetr



Twitter – VideoTweet Conference Widget

Twitter Example - VideoTweet


Twitter Code Example


Adobe Social

• A simple ActionScript 3 API, which can

be implemented in Flash or Flex and

aggregates the different social network

APIs, including Facebook Connect.

• The service adapts to social network

changes so you don't need to recompile

your application.

• Plug-and-play widgets that use the social

API for login, share, invite, select friends

and other commands.

• Dashboard analytics for reviewing and

optimizing your social performance.

• Commercial use is not free.


Adobe Stratus


• Stratus is a beta, hosted

rendezvous service that aids

establishing communications

between Flash Player

endpoints.

• Unlike Adobe Flash Media

Server, Stratus does not

support media relay, shared

objects, scripting, etc. So by

using Stratus, you can only

develop applications where

Flash Player endpoints are

directly communicating with

each other.


• Can be achieved through both internal

and external services.

• Useful for monitoring user activity and

individual object usage.

• Can be implemented in such a way that

user behavior is monitored.

• Most internal applications have some sort

of tracking mechanism.

• Those which do not, can use something

like Omniture or Google Analytics to

perform tracking and analytics.

Tracking and Analytics

Internal Example - coursemedia.du.edu

• Track when an object is viewed

in any of our tools.

• Allows us to know which

objects are used frequently and

which are not.

• Let’s us track which tool is used

to view which objects.

• Useful to track if objects are no

longer being used, if certain

tools are no longer used, et

cetera. We can use this to

investigate “why”.


CourseMedia™ Code Example


Omniture

• Acquired by Adobe late 2009.

• Many Adobe CS5 applications have tight

Omniture tools integration.

• SiteCatalyst Extension for Flash Professional and

Flash Builder.

• Test&Target Extension for Dreamweaver, and

Flash Professional.


Google Analytics - Tracking For Adobe Flash

http://code.google.com/p/gaforflash/

This is an ActionScript 3 API for Google Analytics

data collection.

• analytics_flash.swc – Special visual component

for Flash Professional.

• analytics.swc – Code library for Flash or Flex.

• Tracks page views and custom events.



Google Analytics - Video Event Tracking

Custom Events / Custom Data

• Play [RTMP URL, Seconds]

• Pause [RTMP URL, Seconds]

• Scrub [RTMP URL, Seconds]

• End [RTMP URL, Seconds]

Can be used as a supplement to

normal FMS Logs.

Won’t interfere with other Google

Analytics data such as standard Page

Views.

Provides a lot more detail.


Google Analytics - Audio Event Tracking

Emergent Collective One

iWebTunes – Lee Fernandes

http://blog.leefernandes.com/

Custom Play Events record how many times a

specific track is played by visitors to the

website.

These events can be sorted by date for

accurate reporting.

Let individual artists know how their tracks

are doing.

Forecast interest in potential future

endeavors.

Google Analytics - Page Views vs. Event Tracking

Instantiate Tracker

Pass in a DisplayObject, Web Property ID, Mode, Debug

import com.google.analytics.GATracker; import com.google.analytics.AnalyticsTracker; private var tracker:AnalyticsTracker; private function init():void { tracker = new GATracker(this, "UA-1156XXX-xx", "AS3", false); }

Track Page View tracker.trackPageView(“http://somewebsite.com/somepage/");

Track Custom Event tracker.trackEvent(“Category", “Action”, “Label”, “Value”);



Video Event Tracking - Code Example

Q & A


Closing…

Blog: http://inflagrantedelicto.memoryspiral.com/

Twitter: @JosephLabrecque

Email: [email protected]

Thank you…



Emergent Collective One – Free Download

Download the complete community compilation:

http://bit.ly/FVM005