HRMS Onboarding Module
Figma Design Checklist β Design Team Reference (v2)
11 Sections
Design
0%
Dev
0%
β
β
Total Screens
β
Must-Have
β
Nice-to-Have
MUST β Sprint 1 core screen
NICE β Enhancement, after must-haves
Design Team Instructions
- Work in section order β Auth and Company Setup first.
- Each screen needs: default, hover/active, empty, error, and loading states.
- Candidate-facing screens must include mobile-responsive variants.
- Use consistent spacing tokens and the ABShrms component library.
- Annotate every screen with ARIA roles, tab order, and contrast notes before handoff.
- Tick Done when each Figma screen is handed off. Progress auto-saves in your browser.
HRMS Offer Module
Figma Design Checklist β Design Team Reference (v1)
10 Sections
Design
0%
Dev
0%
β
β
Total Screens
β
Must-Have
β
Nice-to-Have
MUST β Sprint 1 core screen
NICE β Enhancement, after must-haves
Design Team Instructions
- Start with Offer Settings and Offer Generation β critical path for Sprint 1.
- Candidate portal screens are public-facing and must be mobile-responsive.
- Each screen needs default, loading, empty, and error/validation states.
- Email template screens must show design mockup + plain-text fallback.
- Migrate to Employee screen must clearly show candidate β employee field mapping.
- Tick Done when each Figma screen is handed off. Progress auto-saves in your browser.
Employee Profile Module
Figma Design Checklist β Design Team Reference (v1)
15 Sections
Design
0%
Dev
0%
β
β
Total Screens
β
Must-Have
β
Nice-to-Have
MUST β Sprint 1 core screen
NICE β Enhancement, after must-haves
Design Team Instructions
- Profile is employee-facing β every tab must have a mobile-responsive variant.
- Payroll & Paycheck screens are sensitive β ensure data is masked by default with an unmask toggle.
- Document upload/download must show progress, file-size validation, and format restrictions clearly.
- All approval workflow screens must show a clear audit timeline (submitted β under review β approved/rejected).
- Email notification templates must have both HR-facing and employee-facing variants designed.
- Tick Done when each Figma screen is handed off. Progress auto-saves in your browser.