Architectural Digest Magazine
New Features and New Visual Language for AD’s Digitized Magazine.
UX/UI Designer. Art Director / july 2019
In 2018, I worked with Architectural Digest Russia in the relaunching of their online platform. Our team transformed the magazine’s website into a customizable mood board for architectural images.
I worked alongside the AD editorial team to gather as much information as possible about their magazine’s readers, company values, and future plans. To feel the brand. To feel their audience. To generate a platform that would work as a fresh and relevant tool for users.
I developed a strong relationship with the digital department, and together we established the limitations and possibilities of the project.
I created a new visual language for AD magazine that spoke directly to their audience.
I supervised all final technical specifications and front-end work, ensuring it aligned with our original ideas and designs.
Challenges:
Acquire new readers.
Implement new advertising formats.
Seamlessly transfer images from print to digital.
New search format.
Increase user’s session times.
Starting points. Content:
Over 10,000 articles, sorted between 8 sections.
More than 15,000 unique photos.
Starting points. Reader’s survey.
Our research indicated that 13% of AD’s users were reading the text, while the other 65% were skimming through the article’s images to gather inspiration for their home remodelling projects.
This case is about how the request of Conde Nast selling department literally sounded like “let’s do anything to get more money” transformed to featured app with over 1 mln downloads.
My role was UX/UI Designer & product owner. I was responsible for the result. App interface, advertorial possibilities, generating new ideas for target audience and advertising partners, managing technical team and numbers. As much as possible. As always.
I was lucky to work with very professional technical team (lifetyping.com), Feeling grateful when remembering the process. Don’t thing the app became what it’s become without these guys. I was about ideas and design, they did integration and animation effects.
Although the main goal of the project was to attract advertisers I don’t like to see the case from this side. For me it sounded more like to do the best as possible to attract more people, advertising are the result of good product.
Target Audience
Fashionistas.
Need to get only what they like
Want to be first whenever possible.
Mobile addicted.
Travels a lot.
Angry when offline.
What TA expects from the app?
Wants to get information as fast as possible.
Simple search.
Big pictures.
What I like only.
Let’s imagine you’re someone looking for inspiration to redecorate the bathroom in your small apartment…
Step 1:
SEARCH QUERY: BATHROOMS FOR SMALL APARTMENT
Step 2:
54 ARTICLES APPEAR. ONLY 42% OF THEM ARE RELATED TO BATHROOM DECORATION.
14% OF THE ARTICLES ARE IRRELEVANT TO THE USER.
Step 3:
THE USER HAS OPENED 23 OF THE ARTICLES, AND HAS SPENT MORE THAN 5 MINUTES ON THIS SINGLE QUERY.
Average search attempts: 2.8.
19 of 201 pictures found.
This is equivalent to concealing approximately 90% of the site’s content.
This statistic acted as the framework for our proposed changes.
Our target audience needed an image-search-friendly website.
My research was driven by uncovering what criteria site visitors were using to search for their reference images.
Besides the basic criteria like colour, theme and location, we found that the most popular search queries included the size and style of the space. For example; “small apartments” or “loft style office spaces”.
In order for customers to easily access the exact images they are searching for, each photo was tagged according to the following categories: colors, theme, architectural style, interior/exterior, location, design style, type, size and related articles.
The process of tagging such a high volume of images was extremely laborious for the team that completed it. Without their hard work, my design would not have been possible.
THE STARTING POINT
Step 1. Photo Galleries
Photo galleries are the most common way of navigating images. If the user isn’t pleased with the first image they see, they are able to easily locate other images under the same keyword. Users are able to locate images based on subjects, but also to better understand subjects based on the images that appear under the query.
Image tagging is undoubtedly the key method of multiplying user traffic.
Step 2. Photography Section with Advanced Search
Next, images were organized by tag and colors. This also opened further advertising potential. For example, this advertisement for Bork Kitchens (See Below).
Step 3. One Place for Images and Articles
The final step? Merging image search and articles.
Issue
Only 1 of 6 users reads more than 1 article.
The amount of time users spend on websites is decreasing constantly. As a platform that wasn’t providing brief, instant information, AD was losing its audience’s interest. To combat this, we came up with several options for different cases and different people.
Sticky block of recommended articles on the right side (see below).
Block of recommended articles in the middle.
For people who are not so interested in the current article.
Block of recommended articles at the bottom of the article.
Next article seamlessly begins at the bottom of the current article. No clicks needed.
This final solution was simply a hypothesis, and we ran it untested. It was the most successful solution.
300X600 banner is sticky till the middle of an article
This feature was designed as another solution for users who are bored with the text they are reading.
300x600 is replaced with a recommendation block after 5 seconds of scrolling. The primary reason for this feature is to attract attention to banners while also targeting users who skim as opposed to read.
As the end of the article approaches, the recommendation block is replaced by the ‘Next Article’ feature.
Title and feed of upcoming articles load directly on the current page.
Depending on the page’s size, the full article is visible.
Issue
Image cropping and translating images from print to web.
Image cropping has been a recurring issue for magazines:
1) copyright problems.
2) the printed magazine often contains images intended only for one orientation.
One image replaced for two if necessary.
Editorial banners are masked like editorial articles.
Every picture maintains its original size to avoid cropping.
Learning
The Editorial Team knows their target audience inside and out. I found everything I needed to know about AD’s target audience without any further surveying or research.
Results
Organic traffic increased by more than 150%
Pages per session raised from 2.4 to 8.1
Average Session time rised from 3:52 sec to 8:12 sec
Bounce rate decreased from 58% to 49%
