Part Two — How we are creating a HR system that increases engagement and productivity.

Let’s have a quick recap

In the first part of this series, we recognised that the old LoopHR system was outdated, unintuitive and no longer acting as a suitable solution for its users. Knowing and understanding this, we needed to start investigating and researching the different user types and come up with low-medium fidelity wireframe solutions.

Design Process

The design of LoopHR is based on a core set of bespoke reusable patterns and components. Using this approach has resulted in great consistency and enabled us to speed up the design and build process. Spacing consistency has been achieved by following the 8pt grid, meaning that all spacing is done in increments of 8px (8, 16, 24, 32 etc.). Take a button component, for example, you can see below that the spacing follows the 8pt grid with top and bottom padding being 16px and left and right padding at 24px.

To create a smoother design/developer handover we’ve made sure that all of the styles used throughout LoopHR have been documented in our style guide. Within the style guide, you’ll be able to find typography, colours, buttons, forms and grid styling. For each element, you’ll be able to see how they should appear in their different states. Having this documentation makes it easier when building future features within this project.

Features

LoopHR is a feature-rich piece of software so it’d be impossible to share every feature with you. We’ve hand-picked a couple of features to give you more insight.

Dashboards

The dashboards within LoopHR are an extremely powerful feature that allows users to get an overview of how they’re performing. Both admin and employee users have their own personal dashboard. This dashboard supplies them with information on how their company is performing and personal employee performance.

Admins can easily see how their sales targets are doing for that period, view employees performances based on their targets, see holiday and sickness alerts, and also stay up to date on upcoming Performance Development Reviews and Salary Reviews.

Employees get to see a breakdown of their schedule for the week, whilst also seeing a monthly summary of what they have worked. They can easily see their service and retail sales which makes up their bonuses for that period. They’ll also receive reminders of when they have PDR’s and upcoming training.

Further development improvements are going to be made to the dashboards including allowing users to rearrange the data tiles and show/hide data sets. Giving users these improvements will allow them to create a more personal dashboard experience to meet their needs.

Live Chat

We’ve created a live chat interface to allow admins and managers to communicate with their employees. Messages can be sent to individual employees, teams of employees and managers can communicate to other managers. Users get notified within the app but are also sent email notifications to make sure that they stay on top of their inbox.