Vibe Coding Playbook for HRM Students

Purpose: The questionnaire showed that vibe coding / prompt-based app prototyping is the lowest-confidence area. This playbook slows the process down so students design safely before using any tool.

Core message

Vibe coding is useful for prototyping, not for bypassing IT, security, legal, or HR governance. In this workshop, students create learning prototypes only.

What students should build

Safe workshop prototypes include:

• Fictional onboarding checklist page
• University career center landing page
• Mock interview preparation page
• Training recommendation quiz using fictional data
• HR policy FAQ mockup using fictional policies
• Employer branding microsite
• Learning pathway page

Avoid prototypes that include:

• Real CV uploads
• Real student IDs
• Real employee records
• Payroll changes
• Grievance reporting with names
• Medical or disability information
• Disciplinary records
• Automatic candidate ranking
• Final HR decision-making

Step 1 — App planning canvas

Step 2 — Clarifying prompt

Act as a product designer helping HRM students create a safe classroom prototype.

We want to build an HR micro-app for a fictional Sri Lankan organization.

Before suggesting the app, ask us 8 clarifying questions about:
- User
- HR problem
- Scope
- Features
- Data
- Risks
- Human support
- What to exclude

Do not write code yet.

Step 3 — Safe prototype scope prompt

Based on our answers, propose a safe prototype scope.

Return:
1. App name
2. One-sentence purpose
3. Target users
4. 3 safe features
5. 3 features to avoid
6. Fictional data to use
7. Data that must never be collected
8. Human support point
9. Page sections
10. Responsible AI notice

Step 4 — Build prompt for a one-page website

Build a single-page HR prototype website for a fictional Sri Lankan organization called [name].

Purpose: [purpose]
Target user: [user]

Include these sections:
- Hero
- Problem statement
- How it works
- Three safe features
- Responsible AI notice
- Human HR support contact placeholder
- FAQ using fictional content
- Workshop reflection prompt

Design requirements:
- Professional and student-friendly
- Mobile responsive
- Low bandwidth
- No copyrighted images
- No login
- No database
- No real data collection
- Synthetic or fictional content only

Important exclusions:
- Do not collect real names, phone numbers, email addresses, student IDs, CVs, salary records, medical data, disciplinary data, or grievance details.

Step 5 — Build prompt for an onboarding checklist app

Create a simple onboarding checklist prototype for a fictional Sri Lankan hotel chain called GalleWave Hotels.

Features:
- Welcome message
- Day 1 checklist
- First-week training schedule
- FAQ
- Progress tracker using checkboxes only
- Human HR contact placeholder
- Responsible AI reminder

Use fictional content only. Do not collect personal data. Make it suitable for classroom demonstration.

Step 6 — Build prompt for a career center mock interview page

Create a single-page website for a fictional Sri Lankan university career center.

Purpose: help final-year HRM students practice for interviews.

Include:
- Welcome section
- Interview preparation steps
- Three practice categories: HR intern, management trainee, customer service associate
- Copy-ready AI prompts for practice
- Tips for responsible AI use
- Human career advisor reminder

Do not include real booking forms or collect personal data.

Step 7 — Security teardown prompt

Act as an HR technology risk reviewer.

Review this prototype before students present it:
[paste app description or code summary]

Identify:
1. Any real-data risk
2. Any sensitive-data risk
3. Any security or access-control concern
4. Any HR decision-making concern
5. Any misleading or overpromising content
6. What must be removed before classroom sharing
7. What would require IT/legal review before real deployment

Then provide a safer revised version of the prototype scope.

Instructor facilitation cues

• Tell students: “The canvas comes before the tool.”
• Ask every team to name one feature they intentionally excluded.
• If students propose collecting data, ask why it is necessary and whether it can be avoided.
• Reinforce that a public demo page is not an HR system.
• End with a security teardown before the final pitch.

Fast fallback activity

If app-building tools are unavailable, ask teams to create a paper or Canva mockup with:

1. Home section
2. User journey
3. Three feature cards
4. Responsible AI notice
5. Human support point
6. Privacy statement