Strategic Consulting

Captivate vs. Presenter: Which one to choose

When should I use Presenter and when should I use Captivate?

That is a great question. But, the answer isn’t very clear. However there are some clear differences between the tools that we can use to isolate the best use case, and hopefully get building projects, instead of scratching your head.

Adobe Captivate versus Adobe Presenter: The Ultimate Showdown

Presenter:

Let’s start with Presenter, it is a simpler tool.

What is Adobe Presenter?

It is a plug-in to PowerPoint (2003-2010) that allows you to and add audio, video, flash and quiz functionality to a Power Point presentation. It will then output the presentation to a web-ready format to be delivered delivered with Adobe Connect or a web server. There are also additional output format – a PDF file, which displays the interactive portion in a single page PDF.

OK, great Captivate can do that too right? Yes and no.

Captivate can add audio, video, flash and quiz functionality to a Power Point, but some control and quality is lost.. Because Presenter is a plugin and work inside of PowerPoint, you can maintain control of the slides and changes, update and modifications are simple. Updates in captivate are a little more involved.

Presenter Point #1 : If your content is in PowerPoint, or can be easily created in PowerPoint, then use Presenter.

Think simple, don’t over-complicate the process. If the above statement applies to your eLearning project, then stick with Presenter, no if’s, and’s or but’s about it.

Presenter Point #2: Use simplicity to your advantage.

You can build text and image based presentations in Captivate, and I know groups that have walked away from PPT/Presenter to use Captivate exclusively so they only deal with one software application, but, honestly, it is easier in PPT and Presenter. Simplicity is Presenter’s main attraction to me.

Captivate

Captivate is a wonderful and powerful tool for producing eLearning content. Captivate is a screen/workflow capture application that allows you to create interactive or non-interactive eLearning projects. This is where people can get themselves in trouble. Captivate can tempt users down a road of over-complication and update-nightmares. To simplify the concept - Captivate’s bread and butter functionality is the workflow capture.

Captivate Point #1: Do you need to show or simulate software? Yes? Use Captivate.

Sure, you could do it in PPT and Presenter. Think about all the screen shots and text you’d have to write and arrange. What could take you days in Presenter/PPT will take a few minutes in Captivate.

Captivate Point #2: Looking for more advanced animations, widgets, or branched scenarios? Use Captivate.

If you are looking for more robust animations, better video support, the ability to use widgets, or any of the many additional features that Captivate offers, don’t fight with Presenter, use Captivate.

Now, Presenter vs. Captivate isn’t the best way to think about these two tools. Using the tools together can enhance your eLearning content and make your life easier. Use both tools to save time, and create some top-notch content.

Are you interested in learning more? Do you need help creating content with these tools?

We provide expert training for both Presenter and Captivate or we can create your content for you. Contact Us for more info.

Customer Support: Is it a Lost Art?

Posted on March 30, 2012 at 2:22 pm in Blog, Strategic Consulting

Customer Support: Is it a Lost Art?

In today’s economy, it seems that many organizations have sacrificed customer service as a way to reduce their overhead. Many groups now use overseas support and may not have any actual staff to help with customer issues. Proudly, we have kept our customer-centric focus here at RealEyes Media.

What has this meant for us and our customers? It means that our clients have purchased from us with the confidence that they are getting the right tools the first time. They also have access to our team of experts who use the tools we sell.  Finally, they have access to our certified trainers for official Adobe Authorized training, or custom application development and training as needed.

How does this make your experience better? Think about the last time you purchased software from a company that sells every software application you could want (SHI, CDW, BestBuy, etc.).

How much did your sales rep know about the software you were purchasing? More than what was on the back of the box?

Did you ever try calling them back with a question about using the software? I would guess that you didn’t find much help. This is just the tip of the iceberg of how customer support can make a better experience for purchasing and using software.

Why are the benefits of using a company focused on the software you’re interested in? Companies that focus on specific products are going to be better suited to assess whether the tools are right for you, and what licensing will best suit your specific needs. They can then help you assess and track your usage and help identify where you can make things more efficient or where you can expand to grow your business, not to mention help with adoption of new tools or versions.

Keep this in mind as your organization looks at purchasing software. It is worth the extra effort. You get better support, and someone else “in your corner”.

All of us here at RealEyes are 100% committed to our client’s success and growth with the tools and services we provide, and we look forward to working with all our clients, new and old.

Ready to Put RealEyes inYour Corner?

Case Study: Listen to the problem & provide the best solution

The other day a call came in from from a customer who had questions about Adobe Flash Media Server and if it would be the right software for their situation. After listening to their questions and exactly what their requirements were, I moved on from there.

As a product specialists, solutions engineers, developers, and trainers, the team here wear multiple hats. So in this case, I put on my solutions engineer hat, and began assessing their needs case.

Their initial inquiry was about streaming Flash based content within their Intranet. The customer was searching for a way to package internal asset videos and SCORM based training content together into one piece that could be uploaded to their proprietary Learning Management System (LMS). He had mentioned that they also had full motion videos, and that they too would like to be able to bring those recordings into the training piece.  He asked about Adobe Captivate initially.

Seems easy enough, right? Give them Captivate.

Not so fast.

