Design Template by Anonymous
Implementation Styles
Style: Click to Play
The click to play video style is arguably the most commonly used way of having media displayed on webites. This is the standard style and is effective because users are already comfortable with what to expect and don't need to think much when they come across one. Generally, this style is best used to act complementary to the textual information on the site. It can act as an option for the user, if the user wants to read the textual information then they scroll past the video with no interaction needed, or if the user wants to watch the video, they interact by clicking play. It's pretty straightforward and leaves the user satisfied because they are in control.
Example Breakdown
In the example provided, it illustrates an optimal way of using a click to play video. This is taken from a cooking site explaining how to make mashed potatoes. The creator recognized that some users would prefer to read the step by step directions just below the video, while some users would prefer to learn by watching a video. As seen in above, the cooking video is only played if the user decides to press play that way the users who want to read aren't disrupted by it.
Style: Autoplay
The autoplay video style is an alternative to click to play. Instead of requiring users to interact, once the web page is opened and the video is within the device's display it will automatically begin playing. This is highly effective in grabbing the user's attention. The user's eyes will instinctavly be drawn to the moving display or hear sound and be forced to interact. With that said, it shouldn't be used for this sole purpose because chances are the user doesn't want to be disrupted and forced into an action when opening a site. An important consideration is to have autoplay videos muted to prevent the user from being startled by a loud sound playing out of their control. Autoplay videos are best used to act as the focal point of your site. Having an autoplay be complementary to textual information is fairly redundant because you've taken away the user's choice by playing a video for them. Autoplay videos make the user's choice, so the video should be effective in achieveing their reason for visitng the site.
Example Breakdown
In the example provided, it shows a perfect space for where an autoplay video could be implemented. The web page has been created to tell the user how to fix a flat tire. This can be challenging to explain by simply providing text, but a video does a superb job in sharing a physical demonstration of how to fix a tire. Since a visual demonstration would mostly be preferred by user's as opposed to text, it's fair to make the choice for the user by having the video automatically play. Notice how it starts muted to prevent startling the user.
Style: Follow the Scroll
The follow the scroll video style is a very dynamic option of having media displayed on webites. Typically, it will sit or float in the lower right corner of the screen and as the user scrolls down the web page the video follows. Such a style is very unique and can be applied to achieve multiple purposes. Advertisement is a common way this style gets used because it distracts the user no matter where on the web page they are. Only once the user presses close to remove the video will it disappear. A different practice of this style can be done by complementing textual information. The video can act as a constant reference to the text on the main column of the web page following the user as they read down the page. Of the three covered so far, however, this style is most complex in developing through code.
Example Breakdown
In the example provided, it depicts how advertisement uses a follow the scroll video. This is taken from a finance website and so given the majority of their traffic is expected to have money-related interests, an advertisement is shown regarding currency exchanges and fees. Rather than being placed in one section of the site that the user can easily scroll out of, the video sits in the corner of the screen and constantly follows the user while they scroll down. This works well in distracting the user.
Style: Background
The background video style is professional way of having media displayed on webites. It works well by covering large white space on a web page into something engaging for the user. In addition, background videos are excellent in projecting emotion on the user. If a video is on the home page, then that is likely the first thing the user will process when opening a site. The video can set the tone while not getting in the way of navigation systems or pertinent information. Therefore, this can be a strong marketing tool; having a video of all the delicious main courses playing in the background while you search for the restaurants online menu for example. A consideration that comes with this style is the increased loading times. As I mentioned before, when thinking about implementing a video, it's important to ask how it will impact the user experience. Background videos are generally very large files because of their necessary size which adds to the loading time of accessing the site.
Example Breakdown
In the example provided, it displays how a background video typically looks on a web page. This is taken from a yacht company and boasts the experience of going on a yacht. People are having a great time in the background while you scroll for the information you are looking for. Subconciously, this visual of seeing people have a fun experience makes you more inlcined to want to as well, proving that it is a great marketing tool. Notice how the web page layout isn't impacted by this style choice of media, navigation and search bars are still very clear for the user.