HCL Software

HCL Software

HCL Software

HCL Verse
Contacts

HCL Verse
Contacts

HCL Verse
Contacts

Date

Date

Date

2021-2022

Skills

Skills

Skills

-Market Research

-Competitor Analysis

-Usability Tests

-User Workflow

-Prototyping using Figma

-Project management

Role

Role

Role

-Product Designer

-UX UI Designer

-Design Researcher

What is HCL Verse?

What is HCL Verse?

What is HCL Verse?

HCL Verse is a modern web and mobile PWA email and calendar client that is designed to improve productivity and streamline communication within organizations. It offers an intuitive user interface and integrates with other HCL products to provide a unified user experience.

Project Overview

Project Overview

Project Overview

HCL Verse Contacts streamlines the contact management within the HCL Notes and iNotes which shares the file server with Verse. It allows users to manage their contacts and group contacts inside of HCL Verse.


Before the introduction of HCL Verse Contacts, customers were required to switch to HCL Notes and iNotes whenever they needed to store contact information or manage contacts. This switch disrupted workflow and created unnecessary friction in their user experience.


Our goal was to create a Contacts app within the HCL Verse environment that ensures a smooth transition by preserving all functionalities from HCL Verse mail and calendar.

Project Outcomes

Project Outcomes

Project Outcomes

Landing Page


Landing page has 'New Contact' button and a search bar that the user can type name or email address to quickly find a contact. There is 'sort by' drop down to easily sort the contacts.

New Contact Form


Once the user clicks 'New Contact' button, A form with input fields is opened as a modal on top of the landing page. Modal allows the user to easily and quickly get in and out of the form and get back to the work they were doing.

View Contact and its Integration with Mail


The user can view the detail information about a person or group and send message or schedule in one click. (Calendar integration is in progress).

Research
User testing
Iterations
Accessbility

Background

Above is screenshots of HCL Notes and iNotes Contacts UI. They appeared outdated and were not user-friendly. They had too many unnecessary input fields and outdated features inherited from the 1980s Lotus Notes which significantly affected the usability of the Contacts app and made the interface cluttered.


My mission was to improve the usability and interface design of HCL Verse Contacts while preserving its functionality and data integrity from Notes and iNotes.

Competitor analysis

As the next step, I conducted market research of other mail and calendar software that also has integrated Contacts app. I studied user experience, workflow and feature integration of Microsoft Outlook and Google Workspace. Below are the screenshots that I collected as the reference.

Microsoft Outlook

Strenghts

-Outlook Contacts seamlessly integrates with the Microsoft Outlook Mail and Calendar.

-Advanced features like Contact List and Group Contacts.

-Compatibility with MS 360 platform;

Groups can be shared for other MS apps such as Teams and Planner for project/ task planning.

Weaknesses

-The interface of Outlook maybe overwhelming for some users, especially those who doesn't use much of advanced features.

-The keyboard navigation steps were not intuitive when the user is moving from the action bar to list of saved contacts.

Google Workspace

Strenghts

-Simplicity and ease of use; Google Contacts has a clean and intuitive interface.

-Seamless integration with Mobile devices providing cohesive user experience and convenient user workflow to access the contacts in mobile devices.

Weaknesses

Weaknesses

-While Google Contacts offers essential contact management features, it may lack some of the more advanced features.

Research
User testing
Iterations
Accessbility

Background

Above is screenshots of HCL Notes and iNotes Contacts UI. They appeared outdated and were not user-friendly. They had too many unnecessary input fields and outdated features inherited from the 1980s Lotus Notes which significantly affected the usability of the Contacts app and made the interface cluttered.


My mission was to improve the usability and interface design of HCL Verse Contacts while preserving its functionality and data integrity from Notes and iNotes.

Competitor analysis

As the next step, I conducted market research of other mail and calendar software that also has integrated Contacts app. I studied user experience, workflow and feature integration of Microsoft Outlook and Google Workspace. Below are the screenshots that I collected as the reference.

Microsoft Outlook

Strenghts

-Outlook Contacts seamlessly integrates with the Microsoft Outlook Mail and Calendar.

-Advanced features like Contact List and Group Contacts.

-Compatibility with MS 360 platform;

Groups can be shared for other MS apps such as Teams and Planner for project/ task planning.

