Connex One Brand

At the time of this Case Study, Connex One had 6 main Products but none of them had any kind of logos.

Athena Interact with your customers through speech analytics, sales AI, live chat and more.

Form Builder Easily create and customise dynamic online forms with a user-friendly design canvas, drag-and-drop controls, and advanced business logic.

Gamify Make the hard stuff in life fun. Making the agents more competitive and happy, happiness = productivity.

Omni The Connex One platform enables organisations to handle interactions across phone, SMS, email, web, social and live chat.

QM A tool that helps you harmonise customer satisfaction and contact centre efficiency.

WFO Monitor quality and performance to respond to the peaks and troughs in real-time to maximise team productivity. WFO & QM where sold as a packaged called WFM.

When I started on Connex One, the branding consisted of one logo and two main colours. My initial task was to create the core branding and a family of logos that would look like they belong to the Connex family.

Started by defining 6 different colours for each product. The idea was to differentiate them by just looking at their colour, which will help for low-resolution icons or even as favicons. After playing around with the colours ended up picking 5 distinct colours from the Material UI palette that would have similar shades, so they all would look uniform and individually won’t stand out too much from each other, and had a positive WCAG of AA contrast ratio.

After approval, moved to the shape and feel of the logos, tried not to use outlined icons as it could fade the logo at long distances, and because the product had decided to use Material UI in the development I decided to use the same concept so the icons would look similar to Mui icon library. To make sure each logo could be used in a variety of places, it needed to have a coloured, a black and a white version, for each variant (Squared Favicon) and Horizontal (Logotype).

Finally built the design library where the Products would use in their UI, this library was a clone of MUI base library plus Connex own components.

Before starting the shape, I defined a spacing grid that we could use on all the logos.

Overall we’re looked for a single typeface - something we can use within the UI, videos, website and social media. We experimented with a few different typefaces but collectivly decided that just one was right for the job.

What makes a perfect typeface for us?

Spacing Adequate letter spacing.

Kerning Even kerning between characters to help readability (not too condensed and not to expanded).

Legibility Distinguishable characters, for example, L, l, and 1 should all look different from each other, as should o, e, c, a.

Professionality A typeface that makes us stand above the competition.

Longevity A typeface that stands the test of time