Notifications appear on your site or mobile application to engage your visitors in conversation with your respondents. You can configure most of them with the iAdvize notification builder (more details here). This article introduces you to each available template and its usage, and provides you with tips to design notifications that will best engage your visitors.

Different types of notifications 

The "classic" notification

In a nutshell: 

• this notification is the simplest and most easily readable, and therefore the most accessible
• its compact and contrasting design are easy to identify on a site
• it provides more space for content to better describe the experience proposed to visitors and to underline the benefit it can bring them
• it also has the highest click-through rate!

Usage: 

• it is best used on the desktop version of a site
• very versatile, it belongs everywhere!
• it is however quite bulky on mobile 

The "messaging" notification

In a nutshell: 

• this notification adopts the codes of messaging applications (WhatsApp, Messenger, etc) with an avatar detached from the frame.
• its design is rather minimal, and its simpler and more direct message does not include a CTA (Call To Action button)

Usage: 

• it is more suitable for a desktop site
• as it is not as explicit as the "classic" notification about the proposed experience, we recommend it to a younger audience, more familiar with the messaging codes, who will be aware that this button starts a conversation
• being more refined, it is better suited to sites with a simple layout, on which it can contrast

The "badge" notification

In a nutshell: 

• this notification is a simple icon (you can choose between 6 different pictograms) on a colored circle, or a simple avatar
• it is therefore much more discreet than notifications including text. 
• for this reason, it is also less explicit

Usage: 

• this notification was designed with mobile screens in mind
• it can possibly work on a desktop site with a very clean layout
• without any message, it is better suited to an audience already familiar with messaging

The "mini-badge" notification (in beta)

In a nutshell: 

• this notification is a miniature version of the badge notification, designed to be as non-intrusive as possible in visitors' browsing experience, especially on cell phones
• to be noticed despite its very small size, the mini-badge is animated: it unfolds every 10 seconds to display an avatar and a short message, for a duration of 5 seconds, before folding back.

Usage: 

• this notification was designed with mobile screens in mind
• it can possibly work on a desktop site with a very clean layout, but remains very small!
• we advise you to make sure that it contrasts sufficiently with the layout of your site

The invitation

In a nutshell: 

• the invitation is not a notification in the strict sense of the word, since it is displayed above your site and momentarily interrupts your visitors' navigation
• it is therefore a very visible, but very intrusive engagement solution
• its display is limited to one time per visitor session

Usage :

• the invitations less and less relevant, because visitors don’t like to be bothered while browsing
• nevertheless you can use it to engage the most fragile visitors: abandonment of a quote, of the engagement funnel, etc.

The custom button

In a nutshell: 

• the custom button is not a real notification, but an actual button that you can integrate within the pages of your website. Find our complete recommendations in the dedicated article.
• so you can give it the look you want, by coding it yourself, without using the iAdvize notification builder. 

Usage: 

• the custom button is perfect if you want to offer conversations to your visitors discreetly, in addition to the information available on your pages: as it is part of the page, it does not interfere with navigation
• on the other hand, for the same reason, it is less noticed by visitors and its click rate can be very low. We recommend combining its use with a real notification to engage visitors in two different ways.
• it is also very well suited to mobile for a perfect adaptation to the layout and navigation on a small screen

Our design tips

Anatomy of a notification

1. header

2. text content

3. avatars

4. status display

5. CTA button

Design

• we advise you to use a font and a color chart similar to those of your website: your visitors must be able to understand that you offer them a service and not an advertisement for another brand
• however, make sure they remain visible within the page and stand out enough to be seen by visitors who need help

Avatar

• iAdvize offers a default choice of avatars from stock photos that are quite versatile and qualitative, but visitors may have already seen them on other sites and might doubt their authenticity
• the best thing is to use a photo from your brand universe (for example, a salesperson or an agent wearing your store's outfit) which will characterize your agents and reassure your visitors
• it's even better if you can choose an avatar adapted to the product category your visitors are looking at (for example, a handywoman in the DIY department or a gardener in the garden department). 
• you can also use several avatars to suggest that several different people are likely to respond to your visitors
• conversely, if you use a bot, avoid giving it a human avatar so that your visitors are not disappointed when they discover its true nature

Messages

• the header of your notification is your "hook": you can use a dynamic and friendly sentence to attract the attention of your visitors (e.g.: "need help?" "hello, can we help you?")
• in the content, you have a little more space to specify the proposed experience (e.g.: "we help you finalize your order", "talk to an expert in the surfing department", "our salespeople advise you on video from the store"), or even to underline the benefit (e.g.: "our agents advise you live", "experts in our surfing department are here for you")
• the Call To Action (CTA) button should include an action verb, either very brief (e.g. "chat"), or as explicit as possible if you offer an unusual experience (e.g. "chat in video")
• visitors like to know what to expect! So we recommend you be as transparent as possible about the experience you offer them: are the respondents live, which is very appreciated, or is there a waiting time (e.g.: "our agents will answer you in a few minutes")? Is it an agent who will answer them directly, or a bot that can hand off to a human? Will your visitors have to show their face, or can they cut their camera? 
• you can also take advantage of the notification builder to contextualize your messages according to your campaigns and your visitors' needs. For example, a "what are you looking for?" on a category page, and rather a "need help?" on pages of the purchase funnel where your customers may encounter technical difficulties. 

Special case: on mobile

When visitors use the mobile version of your site, they are often in a hurry, and always on a smaller screen.

• your notifications must therefore be present for those who would appreciate help, but be as unobtrusive as possible in the navigation of your visitors.
• for this, we recommend the badge, whose small size is well suited to mobile navigation
• the mini-badge, which is the smallest notification, is also adapted to mobile. Floating and animated, it will still be visible to your visitors, and will benefit from a higher click rate.
• we also recommend the custom button: as it is directly integrated in the pages of your site, it is very discreet (which means it has a low click rate) but offers a smooth experience to your visitors.