Changing the employee experience on esop platforms.

  • UI UX Design
trica/trica_logo.webp

Project overview

trica/trica_banner.webp

Existing Problem

Our Solution

User Story Map

User maps helps visualize the activities, details and steps users go through in a product / feature. Instead of hefty requirement documents, story maps communicates how the pieces fit together before the design and development process.

trica/trica_flow.webp

Wireframes

Several iterations were created and ideas were thrown around in achieving the user experience part for the exercise module. From dashboard to the admin tables, pixel perfect wireframes were created.

trica/trica_wireframe1.webp
trica/trica_wireframe2.webp
trica/trica_wireframe3.webp
trica/trica_wireframe4.webp
trica/trica_wireframe5.webp
trica/trica_wireframe6.webp
trica/trica_wireframe7.webp
trica/trica_wireframe8.webp

Color Pallete

Night Blue, Forest green are the primary colors chosen as the former is chosen to build the trust factor and the latter is chosen as it exudes positiveness . Dark Knight black and Autumn grey are our secondary colors.

trica/trica_colorcase.webp

Typography

Work Sans is a free google font, which is optimized for web and mobile interfaces with excellent legibility characteristics in its letterforms which gives a neutral yet friendly appearances.

trica/trica_work.webp

Components

trica/trica_grants.webp

Intutive UI

Dashboard was one of the two priorities along with the user experience part in the exercise options module in achieving the solution. The platform was designed with 12 column grid system.

Exercise Module

Exercise module is where when a grant is awarded to an employee, they can select how many options they want to exercise by paying the required amount, signing important documents and submitting the DEMAT information. After admin verification employee will have a successful exercise action.

OtherScreens

Here is the list of other screens that are part of the user platfrom. 30+ screens were revamped in the entire platform

  • Grant Overview

    trica/trica_screen2.webp
  • Accept Grant

    trica/trica_screen3.webp
  • Exercise Status

    trica/trica_screen4.webp
  • Admin Table

    trica/trica_screen5.webp
trica/trica_screen2.webp
trica/trica_screen3.webp
trica/trica_screen4.webp
trica/trica_screen5.webp

Responsive UI

trica/trica_icon.webp

Similar Portfolios

projects/ather.webp

Ather

Ather Energy is an Indian electric vehicle company, We collaborated with Ather on the front-end development of their marketing website, customer portal and Ather space.

View case study
projects/chaos.webp

Chaos Genius

It’s an open-source Business Observability Platform for anomaly detection. Hence, to optimize the efficiency of the platform we introduced compelling real-time data visualization capabilities coupled with layered information relevant to each user role.

View case study

Come Experience - The Sketch Brahma Difference

our-service/sbPath.png
icons/arrowTop.svg