HomeProjectsNew Messanger

New messanger

Published Oct 12, 2024
2 minutes read
New messanger

Context

The current messenger feels more like a form you have to fill out at the post office before sending a message. The UI is not modern and relies heavily on input components.

The current message modal
The current message modal

Solution

The main goal was to modernize the interface and make it feel lighter and more compact overall. The variable function was to be improved, and the first AI features integrated. Additionally, it was important to significantly enhance the bulk messaging functionality.

Redesigned message modal with inline inputs for a more fluid feel
Redesigned message modal with inline inputs for a more fluid feel

Details

To enhance the user experience, users can now send messages directly without the need for a preview. The preview button will only appear if the message contains variables.

When adding a variable the cta changes to 'Review Email'
When adding a variable the cta changes to 'Review Email'
In preview mode the user can see the translated variables in action
In preview mode the user can see the translated variables in action

Bulk messaging is an essential part of a recruiter’s workflow. To address this need, we designed a dedicated interface specifically for bulk messaging. When creating a bulk message, users can view all selected candidates on the right-hand side and have the option to add additional candidates seamlessly.

The new 'Schedule Link' feature
The new bulk messaging interface

In preview mode, users can now effortlessly switch between candidates using the right-hand panel, with variables dynamically updating based on the selected candidate.

Preview mode for bulk messages let users switch between candidates
Preview mode for bulk messages let users switch between candidates

Another key enhancement in the new modal is the introduction of AI-powered features. These initial AI functionalities are designed to assist recruiters in crafting their messages more effectively.

Clicking the AI button reveals a dropdown menu with the available AI features
Clicking the AI button reveals a dropdown menu with the available AI features

When incorporating AI, transparency and user control were top priorities. To ensure recruiters have full oversight of AI-generated content, they must explicitly accept or reject each generated suggestion.

The AI-generated content needs to be explicitly accepted or rejected by the user
The AI-generated content needs to be explicitly accepted or rejected by the user

To maintain a clean and seamless interface, we implemented a floating toolbar for text formatting. It appears dynamically as soon as the user selects any text.

Floating toolbar for text formatting
Floating toolbar for text formatting

Through interviews, we discovered that recruiters often multitask and frequently need additional information while composing messages. To support this workflow, we introduced the option to pin the message modal to the bottom of the screen. This allows recruiters to navigate the app effortlessly without losing the context of their message.

Minimized message modal pinned to the bottom of the screen
Minimized message modal pinned to the bottom of the screen
Pinned message modal pinned to the bottom of the screen
Pinned message modal pinned to the bottom of the screen