Case Studies

In London Magazine Case Study

'Page Builder' is used for custom layouts to beautifully present rich media magazine content for optimal user experience across devices

IN London magazine has a 25 year heritage and is now accredited by London & Partners, the Mayor's official promotional organisation for the city.

The quarterly magazine is published by Morris Visitor Publications (MVP), the world’s largest provider of visitor information and the preferred partner of London’s hotels and concierge for more than 40 years.

A full service web design and build project, powered by Blaze Content Management System, provides a flexible platform for simple management of web publishing by non-technical editors. Long copy 'story' articles with rich media are produced within custom layouts to beautifully present magazine content for optimal user experience across desktop and mobile devices.

The Brief

  • Replatform website, address limitations of existing system (SquareSpace)
  • Produce a 'spectacular' design
  • Achieve design flexibility to publish rich media 'story' features
  • Replicate the super high quality print publication to convey experiential luxury, craftmanship, and tailoring
  • Provide structure for the digital offering
  • Facilitate future developments for multi-lingual regionally targeted content publishing
  • Provide a platform for centrally managing content publishing to website and App
  • Support monetisation strategy for digital publishing via sponsored content, advertising and retargeting

The Byte9 Solution

'Page Builder'
The Blaze CMS framework implementation for the project included the roll out of 'Page Builder' a powerful toolset that allows non-technical website editors to manage custom layouts for rich media article content pages. The page builder admin allows users to add and edit multiple rows and select each element to include within the appropriate columns and widths for text, images, video, advert banners, galleries, carousel etc... whilst working within fixed template constraints to preserve the quality and consistency of the website design. Drag-and-drop to simply re-order and update elements within the custom layout ensures simple editorial management.

Infinite Scroll
The website listings and content pages have been implemented with 'Infinite Scroll' so users can seamlessly browse from one story to the next therefore significantly increasing engagement, immediately evident through higher average time on site and page views per session. Sticky elements for the site header, navigation, and social share buttons maintain the visibility of key elements wherever the user scrolls to on the page.

User Centred and Responsive Design
The mobile first user-centred approach to design followed the client brief to ensure the IN London Magazine brand conveyed the quality luxury look and feel expected from the target audience of high net worth discerning visitors to London. The editorial flexibility demanded of the brief was balanced with enforced styles, templates, and page components to ensure design consistency. Multiple variations for the top section layout are provided for editors to alternate between landscape or portrait hero images with different text alignment, overlay, and background colour to fit the nature of the content and align with how the same story is published within the magazine.

Performance Optimisation
We have considered a number of best practice web techniques in order to reduce the time it takes to load the page, we were careful to reduce the number of requests each page holds with the use of sprites & minification. By generating different sizes of each of the images for the device they are being displayed on we managed to drastically lower the download size of all of the image traffic. The original pages use less database resources because of our use of smart caching to not have to do database calls on each page load.

Project Roadmap
Further developments to support the digital strategy for IN London Magazine are planned for multi-lingual regional targeting and App features. Watch this space for further exciting progressive developments to follow.

Easily the most productive relationship with any developer. They have one of the cleanest development processes anywhere…

Katleen Richardson, Marketing Director, Kogan Page