This Flash based content was quite complex and not as efficient as it could be. I recognized this as something I could use to minimize the clutter, and streamline the content from start to finish. The quick and easy route to a solution would have been to use Captivate and a couple other software applications. This would have worked, but it wasn’t the best solution. I’m a firm believer that less is more when it comes to software applications. The goal was to make it easier for end users to navigate and comprehend, as well as easier to manage for the content creators.

The solution actually turned out to be pretty simple – I had gathered all of the necessary information, the keywords of SCORM and LMS were a big help, from him and I decided that Adobe Presenter would be a better solution because of its simplicity. LIke any good customer, he questioned the solution & I explained it this way:

  1. Presenter has the ability to import the internal asset videos (already in .flv format).
  2. The full motion videos were already in .swf format, and Adobe Presenter can import those, as well.
  3. Presenter is a SCORM compliant eLearning content authoring tool, so you can leverage its quiz functionality to build the quiz, as well as deploy it to any LMS that utilizes SCORM as its reporting engine.

In the end, this was the solution that the customer ended up using. He appreciated the simplicity factor. And since he had really only been tasked with this project as a result of an employee leaving the company the simplicity was important to him since this wasn’t his primary role. A big win for the customer.

The point of this post is to emphasize just how important it really is to listen to all of the requirements before making any judgments and beginning to endeavor down that solution’s path. There are always multiple solutions to a problem. We help to determine the best solution.

The team at RealEyes excels at proposing the best solution for the situation. We take great pride in being an Adobe Solution Partner and Adobe Certified Instructors.

Looking for a solution to a problem? Contact Us!

5 Tips For Getting More From Your Training

Posted on November 22, 2011 at 2:36 pm in Strategic Consulting, Training

5 Tips For Getting More From Your Training

Ever sit through 8, 10 or more hours of training and come out feeling like it was a big waste of time? Regardless of the instructor and class content, there are some things that you can do to improve and benefit from any training that you attend.

The following 5 tips are based on observations that I, as both a trainee and trainer, have found to improve the experience and overall learning retention achieved from training sessions. These benefits apply to both short, 1-2 hour sessions, as well as longer, 3-5 day sessions. So take note and see if these improve your next training experience.

Make sure the training uses labs for practical experience

Your training is for more than just passing an exam, right? If you want to learn how to do your job well, make sure whatever training you invest in provides real experience performing tasks with hardware, operating systems, and networking. Even better, find training that combines this hands-on experience with practice exams, expert video instruction, and written reference material for a complete training package. There’s more than one way to learn, so be sure to incorporate different methods in your training. Each method will build on the others and reinforce what you’re learning.

Don’t limit yourself to the prescribed steps

This doesn’t mean that you shouldn’t go through the steps. Go through them, and then after that, add in your own changes ideas and tests. This will give you a better and deeper understanding of the concept.

Make sure you get the fundamentals

Before you venture out on your own, away from access to an instructor, make sure you understand the main processes and concepts. That way when you are on your own, you will be able to more quickly resolve issues and problems without having to “start from scratch”.

Ask questions

Make sure you are getting the training you want and need. Let the instructor know when you have specific questions or when you’d like to discuss something further. Instructors love to help. Lead them to where they can help you the most.

Create context

If the content doesn’t relate to what you are currently working on or something you have worked on in the past, it will more difficult to retain. Look for ways to relate the training material back to you. Email yourself ideas, code snippets and thoughts as reminders.

Don’t stop after the training is over

Make sure you review and use the materials and information you were provided. The more you use and review, the more benefit you will gain.

Excited about your next training session now? We thought you might be.

Check out the training that RealEyes offers. Or, you can contact us directly about custom training and consulting for your specific needs.

The past week has brought a series of announcements from Adobe that has elicited myriad speculation and concern from the Flash Platform and Adobe community.  As a leading Adobe Solutions provider for Flash Platform solutions, RealEyes wants to address these announcements and how we see their impacting our focus in the technological ecosystem.

Before we begin this analysis, from our vantage point, the largest issue with these announcements is the way in which they were communicated—to the public, to partners, everyone.  There was much good news in what Adobe announced; unfortunately, their public relations team chose to focus largely on what was being deprecated, which colored the resulting dialog.

We’d like to take a moment to refocus this conversation for our customers and community.  Contrary to popular debate, Flash is NOT dead.  And here’s why:

Adobe Focus on Mobile Applications

Adobe announced that it would be more aggressively contributing to HTML5, with future Flash Platform development to focus on personal computer and mobile applications.  Great!  Our clients who are developing mobile experiences are universally doing so with the intention of making installable applications.  More Adobe focus in this area will only enhance the experiences that we are able to work with them to deliver.

The Flash Platform is still the best way to develop mobile application experiences intended to be deployed across the major application marketplaces: Apple, Android, and Blackberry.

However, what got the most attention in this announcement was that Adobe is discontinuing development of Flash Player for the mobile browser.  While this got many people up in arms, declaring the general demise of the Flash Player, we at RealEyes can respect this decision and see the validity of it.  For Adobe, the return on investment for this runtime simply wasn’t there, and with the fragmented nature of Android (and a few other issues that contribute to delivering an application to all browser, OS, and mobile hardware configurations) the continued development of the mobile Flash Player would be exponentially complex.

For application developers, the mobile Flash Player was never as good a runtime as the desktop one.

So, how is the discontinuation of mobile Flash Player affecting our clients? Really, it isn’t.

