Designing a Desktop Widget for HR management
UX Design, UI Design, Research,
HRMS helps HR directors manage the entire company’s HR on the same platform and streamline communication and workflow between employees and managers. To make the task even more easy, we have widgets. Widgets helps an employee from going back to the software each time inorder to do a routine task.
The Process Used
The actual process contains five steps which includes, discover, define, ideate, prototype and test. However, owing to the tight deadline, testing part is saved up for later.
Discover
I conducted a heavy discovery phase focusing on user research to get to know the people’s goals, priorities, frustrations and behaviours during using an HR software. I analysed the existing market of HR Softwares and noted possible areas of opportunity to better meet user needs, as informed by primary and secondary research.
Define and Ideate
I delivered a concise strategy by articulating needs and beliefs of a HR software. I identified core pain points that people usually experience while using a software. I articulated a vision for how the new screens would look like, and then prioritise which ones would go into the Desktop Panel.
Prototype
I developed an information architecture which is focused on the reason for selecting certain features to be added into the widget based on the target group.
— 01 Target Users
The target Users are classified based on different HR profiles. They include:
- Entry level profiles which includes Staffing Coordinator, Staffing Specialist, HR Assistant, HR Associate, HR Representative, HR Administrator, HR Analyst etc.
- Mid level profiles which includes HR Specialist, HR generalist, HR Supervisor
- High Level profiles which includes HR Director, HR manager, CHRO, VP, President etc.
Given the deadline, and consideration of two extremities, Let’s consider only entry-level profiles and high level profiles. Also, there is a need to include regular employees who are not a part of the HR team, but has to communicate with the HR team.
The Target Users would be
- HR managers / Directors
- HR Associates / Specialists
- Regular Employee who is not a part of the HR team
— 02 Goal
Provide a widget so that the user does not have to open the software all the time to do a particular task that they do frequently. Simplify HR management and provide insights through a desktop information widget which is highly usable to everyone and not just for the HR.
- Develop a research — informed understanding of why, how and when people use Desktop Widget and what features to put in it.
- Understand the current challenges that people face while using HR softwares.
- Design a desktop widget that improves the user experience by clearly defining and prioritising the needs.
Duration
3 Days
Tools
Figma, Illustrator, FigJam, Google Forms
Phases
User research — design strategy — interaction design — wireframing and prototyping — UI Design.
— 03 Problem Statement
After deciding on the goals, problem statement was defined
Prioritising tasks and selecting only the most relevant ones to be shown in the widget.
— 04Challenges
Sort the data based on priority for each Target Users ( Manager/Director, Regular Employee and HR Associate/Specialist) and display only the most relevant and important data through the desktop widget. Make complex things simple and more understandable
— 05 Define
Primary Research
In order to better understand the user needs and behaviour, I conducted surveys and interviewed and recruited people who had experience with HR and also people who had experience communicating with an HR. Feedback was collected through a google form and then common patterns were observed from the research. Using the information which is provided by a stakeholder has a better chance to help make an effective design. A questionnaire containing different set of questions for each of stakeholders were prepared and distributed. Data was collected and general patterns were observed.
User Demand Analysis
Through Research, it can be seen that the HR software in the market has exceeded for demand as there are a lot of HR softwares. It still cannot solve the efficiency problem fundamentally. Data is scattered, work efficiency is low and the HR is overburdened. At this point, a centralised platform that connects all HR tools is really important. After the software’s landing page has been made, the widget will be designed. Through the surveys and interviews, two key personas emerged. These personas helped to highlight some core suer priorities. People want a design that would save their time, capture their goals and motivation and feel in control, without any confusion.
Secondary Research
Since I had no idea how a HR Team worked, I did research on it and this is what I found out.
- Core functions of a HR team
Staffing,
Development,
Compensation,
Safety and health, and
Employee and labor relations.
2. What is HRMS?
Applicant Tracking
Employee Onboarding
Performance Management
Attendance and Time
Leave Management
Employee Offboarding
3. Need of an HRMS?
Data management
Employee self service
Easy reporting
Efficiency and cost effectiveness
Improved employee engagement
4. Benefits of HRMS
Better communication across the organization
Reduce costs and administrative burden
Ensure consistency and timely data analysis
— 06 Summary // Selection of functions for widgets
Most of the functions have different levels of authority and data has different sensitivity levels.
Workflow: Initially, all the different tasks and functions of the HR team was studied. A system called Pagination and Grid Widget, where all the important widgets are displayed as widgets on different pages.
Users can add or delete widgets according to their own needs to achieve a fully personalised interface which ensures consistency in design and coding between various professional roles.
After doing this, the widgets are sorted based on priority and then categorised and contracted into a desktop widget.
Some of the main points where were given attention, were:
1. Stimulate the layout of the widgets, which helps reduce learning costs
2. Using colours to distinguish between different prioritised matters.
3. Using responsive widget system to help maintain consistency.
— 07 Solutions based on Pain Points
There can be different widgets which can be categorised based on role-based access control system which consists of the following roles.
1. Main Admin: Has the highest authority, rights and control — the Director and Managers.
2. Admin: Has access to specific departments and subsidiaries
3. Sub-Admin: Has only the authority of the department and cannot access information from other departments.
Experience Optimisation: It is better when we always start from the user’s purpose, which helps us to understand the difficulties they face, if the process is reasonable and if it is too complicated. Based on different Target Groups, The landing page and the information on widgets were classified and prioritised.
For complete brainstorming, click here: https://www.figma.com/file/AeHmWUVDHqzJPv10At1w5z/HR-management-Brain-Storm?node-id=0%3A1
— 08 Information Architecture and Wireframe
Informed by both primary and secondary research findings, I drafted an application map to organise content and features, I considered the priorities that the research participants indicated as important. The application map and user flow informed the key screens that I developed in the first set of low-fidelity wireframes.
— 09 Design
I Used Figma to make the wireframes dynamic so that I would be able to evaluate how people engage with the proposed onboarding screen and identify sources of user error and frustration early in the design process. However, as time was running out, I was not at liberty to conduct Customer Usability Testing.
— 10 Visual Design
After reviewing my findings from the initial research phase, I observed that many of the existing products ( Softwares) use contrasting colour palettes, but is pretty much dull in terms of design and usability. The main colours which were used, are Blue, White and Grey, which evokes a sense of trust and stability. I experimented with colour palettes that would convey some of the same values and characteristics of existing softwares, but would also convey professionalism, reliability, productivity and efficiency. Throughout the design process, I checked the colour contrast of elements to ensure visibility. While colour choices support the overall tone of the widget and the software, the process strives to be accessible for users who are low vision and colour blind.
— 11 Solving the Problem
- Different Target Groups were given different colours to distinguish between different uses of softwares.
- The widgets are customised based on each Target Group’s Profile
- They can be further customised easily through the software landing page
— 12 Lessons Learned
The Main Lessons that I learned from completing this project are:
- The value of conducting user research with business employees
- Scenarios, use cases and stories are very valuable in identifying what users wish to achieve with a system, so it will be helpful to decide what features they will need to achieve that.
- Prioritising requirements for the desktop widget as there is limited time to develop it.
Thank you for your time!
