In 2014, we released our new HTML5 player — Arpeggio (pronounced: ahr-pej-ee-oh). It's built from the ground up with HTML5 and future technologies in mind. Our Flash "Legacy" player (which also supports mobile-only HTML5 playback) will still be available for the foreseeable future.
- Benefits of Arpeggio
- How to enable Arpeggio
- General release
- Player appearance
There are many reasons why you'll want to use Arpeggio going forward:
- Arpeggio is completely HTML5 compliant. This means it will work on the vast majority of mobile and desktop devices, will require no third party software (such as Flash Player) to display content within the player or to customize the player in your own way, and will load the video content even faster than the Flash player.
- Timeline comments can be created and viewed on many mobile devices. (This is very dependent on the restrictions of video playback on mobile operating systems. For instance, iOS gives little access to the appearance and functionality of its web video player on iPhones and iPod Touch.)
- It will integrate much better with our upcoming Media Community* product.
You may use Arpeggio by navigating to your Player Setup (Default Settings > Player Setup). Click 'Arpeggio' and scroll down to click 'Save'. This will not affect any of your current video embeds. Arpeggio works as a different player type based on the video embed code. This means you can embed videos using the Flash and HTML5 players side-by-side. If you'd like to use the Arpeggio player with your previously embedded videos, then you will need to copy the new embed code for the appropriate video(s), or — if you're very familiar with HTML — change the portions of the embed code which affect player type and size (to avoid letterboxing/pillarboxing).
To get more technical, you can change the player type in your iframe embed code(s) by changing player=full to player=arpeggio.
You may find some functionality (if you're familiar with in our Flash player) unavailable. Continued updates will be made to Arpeggio. Your feedback is extremely important in its continued development, so please don't hesitate to submit a support ticket and share your thoughts.
Features in Flash not yet in Arpeggio
- Video Commenting
Arpeggio adds additional embedding options not previously possible with our Flash player. Now, you will have embed codes and features which will make embedding videos into your website or platform much more seamless.
iframe - Our iframe embed code will function the same as any other iframe embed code. You now have the option to embed comments for a particular video separately from the player — if you have commenting enabled.
div - Some platforms may not support iframe embed codes. In this case, we have a DIV embed code. Again, the video embed and comments embed are separate and both optional.
Arpeggio adds functionality for easily enabling the player to be responsive with your website. All you need to do is remove the
height from the embed code and change the width to:
width="100%" (See here for more)
As our Arpeggio player evolves, we will have changing embed codes. It's our goal to make any transition to the new player and/or embed codes as frictionless as possible. At this time, if you're using our iframe embed code, then you will not need to make any changes to support the future updates of the Arpeggio player.
Creating a timed comment
- Pause your video. Then, click anywhere along the timeline to place the playhead at that position.
- Hover your cursor over the playhead and you will see a plus (+) symbol. Click this and you'll have several options: Add comment; Add tag; Add video comment; Set thumbnail. Select 'Add comment'.
- You will now have a small box to enter text within. Enter the comment you'd like to have appear at this position in the video. There's a limit of 1,000 characters per comment.
- Note: You may use basic HTML to add a link here. Use the <a> tag to do this. For example, if you'd like to make the comment, 'Do you feel that our new design page is being marketed well?', then you could link to the specific page by writing the comment as follows:
Do you feel that our new <a href="http://www.viddler.com/">home page</a> is being marketed well?</a>
The comment would look like this:
Do you feel that our new home page is being marketed well?
4. Lastly, click 'OK' to save the comment at that position along the timeline.
Chapters require an Advantage or higher account.
To create chapters on your video, just navigate click 'Edit' for a video, then click the 'Interaction' tab. From here, you'll have the ability to manage Comments and Chaptering. Creating chapters requires entering a time and a chapter name (shorter chapter titles are best).
Chapters will appear in the upper menu on the player and each can be clicked to skip to that chapter/position in the video.
Skipping functionality requires an Advantage or higher account.
Enabling skip buttons can be done at the account level or in individual embeds. To enable at the account level, navigate to Default Settings > Player Setup > Customize. Enable 'Go Back' and/or 'Go Forward', then define the number of seconds you'd like the viewer to seek in that direction when they click the button.
Playback speed control requires an Advantage or higher account.
Our HTML5 player has the option for altering the playback speed of a video to be faster or slower than the original speed. This is great for those that need to faster to save time, or slower better comprehend the material. Speeding up or slowing down playback maintains the same audio pitch — avoiding the well-known "chipmunk" or "Darth Vader" sounds.
To enable Speed Controls, navigate to Default Settings > Player Setup > Customize. Then select the 'Show speed controls' checkbox.
You may allow your viewers/subscribers to download your videos via the player. To do this, you need to have your video download permission to be set to 'All Viewers'. The download permission can be done on an individual video, or by setting the default for new uploads via Sharing under Player Customization.
Our HTML5 player is built with modern browser compatibility in mind. This means it's compatible with the latest version of Firefox, Chrome, Safari, Internet Explorer, Opera, and their mobile counterparts. We have a detailed chart of compatibility on our developer documentation. In addition, you can also use this extensive compatibility chart based on the HTML5 Video element (<video>): caniuse.com/#feat=video
Arpeggio is pronounced as ahr-pej-ee-oh. Play the audio below to hear.
*Coming in 2015.