Creation of an online
consultant widget

1 About the Project

«Callibri» is a call tracking system that makes website owner’s’ life much easier. It helps to track calls from the website, questions in the chat, callback orders, and to integrate with analytical systems.

One of Callibri’s features is a consultant widget, kind of a lead interceptor not to miss anything or anybody. It helps users communicate with an operator, make calls (directly from the browser) and leave their requests.

2 Task

We embarked on an interesting mission of engineering and designing a consultant widget so that it could be used on all websites using Callibri service. It was also meant to make people communicating with it happy.


3 We studied the competitors

As always, we started work from looking around. There is a gazillion of call tracking services and online consultants. We studied them, analyzed their imperfections and invented some improvements.

4 We started work on characters

At first we were thinking of creating characters, but then decided not to do it. Any website visitor can become a widget user, so we thought it was not a good idea to narrow the audience down to classical “typical representatives”. So we just thought through all widget-interworking scenarios.

5 We defined a compromise
between being pushy and useful

The competitors’ online consultants all have different degrees of pushiness. Overly quiet ones let ready up clients slip, and super nagging ones annoy potential customers and decrease the visitors’ loyalty to the site. We managed to find the happy medium!

Too Invisible
Too Much

6 We sketched basic
states mock-ups

7 We started experimenting
with the style

We started with colorful cheery solutions, but ended up with a universal and neutral monochromatic design.


8 We chose the appearance

After all coordination and approvals the widget began to look like this.


9 Feature List

Together with the client we came up with and realized several features for the widget:

  • Call from the Website via VoIP

    A website user can call the operator pushing a button and talk to them in a browser using in-built loudspeaker and microphone.

  • A user can see all available online consultant options
    right away

    For example, if it is currently impossible to call the consultant because they are busy, the option will be inactive.

  • Consultant Reach Timer

    We promise users that they will reach the operator within 30 seconds. It is very important for the website visitors, because we guarantee communication with a real person and want to avoid the negative experience of endless wait for a reply.

  • Interactive Scenarios
    When Working with Users

    In case it was impossible to reach the operator the widget won’t let the client go until it provides as much help to the visitor as possible.

  • Difference Widget Window
    Appearance Themes

    Different appearance for different websites. We made several variations and illustrated them with different examples.

10 Anyway, check it out

11 And Animation

We invigorated static pictures and drew animation that attracts users’ attention and adds warmth to the interface.


Conversion has increased!

The work result exceeded the client’s expectations and made us happy. Just look at those figures!

August 31
September 15
September 29
The new widget
October 15
October 29
General conversion
Chat version

Whatever people may say, it’s objective numbers that are the only genuine compliment for the designers!

Client’s review

Just a few words!

If you have а similar task,
please contact us

Let’s work together!

Ура! Заявка

Мы свяжемся с вами в ближайшее время!

А пока посмотрите
наши свежие работы
и почитайте блог.