Because mobile device users are more likely to look exclusively toward installable applications for rich media content—and RealEyes’ Flash Platform applications largely deliver rich media content—our customers have been developing applications built using the Flash Platform and relying less on the mobile web.  Mike Chambers does a nice job of discussing the differences in how users consume rich content on mobile devices compared to the desktop, and we agree wholeheartedly that this is the way to go.

Because Flash Player doesn’t have the same ubiquity on mobile devices as it does for desktop browsers RealEyes was already advising our clients to create fallback experiences for their Flash content for mobile browsers.  For most of them we could achieve the same functionality in HTML as in Flash (video being the exception as you’ll see below).  Why not forgo Flash entirely and have a single HTML codebase to support?  Seems like a decision that makes good business sense.

Not that we aren’t sad to see mobile Flash Player go: we are.

If only because we don’t want the web to have missing plugin alerts. Having the Flash Player plugin available to Android and Blackberry mobile browsers was a convenience that offered a great marketing pitch, but, truthfully, delivered very little.  This is due, in large part, to the fact that the majority of the web was design for the desktop and was not meant for (nor is it very functional for) mobile phones – period, full stop.

In truth, we’ve seen just a very few Flash applications developed specifically for the mobile browser.  We at RealEyes have developed just one of these for commercial release. And this application was built before AIR for Android and was always intended to be a stop-gap until this runtime was available.

Now, tablets make a better use case for Flash’s place in the mobile ecosystem; however, the number of tablets that support Flash is under 30% of market share.  Given this and Apple’s seemingly prohibition on Flash, the Flash Player was just never going to achieve the same ubiquity as it has on the desktop for tablets, or for mobile phones for that matter.

Adobe Supports HTML5 Development

As Adobe is a multimedia creation company it will want to be at the forefront of whatever technology is defining exceptional user experiences for multimedia delivery.  And, for a few years now, Adobe’s been looking toward HTML5.  Unfortunately, the announcement from Adobe that contains the information about the discontinuation of the mobile Flash Player makes it sound like Adobe’s just jumping on HTML as a development platform.  That’s just not true.

Even more unfortunate in the present debate is a perception that Steve Job’s thoughts on Flash have somehow won and that this was just fallout from an Apple v. Adobe war.  Not so fast.  Apple and, to some degree Microsoft, have done much to market HTML5 development to the point that its perception overpromises what it can deliver.  Although Adobe has been working to educate its community about the benefits of the Flash Player over HTML5 and was backed by legions of developers, animators, designers, and content creators, they couldn’t overcome the tactics of a such powerful and cunning marketing machines.  While standing its ground on the mobile Flash Player, Adobe was, in many ways, able to achieve what critics said was not possible with Flash Player on mobile devices.

So, if Steve didn’t win, who did?

Well, Adobe is still poised to win and … more importantly so is its community of developers and customers.  Look at tools like Adobe Edge and the new mobile enhancements to Dreamweaver.  Also, with Adobe’s acquisition of PhoneGap, Adobe developers are poised to deliver the best HTML5 experiences out there.  Yeah, it’s not Flash … but that’s OK. While it seems like Adobe’s making a sharp turn toward HTML5, from where we sit, they are more fully committing to a direction that Macromedia, and then Adobe, started in some time ago.  Remember the HTML and Flash being friends video from Adobe MAX last year?

And, with other recent innovations for mobile AIR such as the availability of native extensions, the future of mobile development is exhilarating for any Flash Platform developer.  We’re hopeful that Adobe will use this opportunity to sharpen their focus on native mobile functionality and continue the path of making the Flash Platform the best choice for developing multi-platform mobile applications with a single code base.

However, the perception that Adobe’s making a rash decision is very damaging and something that we’re working with our clients to help them understand.  The reality of the situation is that not much has changed; however, poor communication, horrible messaging, and virtually no community outreach from Adobe regarding this messaging has made the perception the accepted reality in the short term.

And, if that weren’t enough news for one week …

Adobe Really Open Sources Flex

In clarifying its future plans for the Flex SDK, Adobe announced that the Flex SDK will be contributed to an open source foundation.  The good news in this move is that the Flex community is mature enough to take on the governance of this robust framework moving forward.  This wasn’t the case in February of 2008 when Adobe released Flex 3 as open source (Adobe had been planning to open source it since April of 2007).

For several years now, Adobe has been moving towards a more open standard with their development and this decision to contribute the Flex SDK to an open source foundation isn’t something that’s Adobe has done in isolation, and not just to the Flash Platform.  Some other projects that are on this path are:

  • PhoneGap
  • BlazeDS
  • Flex SDK

And, in reading Adobe’s clarification to this open source announcement, we see even more reason to be excited.  They are also open sourcing tools that support Flex including an experimental one (Falcon JS) that cross-compiles MXML and ActionScript to HTML and JavaScript.  Now, that’s exciting!  And, we’re sure that more is on the horizon.  Maybe HTML and Flash can be friends after all.

And, let’s be honest, the original model that Adobe used to open source Flex didn’t go as planned.  While Adobe always said they welcomed contributions from the community to grow and improve the Flex SDK, the process for getting a change accepted was unclear and many community contributions were rejected for any number of reasons (valid or invalid).  Adobe simply did not have the process or the resources to handle the influx of developers who wanted to contribute.  It was a frustrating situation for the Flex development community (and arguably Adobe as well).

