Telequote

Simplifying TeleQuote's sales tools

Simplifying TeleQuote's sales tools

Roles : UX / UI design, Branding

Tools : Figma, Photoshop

Type of project : Professionnel project

To protect confidentiality, the brand identity and certain data have been anonymized.

To protect confidentiality, the brand identity and certain data have been anonymized.

Project overview

TeleQuote is an online platform that allows sales teams to generate real-time quotes for products and services. This project was completed for a telecommunications provider, whose identity has been anonymized for confidentiality reasons.

The platform required a redesign to modernize the interface and improve the user experience, particularly for tablet use. In my role as a graphic designer, I contributed to this project as an UI/UX advisor to the development team responsible for its implementation.

Ancienne platforme

Original platform

problem

Salespeople complained about the high number of clicks required to generate quotes, as well as the platform’s lack of optimization for the most commonly used device: tablets.

Original platform

goals

Optimize the platform for tablets

Optimize the platform for tablets

Reduce the number of clicks required to generate a quote

Reduce the number of clicks required to generate a quote

Modernize the interface and user experience

Modernize the interface and user experience

Modernize the interface and user experience

Suggest new features

Suggest new features

Wireframe

I started by thinking about the overall structure of the platform in order to define the organization of its different sections and features.

Once the basic structure was defined, the project quickly moved into high-fidelity mockup design to meet time constraints and the client’s requirements.

Rethinking customer information input

I started with the customer identification process. In the original platform, salespeople had to enter information in the top bar using dropdown menus and small text fields.

I proposed transforming this step into a guided interface, better optimized for tablets and touch interaction. Information is entered step by step, making the experience clearer, reducing errors, and improving navigation.

The top bar now serves as a summary of the information and includes two new buttons: one to edit the customer information and another to end the quote.

Optimizing the platform for tablets

Optimizing the platform for tablets

Several elements were moved and redesigned to optimize space and enable more intuitive navigation on tablets:

1

The quote summary

2

The main navigation

3

The additional options

1

The quote summary

Since this information is only occasionally consulted, the quote summary was placed in a collapsible panel to optimize space.

2

The main navigation

To optimize space usage on tablets, I proposed a horizontal navigation to free up more room for the main content. I also modernized the icons.

3

The additional options

The buttons from the quick options bar were integrated into the new collapsible menu to simplify the interface and optimize space.

Les boutons de la barre d’options rapides ont été intégrés au nouveau menu repliable pour simplifier l’interface et optimiser l’espace.

Reduce the number of clicks needed to generate a quote

Reduce the number of clicks needed to generate a quote

Réduire le nombre de clics pour générer un devis

One option proposed to the development team to reduce the number of clicks was to create a templates page. Sales representatives could have used it to configure product bundles or add a set of promotional products offered by the company.

They could then have filtered these options to quickly find a template tailored to the customer’s needs.

The development team did not adopt this idea.

Une option proposée à l’équipe de programmation pour réduire le nombre de clics consistait à créer une page de modèles (templates). Les vendeurs auraient pu y configurer des ensembles de produits ou ajouter un ensemble de produits promotionnels proposé par 

la compagnie. Ils auraient ensuite pu les filtrer afin de trouver rapidement un modèle adapté aux besoins du client.

Cette idée n’a pas été retenue par l’équipe de programmation.

Modernize the interface and user experience

The quote creation interface needed to be modernized and lacked a clear information hierarchy, which made the user experience confusing.

By breaking down the information-gathering process into several steps and adding a clear hierarchy, the experience becomes more intuitive and easier to navigate.

Suggesting new features

To enable salespeople to offer customers different options, I suggested adding a feature to the platform that allows users to switch between multiple quotes.

This feature makes it possible to quickly create a new quote, switch between quotes, and reset a quote when necessary.

To enable salespeople to offer customers different options, I suggested adding a feature to the platform that allows users to switch between multiple quotes.

This feature makes it possible to quickly create a new quote, switch between quotes, and reset a quote when necessary.


What I've Learned

Unfortunately, this project was never completed. It did, however, allow me to improve my ability to streamline an existing interface and organize information more effectively. I also developed my skills in designing interfaces tailored to their context (tablets), while taking into account technical constraints and team decisions.