النسخة العربيةAR
Let’s talk

A good partnership starts with a conversation.

NEXTWAVE / SELECTED WORKCASE STUDY / FROM IDEA TO EXPERIENCE
Back to our workBusiness systems

KOVU — Attendance and payroll review interfaces

Attendance needs a clear daily record; payroll needs clear line items. KOVU brings both into an Arabic people workspace while keeping recorded hours distinct from payroll amounts.

Explore the project

Project information

Client
An original Nextwave project
Sector
Professional services
Platforms
Web
Project type
Business systems

Services delivered

Web application developmentUser interface & experience design
THE BIG PICTURE

Project overview

Correcting a clock-out time should not silently change someone’s pay. KOVU starts with that distinction, bringing attendance and payroll context together while making the effect of each action explicit.

Attendance has records; pay has line items

A daily record may need correction while a monthly payroll run is under review or approved. Implicit pay changes would make the reason behind a new net figure unclear.

The interface keeps attendance times and state visible, while pay follows explicit basic salary, additions and deductions within a specific run. A shared employee context connects the reading without merging the rules.

A week at a glance, a person in context

The attendance workspace shows the team’s week and the selected day’s states and recorded hours. A day marker opens the employee’s times, duration and available monthly records.

The payroll workspace groups saved monthly runs, totals and employee rows with search and team filtering. Each employee opens in the selected run, keeping the period and person visible during review.

Each edit stays in its own scope

Attendance duration uses same-day clock-in and clock-out times. Missing records stay unrecorded rather than becoming absence. Leave and absence clear work times from that record.

Cent-based pay amounts derive net salary from basic pay plus additions minus deductions, rejecting negative results. Variable items belong to one period; new runs start from baseline salary and fixed allowances without automatically carrying prior adjustments.

INSIDE THE EXPERIENCE

Project images

Explore the interface and experience through the project gallery.

Use case: correcting attendance without changing pay

An HR coordinator checks the employee’s day and times. An earlier clock-out is rejected with an explanation. A valid correction and note update the day’s duration and attendance indicators.

Changing the state to leave clears work times and yields zero work hours for the record. Existing payroll amounts remain unchanged: attendance correction does not silently add a pay adjustment.

Three KOVU mobile screens showing weekly attendance, payroll items and an employee record
Three KOVU mobile screens showing weekly attendance, payroll items and an employee record

Use case: preparing a new monthly payroll run

The coordinator selects a month; duplicate periods are rejected. The run begins with the team’s saved baseline pay and fixed allowances, ready for period-specific edits.

Named additions and deductions update the net after saving. A deduction exceeding basic pay plus additions is rejected. Changes stay within this run, preserving earlier periods and the employee’s baseline for future runs.

KOVU employee record with an enlarged basic pay, adjustment and net pay panel
KOVU employee record with an enlarged basic pay, adjustment and net pay panel

Use case: reviewing and reopening a payroll run

Submitting a draft run locks employee salary editing. The reviewer can filter teams, search people and export visible rows while the header totals continue to describe the entire run.

Approval keeps the rows locked. Reopening requires a reason and returns through review before editing. Actions and notes remain in the run history. This records approved values; it does not execute bank transfers or automatically calculate tax or insurance liabilities.

KOVU payroll run and employee record showing net pay, attendance and salary components
KOVU payroll run and employee record showing net pay, attendance and salary components

People before spreadsheets

Coral, peach and plum create a warm workspace with rounded cards and recognisable people. Weekly attendance combines symbols and colour, while times and amounts remain explicit.

Mobile layouts regroup weekly attendance by person and turn payroll rows into labelled cards. Four mockups preserve the original screen content within soft, brand-specific studio compositions without background text.

Three KOVU mobile screens showing weekly attendance, payroll items and an employee record
Three KOVU mobile screens showing weekly attendance, payroll items and an employee record

Implemented scope

Three interfaces implement attendance, payroll runs and employee records with browser persistence, duration and net calculations, filters, exports and review states. Displayed attendance hours reflect available monthly records and do not alter pay automatically. Connected attendance services, time clocks, shared payroll, permissions, transfers and integrations require separate implementation; broader navigation modules are outside these pages’ delivered functionality.

Built with

  • HTML5
  • CSS3
  • JavaScript
  • localStorage
NEXTWAVE

Need clearer attendance and payroll review?

We map your attendance rules, salary components and review process, then define the experience, services and integrations your team needs.

Let’s talk about your project