So, the vibrant Flex community answered back earlier this year by creating the Spoon Project to better organize and test Flex SDK modifications submitted by the Flex community.  It proved to be an excellent model, drove innovation of the Framework, and was an initial step toward the full open source move that Adobe just announced.

Who’s governing the future of Flex? We are!

In case the nuance in what’s different now versus Adobe’s 2007 decision to open source Flex isn’t apparent, the major difference is that the Flex community will extend the Flex code base without needing Adobe’s permission to do so.  A new governance, following Apache’s well-established community rules, will be formed to determine the future direction of the codebase.

Since our inception RealEyes has been in close contact with Adobe’s Flash Platform team, we’re excited for this change in governance. RealEyes has always been super excited about the Spoon Project, and our Development Manager (Jun Heider) is very active in this community as the Infrastructure Chairman.  We’ve seen that this is truly a community-driven initiative that is supported by Adobe to increase the volume, speed (and maybe even the quality) in which the Flex framework can grow.

We are excited to contribute further to the future of Flex and confident that, like other successful open source communities, the language will continue to evolve.

Also … Flex isn’t all of the Flash Platform

Sadly, many of the announcements that we’ve been talking about, including the open sourcing of Flex, led many to say that Flash is dead. That simply isn’t true.  Let’s talk about what the Flex framework actually is: a particular framework used to structure Flash Platform development.  Do you have to use it to develop Flash Platform applications? No. And, to be honest, RealEyes doesn’t use Flex in every Flash Platform project because sometimes that framework can make applications to “heavy”.  If performance is of paramount concern for a Flash Platform application, Flex often cannot replace pure ActionScript.

Flash and Flex are not going away.  Adobe is still committed to developing tooling to support development for the Flash Platform. Further, Adobe hasn’t open sourced the Flash Player, the most installed piece of software in the history of the internet.  Adobe plans on steadily contributing to the Flex SDK in its open sourced project and we are working with the Flex community to make us contributors as well.

Adobe and Enterprise Applications

In a week of poorly handled communication, probably RealEyes’ largest concern was Adobe’s statement that “In the long-term, we believe HTML5 will be the best technology for enterprise application development.” Ouch.  Big enterprises have invested millions upon millions of dollars in the development and maintenance of Flash Platform applications.  At the very least that statement can erode the confidence that large companies (or companies of any size, really) have when building systems based upon Adobe technology.  Something that we feel is probably a bit of an over-reaction.

Also, without context this statement is very misleading.  Currently, HTML5 does not have full functional parity with the Flash Platform.  A few days after making this statement, Adobe clarified it by indicating what it intended as a timeframe for HTML5 to be able to truly complete with Flash Platform development: three to five years. That timeframe could be heavily extended when considering corporate browser adoption timelines.

There’s no enterprise that can wait three to five years for functionality.

As Adobe stated, “Flex has now, and for many years will continue to have, advantages over HTML5 for enterprise application development – in particular:

  • Flex offers complete feature-level consistency across multiple platforms
  • The Flex component set and programming model makes it extremely productive when building complex application user interfaces
  • ActionScript is a mature language, suitable for large application development
  • Supporting tools (both Adobe’s and third-party) offer a productive environment with respect to code editing, debugging and profiling and automation.

We see all that as being the case and some more:

  • Enterprise clients tend to have slower adoption rates for software, meaning that not all enterprises support the advanced HTML5 features that exist.
  • In particular, the video capabilities in HTML5 are not as robust as what is available in the Flash Platform including multicasting with integrated hardware acceleration and advanced security models.
  • The testing issues for supporting browser fragmentation can be daunting to enterprises, compared with supporting a Flash Platform application that can be deployed across desktop browsers with consistent display and functionality.

RealEyes will continue to recommend Flex and Flash Platform development to our clients where it makes real business sense to do so.  That said, there are reasons to use HTML over (or alongside) the Flash Platform, and we have plenty of clients we support who do that as well.

The Impact to RealEyes

So, what does all of this mean to RealEyes?  In the short term, it has meant a challenge to bring context to Adobe’s announcements and dispel rumors and misinformation to our clients. In the long run, it probably doesn’t mean a lot.

We have already been on a path of technology diversification with continued focus and adoption of HTML5, its supporting technologies, and native mobile development. Many of us are in the technology space because we enjoy the challenge of evolving our skills as the industry grows.  However, for the next few years, we anticipate that the Flash Platform will continue to be our predominant focus.

Our development specialty has been in delivering industry-leading streaming media solutions and multiscreen development. Flash and AIR are still the best solutions for this and will be for a while.  The timeline for that largely depends on Adobe and, as a valued Adobe Solutions Partner, we will continue to support them in as educated and balanced way as possible.

We are actively involved in the future of the Flex framework through the Spoon Project and excited about the potential for future growth for that project.  We are now even more apt to contribute to the betterment of this already robust framework for the benefit of the Flex community.

Finally, RealEyes has always helped our clients to choose the best technology to power a given project and we will continue to do this.  And, as HTML5 becomes a more comprehensive solution, we will likely recommend it more frequently. It is truly about what is right for the current and future on a case by case basis. Our clients and projects will continue to be industry leaders, no matter the technology behind them.

——————–