Weaknesses

-The interface of Outlook maybe overwhelming for some users, especially those who doesn't use much of advanced features.

-The keyboard navigation steps were not intuitive when the user is moving from the action bar to list of saved contacts.

Google Workspace

Strenghts

-Simplicity and ease of use; Google Contacts has a clean and intuitive interface.

-Seamless integration with Mobile devices providing cohesive user experience and convenient user workflow to access the contacts in mobile devices.

Weaknesses

Weaknesses

-While Google Contacts offers essential contact management features, it may lack some of the more advanced features.

Research
User testing
Iterations
Accessbility

Background

Above is screenshots of HCL Notes and iNotes Contacts UI. They appeared outdated and were not user-friendly. They had too many unnecessary input fields and outdated features inherited from the 1980s Lotus Notes which significantly affected the usability of the Contacts app and made the interface cluttered.


My mission was to improve the usability and interface design of HCL Verse Contacts while preserving its functionality and data integrity from Notes and iNotes.

Competitor analysis

As the next step, I conducted market research of other mail and calendar software that also has integrated Contacts app. I studied user experience, workflow and feature integration of Microsoft Outlook and Google Workspace. Below are the screenshots that I collected as the reference.

Microsoft Outlook

Strenghts

-Outlook Contacts seamlessly integrates with the Microsoft Outlook Mail and Calendar.

-Advanced features like Contact List and Group Contacts.

-Compatibility with MS 360 platform;

Groups can be shared for other MS apps such as Teams and Planner for project/ task planning.

Weaknesses

-The interface of Outlook maybe overwhelming for some users, especially those who doesn't use much of advanced features.

-The keyboard navigation steps were not intuitive when the user is moving from the action bar to list of saved contacts.

Google Workspace

Strenghts

-Simplicity and ease of use; Google Contacts has a clean and intuitive interface.

-Seamless integration with Mobile devices providing cohesive user experience and convenient user workflow to access the contacts in mobile devices.

Weaknesses

Weaknesses

-While Google Contacts offers essential contact management features, it may lack some of the more advanced features.

Research
User testing
Iterations
Accessbility

Background

Above is screenshots of HCL Notes and iNotes Contacts UI. They appeared outdated and were not user-friendly. They had too many unnecessary input fields and outdated features inherited from the 1980s Lotus Notes which significantly affected the usability of the Contacts app and made the interface cluttered.


My mission was to improve the usability and interface design of HCL Verse Contacts while preserving its functionality and data integrity from Notes and iNotes.

Competitor analysis

As the next step, I conducted market research of other mail and calendar software that also has integrated Contacts app. I studied user experience, workflow and feature integration of Microsoft Outlook and Google Workspace. Below are the screenshots that I collected as the reference.

Microsoft Outlook

Strenghts

-Outlook Contacts seamlessly integrates with the Microsoft Outlook Mail and Calendar.

-Advanced features like Contact List and Group Contacts.

-Compatibility with MS 360 platform;

Groups can be shared for other MS apps such as Teams and Planner for project/ task planning.

Weaknesses

-The interface of Outlook maybe overwhelming for some users, especially those who doesn't use much of advanced features.

-The keyboard navigation steps were not intuitive when the user is moving from the action bar to list of saved contacts.

Google Workspace

Strenghts

-Simplicity and ease of use; Google Contacts has a clean and intuitive interface.

-Seamless integration with Mobile devices providing cohesive user experience and convenient user workflow to access the contacts in mobile devices.

Weaknesses

Weaknesses

-While Google Contacts offers essential contact management features, it may lack some of the more advanced features.

Video of current implementation

Learnings

Communication

I enhanced cross-functional communication skills through collaboration with Product Management and Development teams to set priorities effectively to ensure the best outcomes in promised release schedule.

Technical Insights

I learned valuable technical insights throughout this project including use of grid and stack, expanding my understanding of web development and able to deliver the design spec with more clarity for developers.

Web Accessibility

I Gained a deeper understanding of web accessibility principles and best practices, ensuring inclusivity in design.

Design System

I recognized the power of utilizing a design system, particularly through contributions to building a design system for HCL Digital Products. Successfully implemented the components into the user interface for the Contacts app, demonstrating its effectiveness in maintaining consistency and efficiency in design and development processes.