ABAS ERP Redesign: Avega Bros. Integrated Shipping Corporation

Employee Interviews

I conducted interviews with employees across roles and departments to understand how they actually used ABAS day-to-day. I transcribed every session, broke each transcript into individual observations and quotes, then clustered them on a board. Four themes surfaced again and again, and almost all of them traced back to a single behavior: people had quietly moved their real work out of ABAS and into spreadsheets.

Heuristic Evaluation

To complement the interviews, I audited the existing ABAS interface against Nielsen's 10 usability heuristics, walking through the core HR screens (sidebar, Employee Masterlist, Leave Applications) and rating each violation on Nielsen's 0–4 severity scale. The audit gave the spreadsheet workarounds a concrete cause: the system was working against the heuristics that make software learnable and efficient.

Information Architecture Overhaul

The most impactful change was restructuring the entire navigation. I consolidated 25+ flat sidebar items into 13 grouped categories with collapsible sub-menus.

The core principle: related data should live together. Positions, Departments, Divisions, and Org Chart are all facets of the same concept, organizational structure. They don't need four sidebar items; they need one page with four tabs.

Tab-Based Sub-Navigation

Instead of scattering related content across separate pages, I introduced horizontal tab bars within pages. The Roles & Structure page now has tabs for Positions, Departments, Divisions, and Organizational Chart, all accessible without leaving the page or losing context. Each tab shows a count badge so users can see the scope at a glance.

Breadcrumb Navigation

Every page now includes a breadcrumb trail (e.g., Home → Recruitment & Onboarding → Career Postings) so users always know where they are in the system and can navigate upward without relying solely on the sidebar.

Status-Filtered Tabs with Counts

For workflow-heavy pages like Career Postings and Hiring Pipeline, I added status tabs with real-time counts (All 12 · Drafts 5 · Submitted 2 · Approved 3 · Rejected 2). This eliminates the need for a separate filter panel for the most common filtering action, checking items by status, and gives managers an instant overview of their pipeline without any clicks.

Multi-Step Modal Wizards

The old system had no structured workflow for complex processes like hiring. I designed a 4-step wizard for the hiring pipeline, with a progress indicator, clear step labels, and a persistent activity trail so the hiring manager can see who took what action and when.

Consistent Design System

I built the design system from scratch, establishing four pillars that every module now inherits.

Authentication Flow

A branded login experience with the Avega "AV" logo, OTP verification with clear 6-digit input fields, and a forgot password flow. The right panel features brand imagery that reinforces the company identity from the first interaction.

Roles & Structure

A single page with four tabs replacing what was previously four separate sidebar items. The Positions tab displays a clean 6-column table with hierarchy and department context. The Org Chart tab visualizes reporting structure with interactive "Add Position" placeholders for building out the hierarchy.

Career Postings

A recruitment management view with status-filtered tabs showing counts, a publish toggle for live postings, and an "Edit Position" modal for quick updates without leaving the page.

Hiring Pipeline

The most complex flow: an applicant tracking system with status-filtered tabs (Applicants 17 · Shortlisted 5 · For Interview 2 · Accepted 3 · Rejected 2 · Onboarding 2), inline resume file icons, and a 4-step wizard for progressing candidates through screening, assessment planning, and final evaluation.