Now, we can’t see all of the news in a positive light.  And not all of it is positive – certainly not for the 750 Adobe employees who were laid off and their families. However, this degree of restructuring in the fourth quarter isn’t unprecedented for Adobe.  We’ve seen this over the past couple of years.  This year, as in years past, we lost meaningful relationships with Adobe employees that we’ve been happy to collaborate with on community and development projects.  We at RealEyes have close contact with Adobe and tend to focus on how individuals shape the platforms, products, and communities that we work with instead of quarterly earnings and fiscal projections.  While adjusting to this restructuring, we wish all of the affected employees only the best in their next moves and hope that they will continue to make positive contributions to the technical community they have helped to shape.

Additional Links:

Royal Wedding Couple

On April 29 of this year, the world, (well, a little less than a third of the world, ~2 Billion people) witnessed the marriage of Catherine and William live as the Royal Wedding was broadcast to the masses from the U.K. A significant number of these viewers (over 3 Million concurrent viewers) successfully viewed the event live by streaming video from live content providers such as Akamai, UStream, YouTube Live, and Yahoo that utilize Flash Media Server and the RTMP protocol. Akamai reported a peak of 2.9 Million concurrent streams, a number which is nearly double that of its previous record-1.6 Million streams for the 2010 FIFA World Cup. UStream also had impressive numbers to report, with 330,000 concurrent streams coming through their system for the event. Yahoo also reported record traffic, with over 50,000 requests made per second, 27 Million video streams, and 2.6 Million live streams that day.

Sandvine report on internet usage during Royal Wedding

Image taken from gigaom.com

Despite fears that an event of this magnitude would strain the delivery capabilities of the internet to the point of failure, there were no reported issues related to content streamed with Flash Media Server. This successful display of streaming prowess is even more impressive when you take into account that the Royal Wedding’s demands on live streaming caused a 100% increase in RTMP usage, and represented 4% of all internet activity for that day. It was also reported that non-live Flash video streaming utilizing other protocols grew only marginally.

This is, of course great news for consumers of streaming media, considering the 99% penetration of the Adobe Flash Player on computers worldwide. The last Five years have shown remarkable improvements in what consumers can expect from the quality of streaming media experiences, regardless of the amount of concurrent users accessing the media. Indeed, considering that only Five years ago, there were virtually no live streams being served by Flash, it is safe to say that Adobe is on an upward trajectory, and will no doubt be able to handle the large-scale, streaming media events yet to come.

Digital-Tutors is a recognized leader in on-demand training for the motion graphics industry, partnering with leading design studios, software manufacturers, and educational institutions.  To extend their platform of web and mobile video applications, Digital-Tutors worked with RealEyes Media to create a new version of their online training library that would allow users to download lessons and courses for offline viewing, while continuing to advance the features in their training platform: Digital-Tutors Vault.

Today, Digital-Tutors is releasing the second major release of Vault, coupled with a new Web application that brings Vault’s advanced user interface and much of its functionality to the browser. Curious about what all the fuss is about? Vault 1.6 includes enhanced group functionality and updates to Digital-Tutors’ streaming technology.

Digital-Tutors Vault provides digital visual artists at all experience levels the opportunity to stream training content while online and use a credits system to download and lease DRM protected content for offline viewing. All users are welcomed to the application with an HTML experience that is seamlessly integrated into the application.  Through an API, the HTML pages can execute actions in the parent AIR application, allowing Digital-Tutors to highlight important content easily. To keep content fresh, Vault has an integrated asset and data update system that ensures users have the most up-to-date local catalog assets. In fact, the AIR application is bundled with catalog assets (local database, images, HTML, and JavaScript) so users experience a robust application right from the start – even when offline.

With the ability to move category tabs such as Browse and Playlists as well as create and organize custom tags, notes and video clips, Vault provides an extremely customizable digital learning environment.  The Vault application also automatically syncs custom user data across Digital-Tutors suite of applications, including web and iPhone, so that items like view progress and clips are consistent across all of a user’s devices.

Want to experience Vault for yourself:
http://www.digitaltutors.com/09/vault.php

David Hassoun

David Hassoun

John Crosby

John Crosby

Open Source Media Framework (OSMF) simplifies the development of media players by allowing developers to assemble components to create high-quality, full-featured video playback experiences. This open framework enables development focused on web-based video monetization, with lower costs and faster turnaround. – osmf.org


From building a simple player, to understanding plug-in development and use

Recently, Adobe Developer Connection posted a three-part series of articles entitled “Mastering OSMF“, by David Hassoun and John Crosby of Realeyes Media. The series, in addition to being divided into its three main sections, is broken down further into 11 walkthroughs which take the reader through various scenarios; from building a simple player using OSMF, to incorporating custom plug-ins into OSMF-based media players. A brief overview of the series:

Mastering OSMF-Part 1: Working with the Flash Platform

Part 1 gets you started with the basics of OSMF, and introduces the Strobe Media Playback media player, a precompiled SWF provided by Adobe that you can use in your projects. You also learn how to build a simple media player using OSMF, and to then how to break out the player’s controls to manage them independently. Finally, you learn how your player can be configured to handle different types of media using the MediaFactory class, and the generic MediaElement class.

Mastering OSMF-Part 2: Creating and customizing your player

Part 2 expands upon concepts discussed in Part 1, and explores the complex layout and container functionality that OSMF offers you as a developer. Also discussed are serial and parallel complex compositions, which allow for the customized presentation of media that needs image overlays, for example, or for multiple clips that need to be presented sequentially.

