Case Study Vogel's - How We Used MadCap Flare to Create All Online Manuals for Vogel’s Products New Product Range and Increased Customer Satisfaction

www.vogels.com    manuals.vogels.com     Eindhoven, the Netherlands    Consumer products

Being the world’s leading manufacturer of TV mounts, Vogel’s Products turned to INSTRKTIV for optimizing their customers’ experience. As a result of our collaboration, we created all online manuals for their products,  including the hard-copy Quick Start Guides, using a powerful content management application called MadCap Flare. Let’s look closer at the process of producing an easy-to-navigate online help in eighteen languages.

Goals
Easier product installation, efficient information management, reduced paper usage, improved sustainability, compliance with legal requirements.

Solution
Medium: a detailed online manual supplemented with video instructions and augmented reality and a Quick Start Guide(QSG) printed on the packaging.
Tools: MadCap Flare for authoring, content management and publishing & MadCap Lingo for translation management.

Benefits
User-oriented and easy-to-navigate online instructions, quick and efficient production of manuals as well as significant cost reduction.

Problems Requiring Effective Solutions

Since Vogel’s has transformed the way they produce their TV wall mounts, the company has faced the need to remodel their existing user instructions. Printed manuals were no longer a viable option for consumer products. Not only were the costs for their creation too high, but customer experience was not satisfactory either. Vogel’s goal was to improve the installation experience for their clients, whilst reduce printing costs, increase sustainability and comply with legislation. Let us explain the importance of each point. 

As Vogel’s markets expands, so does the number of their manuals and marketing materials.The company translates their guides into more and more languages, providing buyers from different countries with instructions. Naturally, offering all languages in one booklet is not as user-friendly as providing them only in the customer's native language. 

On top of that, as markets expand, the wall types on which the products are installed also expand. It becomes difficult to include all the instructions into one booklet. What’s more, it requires more printing, which is both expensive and detrimental for the environment. To avoid excessive paper recycling, cut expenses and provide users only the content that matches their native language and actual purchase, a brand new approach must be applied. 

Looking for a New Approach 

The product development project was led by product manager Froukje. 

According to Froukje, it was extremely frustrating to notice an error in a printed user manual knowing that it was almost impossible to change anything. She needed to wait about 4-6 months to make corrections in all paper product manuals. In the meantime, customers had to deal with a problem themselves if there were any false guidelines. Often, the hard work done prior to product release was devalued because of minor mistakes. At some points it felt quite discouraging, so Froukje was looking for new solutions.  

Next to that there was no direct contact allowing buyers to give feedback. But with online manuals, customers have an opportunity to communicate with a company. Since they go back to the official website just after buying a product, managers don’t lose sight of their clients. They can analyze customer satisfaction and provide support when required. Any errors in existing instructions can be easily fixed, so every user has access to updated product information. All this was impossible with printed booklets, which disappointed both managers and clients. 

The Brand New Approach of INSTRKTIV 

Before suggesting a new solution, we created a list of requirements that should be the starting point of a new experience. They were based on the following questions: What does the company need? Who are Vogel’s customers? How are they served best? 

Just after that, INSTRKTIV moved to the brainstorm stage and started working on concept development. Concept approval was followed by choosing the best technical direction of the work. As a result, we proposed online manuals consisting of separate content blocks that allow for content reuse. We also moved all the content from Adobe Indesign to MadCap Flare, which is much more efficient. 

Taking into account legal regulations, it was decided to provide user and safety instructions, not only on the web but also partly in/on the packaging. The transition to an online environment and only one database from which all manuals are being managed and published helped Vogel’s generate content and make translations in a smart way, while saving money at the same time. 

The Moment a Problem Was Solved

Even though the new set up has been made just recently, Froukje says that the company has already started to experience its benefits. For example, adding new languages to the online help  was super easy. What’s more, the layout costs have been completely eliminated.

It’s expected that the new approach will allow for reusing content and creating new instructions in different languages more efficiently. Besides, customers are likely to have fewer questions as information provided on the website is clearer, up to date and better accessible now. On top of that, the integration of analytics and heatmaps will help Vogel’s obtain useful statistical information. 

Vogel’s has received multiple positive reactions from their distributor network since everyone understands that this is a big but logical step forward. The company is anticipating customer feedback, hoping for more positive reviews on their website.

