Klan helped Accentra team to convert their existing web application into an easy-to-use Mobile application. We also revamped the existing web application with a new look and design language.
The existing web application served as the reference point for our team. We identified the flaws in the current user flows, so that they could be simplified in the mobile application.
After initial analysis we found the following areas for improvement:
Data representation
UI components not consistent with the latest trends
Visual Hierarchy missing in certain modules
Data tables and lists were not aligned correctly
As an initial step in improving the understanding of the existing application, we laid down all the data handled by the system. Once this was done the data was mapped to the relevant screen. This process is known as Information Architecture.
After the information architecture the team proceeded to the initial wireframing. We identified the components for each screen and the placements for them. This was the perfect time for feedback from the Accentra team.
As an existing application in the payroll space, the brand colors were something which existing Primo Umbrella customers easily identified with. Our team came up with 2 variants for the visual language for the app based on the brand’s color. The visual language builds the character of any product.
Accentra team wanted the app to be very intuitive and easy to use. We designed all the components in line with the latest design trends.
All contractors on Primo Umbrella need to complete an onboarding process before they can start uploading timesheets. This includes verification using some third party services. We combined all the steps into one seamless flow.
The application has various modules in which the data is visible once the user adds few entries into the system. It is important to provide legit feedback to the user in this case. Each module in the application has an empty state screen to provide this information.
In a payroll application there is a continuous inflow of data at regular intervals. We arranged the data in intuitive lists by carefully choosing data points that matter the most at the first glance.
While the user does get important information at a glance, they might want to verify some information which is not a part of the list view. Thus every list item across items would expand to a detailed view, which provided more comprehensive information about that entry.
The Primo Umbrella had a unique way of handling contractor grievances. The contractors could raise a ticket with the support team. These issues are shown to the user as an Inbox of messages.
The home screen is the crux of the entire application. The current version was very cluttered. We dissected the data on the screen and designed a structure which was clean, minimal and easy to use.
The Accentra team wanted a fresh look for their application. We identified the major components across the and redesigned them as per current UI trends.
The home screen is the crux of the entire application. The current version was very cluttered. We dissected the data on the screen and designed a structure which was clean, minimal and easy to use.
The home screen is the crux of the entire application. The current version was very cluttered. We dissected the data on the screen and designed a structure which was clean, minimal and easy to use.
The home screen is the crux of the entire application. The current version was very cluttered. We dissected the data on the screen and designed a structure which was clean, minimal and easy to use.