Mastering OSMF-Part 3: Working with plug-ins

The final installment in the series goes into the use and creation of plug-ins within your OSMF-based applications. In Part 3 you learn about the potential plug-ins used with OSMF have to create vastly more powerful and functional media players. Advertising integration, and analytics gathering are but two functions served by the use of plug-ins in OSMF.

Challenges of the Mobile Platform

  • Delivering a multimedia experience
  • Performance & Memory
  • Usability and User Experience

Solutions

  • Flash Player 10.1
  • Open Source Media Framework (OSMF) based media playback
  • Custom, light-weight framework for visual presentation and data management
  • CSG Systems’ Content Direct

Background

Realeyes Media, together with CSG Systems, built the Content Direct Mobile media streaming application. CSG Systems (NASDAQ: CSGS) provides software and services-based solutions that help clients improve commerce by better engaging and transacting with their customers. CSG provides enabling applications and a monetization platform to engage customers wherever they consume content.

Content Direct, a business unit of CSG, is focused on providing a complete ecosystem of online, mobile and OTT content and merchandising solutions.  Its solution empowers service providers, content creators, aggregators and distributors to easily and effectively market, monetize and manage their members and build engaging relationships by leveraging rich content.

Content Direct was created  to manage live events, content for video, music, games, other digital wares and physical merchandise and provide a flexible “browse, buy and belong” membership experience.  Content Direct provides consumer the ultimate flexibility in how they find, pay and manage their content choices and how they interact with their entertainment brands.

Content Direct is architected as a set of application modules (Member, Content, Commerce and Advertising) that expose its functionality through a set of well defined web services to applications such as the Online Storefront for Devices, , a Customer Care  Portal, Reporting Portal and the Invision Portal, a metadata manager.

Some of CSG’s  clients include:

  • Ultimate Fighting Championship
  • NBC Universal Sports
  • Onlive (Gaming)

CSG chose RealEyes as their partner to extend Content Direct’s online experience to mobile, enabling customers to market their premium video pay-per-view or subscription content on mobile devices.  Content Direct enables consumers to be able to watch, buy and manage their content from any device at anytime, anywhere.  Having established online, OTT and connected device solutions, Content Direct Mobile provides another way for customers to view and manage their content.   Content Direct Mobile allows users to search for content, buy video, manage their account and watch videos from their Flash enabled phones.

CSG partnered with RealEyes and Adobe to create Content Direct Mobile.  RealEyes and Adobe were obvious partners to extend Content Direct Mobile’s strategy.   RealEyes’ deep experience with Flash, Flash Mobile, OSMF combined with their relationship with Adobe were invaluable, and Adobe’s Flash penetration and the planned rollout to the mobile devices worldwide made Adobe a natural partner in deploying the Content Direct Mobile solution.

The Application

The Content Direct Mobile application uses the Content Direct’s existing data services and streaming media built for existing browser based clients and leverages the Flash Player 10.1 mobile player to create a rich and engaging mobile client experience to search, manage and view personalized media selections and libraries. Using a custom and light-weight visual presentation framework, the Content Direct Mobile application manages visuals and content in such a way as to conserve as much memory and resources as possible.

The Framework

Taking into account the Flash Player 10.1 improvements and optimizations already provided by the Flash Player team, the Content Direct Mobile application framework was built for speed and light weight. RealEyes built a powerful lightweight layout management system and UI controls that were optimized for mobile application development. This provided the application a versatile and sturdy foundation to build upon. Some of the challenges that we looked to address early on were screen rotation, and resolution independent layout. One of the benefits to both of the above challenges was there was no need of new ActionScript API’s or Flash runtime to build and manage such issues. This allowed us to utilize our past experience and apply it to the mobile application arena without losing a step.

Another area of focus for the framework and optimization was screen transitions and dynamic media asset management. Utilizing the robust ActionScript 3 bitmap management and caching appropriately for both content and motion played a major part in this. The custom bitmap management allowed us to maintain high quality motion and frame-rate while still keeping power and file weight low.

We enabled full branding and UI skinning via the clients data services and an Adobe Flash Professional source file created and managed in Flash CS5. Currently this media asset package creates a library file (SWC) that is utilized by the pure ActionScript 3 application developed in FlashBuilder 4.

The Media Player

The Content Direct Media player was built using Adobe’s Open Source Media Framework (OSMF). A testament to the quality of the OSMF and Flash Player 10.1, is the ability of the player to perform on a mobile platform without modification. In the future the media player could be an area of modification for optimization and performance enhancement, but right out of the box OSMF filled our needs and exceeded our expectations.

The extensibility of the OSMF allowed us to build in a custom control bar that is highly customizable for any client of Content Direct. In addition the OSMF plugin extensibility capabilities are a major benefit to the project and offer a high level of extensibility with ease.

The Bonus of AIR for Android

Having built the Content Direct Mobile application as an ActionScript 3 application, the transition from a browser based application to a natively installed Android application was accomplished with minimal effort. The following is a basic overview of all we needed to do to create a the AIR for Android application package:

  • We began by extending the main ActionScript class from the browser based application in our AIR for Android application.
  • Integrate features built into to the Android Operating System, such as keyboard functionality and navigational features using the updated APIs from the AIR for Android SDKs.
  • Listen for and respond to events associated specifically with the mobile application to handle screen orientation and sizing efficiently.
  • Package an AIR file by use the Andoird SDK adt commands to create the Android package (apk).

