Accessibility

Accessibility

Tailor your digital experience to your specific needs by adjusting the accessibility preferences below
tool-icon
Reduce motion
tool-icon
Dark mode
tool-icon
Large text
tool-icon
Large spacing
Book a call
Main menu
Accessibility

Accessibility

Tailor your digital experience to your specific needs by adjusting the accessibility preferences below
tool-icon
Reduce motion
tool-icon
Dark mode
tool-icon
Large text
tool-icon
Large spacing
Book a call

Optimising video for digital devices

Henry Foster
UX/ UI Designer

Video is becoming ever more prevalent and important across all digital channels and devices, from watching TikTok clips on your phone to ‘how to’ videos on your desktop. Creating seamless, optimised and inspiring videos will help engage and delight users, increase traffic to sites, boost interest in brands and drive clicks and revenue.

With over 80% of global internet traffic now coming from video, the content that people are now consuming has changed from text and imagery to videos and live streams. Over 50% of video consumption is taking place on mobile devices, smartphones and tablets. This trend is seeing an increase of 5% a year and is also reflected in the design of mobile phones, with bigger, higher-resolution screens. Responsive design is therefore crucial, as videos must work for all device and viewport sizes.

 

In this article, I will outline several key themes around the importance of video and how we, as UX designers, can optimise our designs to make consuming video as seamless and enjoyable as possible.

 

Why video optimisation is important

Boosts engagement

Videos can be more engaging and dynamic than still imagery, and they can convey a lot of information during a short amount of time. A well-shot video can therefore strengthen the relationship between a user and brand. Higher engagement can also lead to greater click-through and therefore sales.

 

Improved SEO

Search engines pick out the most relevant and user-friendly results for videos as well as written content, with Google also using mobile-first indexing. A descriptive video using considered language will boost its SEO opportunities.

 

Mobile video traffic is increasing

Video traffic is growing on an average of 5% every year, with real growth on mobile. A mobile-first approach with a primary focus on video is key to capturing new audiences while retaining existing users.

 

Considerations when designing for video

Appropriate video length

As a general rule of thumb, videos should last no longer than two minutes, with the purpose and context of the video determining its length. Consider where the video fits in the marketing and sales funnel. If the purpose of the video is a sales tool then it should be no longer than 60 seconds. If it is an educational or informative video then 2 minutes is appropriate.

According to AdAge, “if you have not fully engaged your audience after the first 30 seconds, you’ve likely lost 33% of your viewers, and after one minute, 45% of viewers have stopped watching.” 

 

Add a CTA

The inclusion of a highly visible CTA, usually in the form of a button or link, will help keep the user engaged with the site or product once the video has been consumed, nudging and directing them to the brand. The CTA should be incorporated into the overall design, and should not simply be an afterthought. This will help drive traffic to the company’s website or a specific landing page, allowing users to learn more about a product or sign up for more information.

 

Define the purpose of the video quickly and clearly

As already outlined, videos should be short and snappy. Research indicates that the average adult’s attention span is about 8 seconds, so try to focus on the core message as early as possible, as you will undoubtedly have an impatient audience!

 

Thumbnail importance

The thumbnail will be the first visual touchpoint for the video, so it must be engaging, informative and visually striking to make the audience want to play it. It must also try to capture the essence of the video to give the user an insight into its purpose.

 

Optimise for accessibility

Some viewers may have a disability, such as being visually impaired or hard of hearing. Videos should therefore have plenty of visual features such as infographics, subtitles, closed captions and video descriptions for screen readers.

 

Video player

The video must use a video player that is both mobile and desktop friendly. They range in price and quality, but the four I recommend using are:

  • YouTube
  • Vimeo
  • Spotlight
  • Dailymotion

 

Video size and loading speed

A fast-loading video without buffering is crucial, as the average site user is expected to bounce in just 3 seconds if a video is loading. This can be achieved by compressing videos, and reducing the size without affecting quality.

 

Using the correct aspect ratio

Creating the correct aspect ratio tailored for various screen sizes is essential when creating a streamlined video experience. Designers must consider the dimensions for the viewport size as well as the platform and channel it will be shared on. Also, bear in mind users like to watch videos vertically and horizontally on a mobile device, so be sure to define both when handing over designs. I have outlined the various aspect ratios and where they are used below:

  •   Portrait (9:16) Portrait is good for Facebook/Instagram Stories, IGTV, and mobile.
  •   Square (1:1) Square is good for Instagram posts and Facebook Carousel ads.
  •   Social (4:5) Social is good for social feeds.
  •   Vertical (2:3) Vertical is good for Facebook and Pinterest posts.
  •   Cinematic (21:9)

 

User control

Once the user is watching the video, make sure they have full control and flexibility over how they interact with the player and watch the video.

Users should be able to easily discover the following functionalities:

  • Volume
  • Playback speed
  • Full screen
  • Watch as a tab (Tab appears as a small modal at the bottom of the screen to allow the user to continue scrolling the page)
  • Settings panel to include:
    • Video quality
    • Language
    • Subtitles

 

Ease and context

Provide some information and context around the video’s purpose and content for the user, which can be in the form of a title and a description. Depending on the video’s purpose and the channel it’s being shown on, a length, date, save to favourites, and download option can also be included.

Another feature which can improve user experience is the collapsible player option (watch as a tab as outlined above), allowing the user to follow the video while scrolling and moving across pages.

 

Conclusion

Videos are quickly becoming the most popular way to communicate with friends and family, consume news and entertainment and promote goods and services. Taking time to consider video designs which are optimised to work across all platforms, channels, and devices is vital when creating seamless, engaging and inspiring video experiences.

 

Have a call

We’d love to talk to you about how Make it Clear can support your organisation. Book a call here.

 


Back to top