← All projectsHR automation · Web application

PROJECT 01 / Portfolio demonstration

HR Onboarding

HR onboarding, connected from offer to day one.

6:33 / NARRATED PRODUCT WALKTHROUGHDemo interface · English captionsRead transcript

An HR onboarding application that connects offers, employee documents, reviews, and department handoffs. This employer-neutral walkthrough uses fictional hires and simulated notifications.

Next.jsTypeScriptPrismaPDF workflows

01 Problem

HR needs to know whether a new hire is ready to start. When offers, forms, signatures, and corrections live in separate messages and spreadsheets, that status is difficult to track.

  • Scattered information

    HR has to piece together what each employee has submitted and what is still missing.

  • Unclear approval status

    A submitted document still needs review. Completion and approval are different steps.

  • Dependent handoffs

    IT and Fleet need a clear signal from HR before starting their part of onboarding.

HR Onboarding: The dashboard illustrates the coordination problem: pending reviews, outstanding corrections, and approaching start dates.
The dashboard illustrates the coordination problem: pending reviews, outstanding corrections, and approaching start dates.

02 Solution

I built an onboarding application that connects the employee journey with HR review and department handoffs. Each hire has a record that keeps progress, documents, and next actions together.

  • One employee record

    Offers, forms, signatures, and uploads stay connected to the same hire.

  • Explicit review and approval

    HR can request corrections and approve the packet before notifying downstream teams.

  • My contribution

    I defined the workflow and employee/HR experience, then used AI-assisted development to build the application.

Hire details and equipment requirements from the same fictional employee record, shown side by side.

03 How It Works

The workflow moves from new-hire setup to employee completion, then HR review and approval. Corrections return to the employee before the process moves forward.

  1. Create the hire

    HR enters the new hire and prepares the offer.

  2. Collect the documents

    The employee completes forms, signs documents, and uploads the required information.

  3. Review and correct

    HR checks the packet, requests changes when needed, and reviews the updated record.

  4. Approve and hand off

    HR approves the completed packet before IT and Fleet are notified. Notifications are simulated in the demo.

HR Onboarding: The correction step: HR selects the items to redo and adds instructions before approving the packet. Still from the existing project walkthrough.
The correction step: HR selects the items to redo and adds instructions before approving the packet. Still from the existing project walkthrough.

04 Results

The portfolio demonstration connects new-hire setup, document collection, corrections, and department handoffs in one working application. The walkthrough shows the workflow using fictional employee records.

  • What the project demonstrates

    An employee submission and its HR approval are separate, visible stages in the same workflow.

  • What is not measured

    No quantified study of time savings, error reduction, or business impact is available. The public demo uses fictional data and simulated notifications.

  • What comes next

    Evaluate usability, completion time, and correction rates to identify where the process needs improvement.

HR Onboarding: Sample hires Tyrone Brooks and Ava Nguyen show 100% progress and Completed status. These are fictional demo records, not measured business outcomes.
Sample hires Tyrone Brooks and Ava Nguyen show 100% progress and Completed status. These are fictional demo records, not measured business outcomes.