Andrew Abramov
Andrew Abramov 12 October 2016

Why Your Brand Should Be Using the Latest Image Technologies

With brands competing on the basis of customer experience, across multiple channels, and across an increasing number of devices, it is now essential to ensure images and media are delivered in an optimised form for every visitor.

[Andrew Abramov, Graph] While designs target a specific set of mobile and desktop resolutions, there are now so many devices in use that it is no longer feasible to design for every scenario. Image sizes and aspect ratios that work well on one device, do not necessarily work well on another.

As brands look to create content quicker, editors no longer have the time to create multiple crops. A better solution is needed.

Handling 1,400 Screen Resolutions

From smartphones, to tablets, to smart TVs, the number of devices has exploded over the last few years. While working on improving the customer experience for one of our clients, we found that their visitors were using over 1400 unique screen resolutions.

Brands now need an intelligent approach to delivering high-quality and appropriately cropped images that will cater for this vast range of resolutions.

One basic solution is to use HTML and CSS hacks for automatic crops (such as “background-size: cover”) to render the images inside many different shaped containers.

However, this approach doesn’t take into consideration the contents of the image. The default is that these automatic crops will be focused on the information in the center of the image, meaning that the context of the image is easily lost.


While uploading multiple image crops might seem like the obvious way forward, for today’s visually rich experiences this would create a considerable amount of work for content editors - and is time that should be better spent elsewhere.

A Smart Solution

So, what works?

Back in 2001, two computer scientists, Paul Viola and Michael Jones triggered a revolution in the field of computer face detection. Their breakthrough was an algorithm that could spot faces in an image in real time.

They focused on faces when viewed from the front, ignoring any seen from an angle. Given these bounds, they realised that the bridge of the nose usually formed a vertical line that was brighter than the eyes and they also noticed that the eyes were often in shadow and formed a darker area.

Now used by companies like Facebook and incorporated in cameras, the software uses these algorithms to scan an image to identify edges, regions with skin colour tones and regions high in saturation.

When deciding how to crop an image, the software generates a set of candidate crops, ranks them to focus on detail in the center of the image and returns the crop with the highest rank.

How to Implement This Technology

This advanced image processing technology is no longer exclusive. There are two main approaches that companies can use to successfully include automated and intelligent image processing.

For Marketing Teams

For brands wishing to quickly improve the image presentation, a new group of image delivery services has sprung up that can be integrated very easily to address these issues.

Offering intelligent image cropping, they examine the actual content of the image, determine the correct focus area and ensure that the image context is not lost, regardless of the size and shape of the image being shown

There are two providers that we recommend, having used both with great success.

Cloudinary offers a comprehensive, cloud-based image management solution and has been around since 2011.

Imgix is easier to implement than Cloudinary and works easily with your existing website. It provides real-time intelligent cropping and face detection and pricing is based on bandwidth.

For Mobile Applications and UGC

For teams building mobile applications, working with a high volume of user generated content or running their own technology stacks, an open-source version of this software can be installed as a Node.JS package.


Using these technologies, it is now possible to deliver excellent image presentation to all devices, with one single source image. The image is rendered in the ideal format and at the required size. All visitors see perfectly cropped images, regardless of device, reducing network traffic and improving site load times.

Please login or register to add a comment.

Contribute Now!

Loving our articles? Do you have an insightful post that you want to shout about? Well, you've come to the right place! We are always looking for fresh Doughnuts to be a part of our community.

Popular Articles

See all
4 Important Digital Marketing Channels You Should Know About

4 Important Digital Marketing Channels You Should Know About

It goes without saying that a company can't do without digital marketing in today's world.

Digital Doughnut Contributor
Digital Doughnut Contributor 5 November 2014
Read more
Google Analytics in Only Three Numbers

Google Analytics in Only Three Numbers

Financial advisors and other professionals can decipher a lot of information from Google Analytics with three simple categories.

Marina Howell
Marina Howell 17 October 2016
Read more
Get a Complete View of Your Customer Journey in 5 Easy Steps

Get a Complete View of Your Customer Journey in 5 Easy Steps

Here's how you can get a complete view of your customer journey so that your email campaigns continue to win new customers.

Sophia Skinbjerg
Sophia Skinbjerg 18 October 2016
Read more
How to Optimize Your Confirmation Email Design and Make It Bring You More Sales

How to Optimize Your Confirmation Email Design and Make It Bring You More Sales

Email marketing is not just about newsletters! Transactional and confirmation emails shouldn’t be neglected when it comes to design and content. An exceptional confirmation email can help you nail another purchase in minutes.

Roland Pokornyik
Roland Pokornyik 17 October 2016
Read more
Omnichannel Retail: Personalizing The Customer Journey Across Channels

Omnichannel Retail: Personalizing The Customer Journey Across Channels

The reality for retailers today is that to be successful, omnichannel strategies are no longer an option but a necessity to stay competitive. Consumers want to engage with brands on social media, in a physical store, on an ecommerce site, through a mobile app, via email or through a phone call.

Larisa Bedgood
Larisa Bedgood 18 October 2016
Read more