Creation of an online
consultant widget

1 About the Project

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

One of  Callibri’s peculiar features is a consultant widget, a sort of a lead interceptor that makes sure no detail is left out and no leads are lost. 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 that could be used on all websites using the Callibri service. It was also meant to bring happiness to people who use it.


3 We studied the competitors

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

4 We started working on the characters

At first we considered creating characters, but then decided not to. Pretty much any website visitor can become a widget user, so we thought it was not a good idea to narrow the audience down to the classic «typical representatives». So we just detailed all possible widget interaction scenarios.

5 We defined a compromise between
being pushy and being useful.

The competitors’ online consultants all have different degrees of pushiness. Overly quiet ones let ‘hawt’ clients slip, and super nagging ones annoy potential customers and decrease visitor loyalty to the website. We managed to find the golden mean!

Режим «Стелс»
Навязчивость, уровень «Бог»

6 We sketched the mockups of the basic
states of the consultant.

7 We started experimenting
with the style

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

С чего начали
Чем закончили

8 We chose the appearance

Upon obtaining all approvals, the widget looked like this.


9 Feature List

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

  • Call from the Website via VoIP

    The website user can call the operator
    by clicking a button and talk directly through browser using built-in loudspeakers and a microphone.

  • It is made clear to the user which options are currently offered by the consultant.

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

  • Consultant Reach Timer

    We promise users that they will reach the operator within 30 seconds. This is very important for website visitors because we guarantee communication with a real person and we want to avoid the negative experience of endless waiting 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 has provided maximum assistance.

  • Different Widget Window Design Themes

    Different websites need different style.
    We made several variations
    and illustrated them with different examples.

10 Anyway, be sure to check it out

11 Animation

We stroke life into the static pictures and created animations that attract user attention and add responsiveness to the interface.


Conversion has increased!

The results exceeded the client’s expectations and made us happy. Just look at these figures!

August 31
September 15
September 29
The new widget
went online
October 15
October 29
Overall conversion
Chat conversion

Whatever people may say, objective numbers are the only genuine compliment for the designers!

Hello JetStyle,
I would like to discuss a project idea with you.
My name is
You can email me at
or reach me on
or let’s chat
By clicking the submit button you agree to our Privacy Statement
We’ll get back to you soon
Oops! Something went wrong while submitting the form.
Let’s talk