Picture This

Lake Solutions’ Managing Director, Ian Jepp, recently gave a talk on the topical issue of AI and images at the London Sitecore User Group, which was held at the head office of the online fashion retailer ASOS. The event included a chance to hear directly from Sitecore and its partners about projects they’ve been working on and network with the community. 

As the march of headless CMS systems and separation of content and presentation continues, Ian looked at how the world of AI can lend a hand to content creators and developers alike. 

AI has a growing role when it comes to the images we have on our websites – not only is it a useful tool for keeping track of website assets but it also has a vital role to play in security, particularly in areas such as forums.

Today, website content can be viewed on multiple platforms and channels – from tablets to mobiles, from websites to apps and social media – and your images will display differently on them all. We’ve all visited websites where photographs look great on a PC – but open it on a mobile and the focus of the image has disappeared off the edge of the screen… 

Images are a key part of content creation – not only for websites but, increasingly, for social media. Most organisations nowadays won’t post on their social media channels unless there’s an image to accompany the words and Instagram, of course, is built around pictures.

When it comes to websites, images are important and often the first thing a visitor will notice before reading any words. Images today need to be impactful and responsive and, for that reason, Lake Solutions has brought Sitecore and AI together to improve the visitor and CMS editor’s experience.

The images which are used on a website are so varied and can be of absolutely anything – any subject matter and any composition. However, while it’s a chance to be creative, there are some common rules to consider across all images. 

The Rule of 3rds is probably the most commonly encountered to consider and Ian was able to demonstrate this to the Sitecore User Group with examples. Basically, we read a page from left to right and this affects how we view and even feel about images. The background of images, symmetry and patterns are also important to think about.

The key thing is to always remember that people won’t always be viewing images on the same device – they could be looking at the page on a range of devices from a laptop or PC to a tablet or a phone. Images will view differently on these devices.

Ian explained that organisations which have chosen a Sitecore website will be investing heavily in content creation and will be putting a lot of effort into creating or sourcing the right image. Much CMS curation time will be spent on images – cropping, uploading and linking them. 

While eye-catching images are important, they also need to be sized properly, so site visitors have a fast and impactful experience and not be waiting for pages to load. Ian showed attendees figures for page load time against probability of bounce. He also noted that Google now rates page speed and notices if oversized images are utilised.

Ian then considered how CMS editors approach the editing of images. He explained that the traditional approach was to have imagery grouped by its aspect radio or size; or perhaps grouped by its intended use – banner images or footer logos etc. 

This does mean, though, that images as they appear in the Sitecore content tree are not really reusable, as CMS editors must crop an image for each use. 

Ian explained that there are a number of solutions in the marketplace – but the cropping they offer may not work properly if images are used over different devices. This is when AI steps forward as a solution. 

AI can work out where the focal point of an image is – even if it’s off centre and crop photos to work best in the different platforms. The photo thus looks great in any format – saving time in content creation, while also creating a better user experience. 
Ian discussed how AI through Microsoft Cognitive Services can be employed to create intelligently cropped images which are impactful to the consumer, responsive and easy to maintain.

Microsoft Cognitive Services is useful, as it will crop images depending on their intended destination. For example, a home page slider image might be letterbox shaped on a desktop and square on a mobile. So, the source image needs to be cropped.

If you’d like to find out more about how AI can help when utilising images with Sitecore, then contact us today. 

Article Details

Ian Jepp
20 February 2019