Conclusion

As the Flash Platform matures and grows on mobile we are looking forward to the ability to collaborate with Adobe and other companies allowing us to use our existing, skills, content and code on an ever increasing number of devices. Another exciting facet of the improvements and optimizations for Flash Player on mobile is how it will affect other device platforms – from laptops and netbooks, to set-top boxes and consumer devices – the possibilities are expanding and very exciting for us.

Overall we at RealEyes have been incredibly impressed with the capabilities and the development process for Flash applications on the Android devices. Some challenges were encountered with integration into the browser when it comes to rotation and form inputs, but Adobe has recently released an excellent article which addresses many of those issues. Performance and battery life have been nothing less than astonishing, and even the video playback without hardware acceleration (a temporarily missing feature) has been very promising.

The biggest changes in development are solely around form factor for UI, and optimization for devices with lower power capabilities than the desktop. For those who are more reliant upon a full framework like Flex it may be a little more of a challenge, but with reasonable ActionScript skills and consideration for complexity and optimization it is amazing how easy it is to make robust applications for a Flash enabled mobile device.

The GTrack plugin has been built as an example of an OSMF proxy plugin. The plugin is able to send page tracking and event tracking for an OSMF MediaElement. The GTrack plugin uses the gaforflash library to send tracking to google analytics.

Page tracking is per MediaElement. Basically when the MediaElement is loaded and begins to play the URL of the resource is sent as a pageView to Google Analytics. You can also configure the value that is sent by adding metadata to the URLResource for the MediaElement. An example of this can be found in the Configuration section.

Events are sent to Google Analytics based on an XML configuration. Each of the MediaElements main traits can be configured to send a tracking event.

The GTrack plugin determines which tracking should be sent and what values are sent to Google Analytics via XML configuration.

This node specifies the Google Account to associate the tracking with. You can specify multiple <account> nodes to send tracking to multiple accounts. The value for this node can be found in your Google Analytics account and should look similar to – ‘UA-1234567-1′.

Example:

        <account><![CDATA[UA-1782464-4]]></account>
        <account><![CDATA[UA-1782464-5]]></account>

The <url> node is the URL that was set as the profile URL to be tracked by Google Analytics.

