Saiyyam Kochar
UX Designer and Developer

MSEG-UKG Inbox Service

a tailored and customizable unified communication platform for UKG employees.

Image alt tag

Find out more about MSEG-UKG Inbox Service

Click on the button below to visit the Github repository for the project.

My Role

UI/UX Designer, Front-end Developer (React) for all aspects of the project.

Tools used : Figma

Technologies used : MERN Stack (MongoDB, Express.js, React.js, Node.js), Jest

Team

Jeff Boutotte : Project sponsor

Professor Gordon Anderson (CompSci 320) : Project liaison

Victor Santana : Project manager

Aryan Dang : Back-end developer

Kevin Chiu : Back-end developer

Shreyans Babel : Back-end developer

Steven Pham : Back-end developer

Amin Pourgol : Back-end developer

Greg Garber : UI/UX Designer, Front-end Developer

Dane Santos : UI/UX Designer, Front-end Developer

Ali Rabea : UI/UX Designer, Front-end Developer

Saiyyam Kochar : UI/UX Designer, Front-end Developer

Benjamin Riseman : Front-end Developer

Platform

Desktop

Timeline

January 2022 - May 2022

4 Months

Overview
MSEG-UKG Inbox Service

What is MSEG-UKG Inbox Service?

MSEG (Manning Software Engineering Group) - UKG (Ultimate Kronos Group) Inbox Service is a tailored and customizable unified inbox service for integration within the human capital management (HCM) suite of UKG. This project was undertaken under the supervision of Professor Gordon Anderson in my Software Engineering class.

The Problem

"Unlock the power of the workforce"

- UKG

MSEG-UKG Inbox Service

UKG's Ideology

Inspiration

UKG is a multinational technology company that provides workforce management and human resource management services. While its software suites are industry acknowledged, they are looking for ways to break their offered solutions into more microservice-based solutions that are easily scalable to make way for future extensions and technologies. UKG assigned us a charter to create a unified inbox service as an addition to their workforce management suite.

Within this inbox service, UKG would like us to provide functionalities like PTO approval, performance review requests, and required training. They also wanted us to provide a way for employees to track their HR requests or tasks, thus making a platform that is a one-stop platform for all employees and administrators to manage the human capital management needs of the organization.

Our Solution
MSEG-UKG Inbox Service

Try scrolling down!

What does our software do?

MSEG comprised of 11 people, with 5 people on front-end development. We designed an interface through which employees can view unified, personal inboxes and mark items as completed for a variety of human resource solutions like vacation time approval, administrator-assigned training, and performance reviews.

We implemented a list of tasks with due dates in varying states so that the inbox could serve not only for purposeful communication but also for better time management. We also tried to provide as many avenues of possible future integration as we could.

As a UX developer in the front-end team, I used Figma, and React.js to develop an adaptive and seamless user interface for the use cases outlined in the project requirements. My focus was to keep the interface clean and efficient, but with a modern look and feel to it.

Additional features to be implemented

  • Users must change the initial login ID and password after first successful login for security purposes.

  • Employees should not be able to add/remove tasks from the to-do list before manager’s approval. 

  • The web application should be able to handle at least 50 users at a time without crashing.

  • Privacy of users’ information and export of restricted technologies should be taken care of.

  • Web application should be adapted to work on different browsers.

MSEG-UKG Inbox Service

Tools and technologies used

  • Open source, low cost, Model view (MVC) for seamless web development.

  •  MongoDB : Better for web-apps and handling large amounts of data, easier to incorporate into.

  • Express and Node : Express and Node work well together, lightweight and easy to create robust and seamless web apps with.

  • React : Because of its data binding feature, components (saves time), ability to work on virtual DOM - helps front end developers.

Development Process
MSEG-UKG Inbox Service

Brainstorming as a part of Team MSEG

Brainstorm

Our team began by outlining the required features of our project. We then branched out to think of the dependencies of each requirement - for example, the quintessential 'Sign Up' or 'Forgot Password' options on the Login Page. We continued to think through features that a corporation might need in its HCM solution. We then went through several software development stacks and tools, deciding what suite would fit the needs of the project timeline best. We also evaluated several 3rd-party APIs to understand which one would allow for the most avenues of future integration.

MSEG-UKG Inbox Service

User flow sketch for MSEG-UKG Inbox Service

Over the course of 12 weeks, our team's priority was to come up with most efficient and effective solution which met all the requirements of the charter.

Low fidelity prototypes

Below are present some of our initial deliberations about the project's functionalities, requirements, and design. This stage took the team about 7 days, at the end of which the team had technical know-how and roadmap about starting off with the development.

Edge scenarios

a compilation of questions our team asked the project manager and professor Gordon before we came up with the high-fidelity prototype

MSEG-UKG Inbox Service
MSEG-UKG Inbox Service

Color palette chosen for our project

Color Palette

  • We modeled our color palette after UKG’s existing palette, with modifications to provide users an impression of completeness, success and progession.

  • In engineering psychology, green is calming, motivating and optimistic - all qualities that we wanted our interface to provide.

  • We also chose a cooler shade of green to keep the interface professional and easy on the eyes.

High-fidelity prototypes

Compilation of some significant screens of MSEG-UKG Inbox Service

Conclusion
MSEG-UKG Inbox Service

A group photograph 😁

Final Presentation 🎉

We presented this project to multiple UKG sponsors, our class professor, and other teams. Below is present the link to our final presentation which includes our final product, milestones along various stages of development, and a demo of the application. Personally, I was fully responsible for presenting the developed non-functional requirements of the application.

MSEG-UKG Inbox Service

Additionally, as it was my first time working in a scrum environment, I got to learn valuable soft-skills such as effective team communication, keeping track of deadlines with respect to features!

Also had opportunity to work with real world client requirements, thus providing me with a first look at the professional life of a UI/UX Developer!