Your message has been sent — I'll reply as soon as possible.
Draia

Internal HR & Shift System · 2026 · 7 min read

Draia

An internal platform built to make shift planning, daily attendance tracking, and manager approvals simple.

Product & UX/UI Designer HR SaaS Platform Shift & Attendance Management
Draia — HR master dashboard
Draia — attendance monitor
Draia — shift roster

Faster operations

82%

Quicker approvals and less time fixing weekly schedule conflicts.

Less wasted software

78%

Replaced heavy third-party tools with one simple system built for the job.

Team adoption

94%

Most departments started using it in the first month because it was easy to understand.

Discover

As the company grew, managing shifts and daily logs in scattered spreadsheets stopped working. Existing enterprise tools were tested, but they were too complex, too expensive, and didn't fit how the team works day to day.

01

Too much manual work

Managers spent up to 6 hours a week checking shift changes, leave requests, and attendance logs by hand.

02

Too many features

Old HR platforms were slow and cluttered because of hundreds of features nobody used.

03

No clear view for employees

Employees had no single place to check their shifts or follow the status of their requests in real time.

Half of Sunday night is spent cross-checking messages just to figure out who is swapping shifts for Monday morning.

— HR & Operations Lead

All that's needed is to open the app and instantly see shift times and leave approval status — without messaging managers.

— Senior Employee

What's already out there

Too Cluttered Overpriced JISR logo

JISR

Confusing UI Overwhelming Zenefits logo

Zenefits

Too Rigid Slow Filters BambooHR logo

BambooHR

Over-Engineered Complex Flow Rippling logo

Rippling

Wrong Use-Case Too Distracting Deel logo

Deel

This is how the HR team felt when testing the tools on the market. They are powerful products, but too heavy for everyday work. Instead of digging through huge systems just to manage shifts and approve leaves, the team needed something simple, focused, and clear. That is why Draia was designed.

Define

The platform was organized so no one hits a dead-end: employees get self-service, and HR gets full control — each in its own clear space.

Persona

Employee perspective

Built for speed and self-service. It answers three questions in seconds: When is my next shift? Are my hours correct? Was my request approved?

Persona

HR / Admin perspective

Built for the big picture: scan everything quickly, handle many requests at once, and spot attendance issues across all departments right away.

Must-have — v1 core scope

  • Daily Shift Schedules
  • Clock-In Logs
  • Shift Swap Requests
  • HR Approval Queue
  • Multi-Branch Filtering

Later — v2 roadmap

  • Integrated Project Management
  • Task Allocation
  • Meeting Room Conflict Detection

Explore

Several layout directions were tried to show a lot of data without overwhelming the user.

Option A — Discarded

Popup-heavy layout

Needed several popups just to see shift details. Dropped — too many clicks.

Option B — Selected

One table with built-in filters

Lets HR scan hundreds of records line by line, with clear color-coded status badges.

2-step shift swap

Turned the usual long shift-swap process into a simple 2-step popup.

Comfortable table spacing

Tuned the table spacing so rows are easy to scan on any screen size.

Design

Draia mark

Draia

Naming logic

Comes from the Arabic word for awareness and clarity — the idea that both managers and staff can always see what's going on.

Brand mark & visual metaphor

Mixes the curve of the letter "D" with the shape of organized logs and documents — a symbol of structure, clarity, and reliability.

Design System (foundations)

Colors & Grid System
Draia color ramps and grid system
Typography & Icons
Draia typography scale and icon set

Access & Onboarding

Company Workspace
Enter your company workspace screen
Sign In
Sign in to your account screen

Section A — Employee portal (for employees)

Employee Overview Dashboard
Employee Overview Dashboard
My Attendance & Hours Log
My Attendance and Hours Log
Leave Requests & Shift Details
Leave Requests and Shift Details

Section B — HR & management center

HR Master Dashboard
HR Master Dashboard
Central Attendance Monitor
Central Attendance Monitor
HR Approval Queue
HR Approval Queue
Shift Roster Management
Shift Roster Management
Multi-Branch Overview
Multi-Branch Overview

Ship

Version 1 — outcome & handoff

Delivered fully documented UI screens and a component library ready for development, with clean data for monthly reports.

Version 2 — future roadmap

  • Projects Module — linking logged shift hours to active projects.
  • Smart Conflict Detection — automatic warnings when meetings overlap with active shifts.
Draia v2 roadmap — Meetings and Projects marked as coming soon

More projects

Taibah University Career Fair website

Career fair website · 2026

Taibah University Career Fair

Masari — landing page

Landing page · 2026

Masari

Rehab Roshen — mobile app

Mobile app · 2025

Rehab Roshen

Back to projects