“Using INSTRKTIV and their CMS (MadCap Flare), we’ve been able to provide our customers with an easy-to-navigate online manual that helps them quickly find answers to all their questions, for all our products and in all languages . We increased usability, the ease to update and the environmental impact of our manuals tremendously”

FROUKJE KIENHUIS

Product Group Manager Vogel’s Products

In the next section, we are going to describe the INSTRKTIV solution created for Vogel’s in more detail. 

Full Online Guide and a Quick Start Guide Printed on the Packaging

According to existing legislation, we created a QSG to be included in the packaging as well as a comprehensive online user’s guide that can be accessed by following this link  https://manuals.vogels.com/. 

Quick Start Guide printed on packaging

The full manual contains much more detailed information and also includes video instructions, an app with Augmented Reality (AR) feature and the possibility to download a PDF version.

App with AR, video and PDF instructions

Easy Navigation through a Product Selector Page

To access user instructions from the Vogel’s website instead of using a QR code, you need to go through product selection pages. 

Pages like the one given above were built with the Pulse Pure HTML code. 

The landing page was customized using a ‘navigation pills’ design that looks like tabs on the interface. Some bootstrap CSS and Javascript as well as flex design techniques were also added to ensure smooth website  work on both desktop and mobile devices. 

User Manual Accessible in Several Languages

While Vogel’s grows and its market expands, the company needs to meet legal requirements, obliging it to provide instructions in the language of the country where the products are sold.

To comply with legislation, instructions are available in multiple languages. Since MadCap Flare limits the design of the language button, it was decided not to use this option. Instead, there is a dropdown menu with paragraph tags for every country/language. For better convenience, flag icons were added for each option. 

 

 

More languages have been added over the last few months

App available with Augmented Reality as an Additional Feature

Additional to the online instructions, Vogel's offers an app which contains a handy AR feature to help customers determine the location of the first holes to drill https://www.vogels.com/en-us/c/tvmountguide.

The so-called DrillRight™ AR app with augmented reality feature is accessible via each product page (left button).  

The steps within the app

Using Instruction Videos 

Vogel’s online manuals include a link to video instructions: 

https://www.youtube.com/watch?v=rEeK16D9Z0I. 

The video instructions are accessible via each product page (middle button).

Clear step-by-step video instructions provide buyers with visual explanations on how to set up Vogel’s products. 

An example of a video instruction

Access to a Downloadable PDF

Users that prefer having a hard copy of the manual can download it as a PDF file (right button).

Over 140 PDFs in different languages were designed using the MadCap Flare batch target functionality. 

Designed for Mobile First

The online instructions are designed for mobile use first, so buyers can have the best experience on their smartphones and other devices. It was a real challenge to meet Vogel’s requirements, as they required two sets of images, one of which was created specifically for mobile. Apart from that, some pages also needed a different design that was made using condition tags called “ScreenOnly” and “MobileOnly”. 

 

  

 

Using MadCap Flare’s dropdown feature

Three different types of dropdowns were created for the Vogel’s website:

1. Table of contents dropdown
2. Languages dropdown
3. Dropdown presenting content with different solutions, so users can select the one that applies to their issue. 

 

 

Illustrations 

Clear illustrations enhance the textual instructions. To ensure the highest quality of images, the SVG format was used in the online manuals. As it turned out that this format doesn’t work for PDF files, JPEG versions of all images were included there. To control the images, a condition tag “PrintOnly” was applied. 

 

Implementing Google Analytics to ​​Get User Data

Google Analytics is a powerful tool allowing site owners to view website statistics and user activity. After embedding a special tracking code into Vogel's web pages, it became possible to analyze the website's performance and collect visitor insights. Now the company can determine top sources of traffic, discover engagement patterns and trends as well as obtain other important information such as visitor demographics. Google Analytics integrated into the Flare WebHelp target can be used to make product and instruction improvements. 

Supporting Read to Do, Study and Locate Approaches

Customers process manuals in different ways. Most of them read to know how to use the product, so the installation instructions have been placed at the beginning of the user guide. This particular approach is called action-oriented and comes from the Principles of Minimalism. 

But some buyers also read manuals to study or locate information. That’s why the Vogel’s instructions support all of those reading strategies, providing links to other resources that contain additional information.