Example:

        <url><![CDATA[http://osmf.realeyes.com]]></url>

The <event> node is what defines the tracking that will be sent to your Google Analytics account. The ‘name’ attribute of the node is the key that tells the GTrack plugin to send an event. So, the names much match exactly. There are multiple types of events that can be tracked:

Example:

        <event name="percentWatched" category="video" action="percentWatched">
                <marker percent="0" label="start" />
                <marker percent="25" label="25PercentView" />
                <marker percent="50" label="50PercentView" />
                <marker percent="75" label="75PercentView" />
        </event>

This configuration example will track the start, 25, 50 & 75 percent markers as the media item is played. The complete is tracked by the complete event see MediaElement Events below.

Example:

        <event name="timeWatched" category="video" action="timeWatched">
                <marker time="5" label="5sec" />
                <marker time="10" label="10sec" />
                <marker time="20" label="20sec" />
        </event>

This example will send tracking at 5, 10, & 20 seconds respectively

MediaElement events are based off of the MediaElement’s available Traits. If the MediaElement supports a specific trait and there is an event that can be associated with the trait tracking can be defined for it. Example:

        <event name="complete" category="video" action="complete" label="trackingTesting" value="1" />

This example will send tracking when the MediaElement has completed playing.

The <updateInterval> node defines the interval that the GTrack plugin checks the current time and position of the currently playing MediaElement to determine when to send the time and/or percentage based tracking.

The <debug> node is not currently used but is planned to be implemented as a custom logging & debugging feature.

The node attributes (except for the name attribute) correspond to the tracking values defined in the Google Analytics Tracking API for Event Tracking

  • category: String – The general event category (e.g. “Videos”).
  • action: String – The action for the event (e.g. “Play”).
  • label: String – An optional descriptor for the event.
  • value: Int – An optional value associated with the event. You can see your event values in the Overview, Categories, and Actions reports, where they are listed by event or aggregated across events, depending upon your report view.

Sample XML configuration:

<value key="reTrackConfig" type="class">
        <!-- Set your analytics account ID -->
        <account><![CDATA[UA-1782464-4]]></account>

        <!-- You can track to multiple analytics accounts by adding additional <account /> nodes -->
        <!-- <account><![CDATA[{ADDITIONAL_GA_ID}]]></account> -->

        <!-- Set the url that you registered with your GA account -->
        <url><![CDATA[http://osmf.realeyes.com]]></url>

        <!-- Set up the percent based tracking -->
        <event name="percentWatched" category="video" action="percentWatched">
                <marker percent="0" label="start" />
                <marker percent="25" label="view" />
                <marker percent="50" label="view" />
                <marker percent="75" label="view" />
        </event>

        <!-- Set up the event tracking for the completed event -->
        <event name="complete" category="video" action="complete" label="trackingTesting" value="1" />

        <!-- Set up the event tracking for the completed event -->
        <event name="pageView" />

        <!-- These are the other available events that can be tracked -->
        <!--
        <event name="autoSwitchChange" category="video" action="autoSwitchChange" />
        <event name="bufferingChange" category="video" action="bufferingChange" />
        <event name="bufferTimeChange" category="video" action="bufferTimeChange" />
        <event name="bytesTotalChange" category="video" action="bytesTotalChange" />
        <event name="canPauseChange" category="video" action="canPauseChange"  />
        <event name="displayObjectChange" category="video" action="displayObjectChange"  />
        <event name="durationChange" category="video" action="durationChange"  />
        <event name="loadStateChange" category="video" action="loadStateChange"  />
        <event name="mediaSizeChange" category="video" action="mediaSizeChange"  />
        <event name="mutedChange" category="video" action="mutedChange"  />
        <event name="numDynamicStreamsChange" category="video" action="numDynamicStreamsChange"  />
        <event name="panChange" category="video" action="panChange"  />
        <event name="playStateChange" category="video" action="playStateChange"  />
        <event name="seekingChange" category="video" action="seekingChange"  />
        <event name="switchingChange" category="video" action="switchingChange"  />
        <event name="traitAdd" category="video" action="traitAdd" />
        <event name="traitRemove" category="video" action="traitRemove"  />
        <event name="volumeChange" category="video" action="volumeChange" />
        <event name="recordingChange" category="dvr" action="recordingChange" />
        -->
        <!-- Time based tracking (in seconds)-->
        <!--                            
        <event name="timeWatched" category="video" action="timeWatched">
                <marker time="5" label="start" />
                <marker time="10" label="start" />
                <marker time="20" label="start" />
        </event>
        -->
        <debug><![CDATA[true]]></debug>
        <!-- How often you want the timer to check the current position of the media (milliseconds) -->
        <updateInterval><![CDATA[250]]></updateInterval>
</value>

  1. Add the <event> node to the XML configuration
  2.         <event name="complete" category="video" action="complete" label="trackingTesting" value="1" />
  3. Add a MetadataValue to the URLResource object for the MediaElement
  4.         var resource:URLResource = new URLResource( PROGRESSIVE_PATH );
            resource.addMetadataValue( GTRACK_NAMESPACE, {pageURL:"AnalyticsTestVideo"} );
  5. Create the MediaElement
  6.         var element:MediaElement = mediaFactory.createMediaElement( resource );

This will track the String ‘AnalyticsTestVideo’ instead of the URL of the media resource.

  1. Set up the player
  2.         protected function initPlayer():void
            {
                    mediaFactory = new DefaultMediaFactory();
                    player = new MediaPlayer();
                    container = new MediaContainer();                      
                    this.addChild( container );
                    loadPlugin( {PATH_TO_GTRACK_PLUGIN_SWF} );
            }
  3. Set up a loadPlugin() method.
  4. Create a URLResource that points to the GTrackPlugin.swf
  5.         var pluginResource:MediaResourceBase = new URLResource( {PATH_TO_GTRACK_PLUGIN_SWF} );
  6. Add the XML configuration to the pluginResource as a MetaData value – ‘gTrackPluginConfigXML’ is an XML variable
  7.         pluginResource.addMetadataValue( "http://www.realeyes.com/osmf/plugins/tracking/google", gTrackPluginConfigXML );
  8. Listen for the plugin load events
  9.         mediaFactory.addEventListener( MediaFactoryEvent.PLUGIN_LOAD, onPluginLoaded );
            mediaFactory.addEventListener( MediaFactoryEvent.PLUGIN_LOAD_ERROR, onPluginLoadFailed );
  10. Load the plugin
  11.         mediaFactory.loadPlugin( pluginResource );
  12. The loadPlugin() method should look something like:
  13.         private function loadPlugin( source:String ):void
            {
                    // Create the plugin resource
                    var pluginResource:MediaResourceBase = new URLResource( source );
    
                    // Add the configuration data as Metadata to the pluginResource
                    pluginResource.addMetadataValue( GTRACK_NAMESPACE, gTrackPluginConfigXML );
    
                    // Set up the plugin listeners
                    mediaFactory.addEventListener( MediaFactoryEvent.PLUGIN_LOAD, onPluginLoaded );
                    mediaFactory.addEventListener( MediaFactoryEvent.PLUGIN_LOAD_ERROR, onPluginLoadFailed );
    
                    // Load the plugin
                    mediaFactory.loadPlugin( pluginResource );
            }
  14. Once the plugin is loaded, remove the plugin listeners and load the media
  15.         protected function onPluginLoaded( event:MediaFactoryEvent ):void
            {
                    // Remove the plugin listeners
                    mediaFactory.removeEventListener( MediaFactoryEvent.PLUGIN_LOAD, onPluginLoaded );
                    mediaFactory.removeEventListener( MediaFactoryEvent.PLUGIN_LOAD_ERROR, onPluginLoadFailed );
    
                    // Create the media resource
                    var resource:URLResource = new URLResource( PROGRESSIVE_PATH );
    
                    // Set up the page tracking
                    resource.addMetadataValue( GTRACK_NAMESPACE, { pageURL:"AnalyticsTestVideo" } );
    
                    // Create & set the MediaElement
                    var element:MediaElement = mediaFactory.createMediaElement( resource );
                    player.media = element;
                    container.addMediaElement( element );
            }

http://code.google.com/p/reops/source/browse/#svn/trunk/plugins/tracking/google/GTrackPlugin

Contact RealEyes

For more information about OSMF plug-ins, or to inquire about custom plug-in development: