Employee directory app: a searchable prototype on sample staff, and where real data goes
An employee directory app answers "who does that, and how do I reach them?" in a few seconds. Anticode can build a fast, searchable prototype with profiles, teams and an org chart from invented staff, which is ideal for agreeing what to show and how people should find each other. Real names, phone numbers and reporting lines shouldn't sit on a public link, so the working version belongs behind sign-in.
What people actually look up
Watch how staff use a directory and the same few questions come up: who is this person in the meeting invite, who looks after payroll, who in the company speaks Portuguese, where does this team sit, and who is their manager. Design the fields around those questions rather than copying every column from the HR system.
| Field | Shown to | Notes |
|---|---|---|
| Name, preferred name, pronouns | Everyone | Let people set their own preferred name and pronouns |
| Job title, team, location | Everyone | Location as office or region, not a home address |
| Manager and direct reports | Everyone | This is what builds the org chart |
| Work email and extension | Everyone | Work contact details only |
| Skills, languages, "ask me about" | Everyone | Optional, written by the person, often the most used part |
| Mobile number | Colleagues, by choice | Many people prefer not to share it |
| Start date, birthday | Opt-in only | Nice for celebrations; never required |
| Photo | Everyone, by choice | Some people won't want one; use initials instead |
Screens worth prototyping
- Search first. One box that matches names, titles, teams and skills as you type, with results that show a face or initials, title and team.
- Profile. Contact details with copy buttons, manager and reports as links, skills as tags.
- Team pages. Everyone in a department, with its lead at the top and what the team is responsible for.
- Org chart. A tree you can expand from the top or from any person, with a way to see the path from them to the head of the organisation.
- New starters. A short list of people who joined this month, which helps a growing company more than you'd expect.
Building the prototype
A useful description: "An employee directory app prototype for a 150-person engineering consultancy with offices in Leeds, Bristol and Glasgow. Sample staff with invented names, titles, teams, managers, skills and languages, clearly labelled demo data. Instant search across names, titles and skills. Profile pages, team pages and an expandable org chart. Filters by office and team. A way to edit my own sample profile, saved in this browser. Also an export of the directory as a CSV file."
Click through it with a few colleagues from different teams. Ask each to find "someone who knows about drainage design in Bristol" and watch which route they take. You'll quickly learn whether skills tags are worth the effort, and whether the org chart or the team pages get used more. Adjust it with change requests between sessions, and keep the final field list as the brief for whoever builds the real thing.
Why real staff data can't go in the sandboxed app
Anticode apps run in a sandbox without network access and are published at an address anyone can open. For a company directory that means:
- It isn't private. There are no password-protected published pages, so anyone with the link could read every name and number.
- No sign-in. The app can't check that a visitor works for you.
- No sync with HR. It can't read from your HR system or a shared spreadsheet, so it would go out of date the day someone leaves.
- No self-service updates. A person editing their own profile changes it only in their own browser; colleagues never see the change.
Staff details are personal data, and a public directory is also a gift to anyone writing convincing phishing emails. Keep the published prototype on invented people only.
The secure version
Many organisations already have a directory inside their email and calendar suite or HR system, and switching it on is the quickest answer. If you need your own, the Next.js export is a reasonable starting point for a developer: Postgres through Prisma, sign-in, roles, an admin area with two-factor sign-in, an audit log, and row-level security so the database itself refuses rows a role shouldn't see. Roles are where a rule like "mobile numbers visible to colleagues only" would live. A developer still has to build the people, team and reporting tables and an import from HR.
If the directory is one part of a broader staff site, see the intranet prototype page; for welcoming new people, the onboarding checklist is a good companion.
Questions people ask
Can I publish an employee directory app with real staff details?
Not safely with Anticode. Published apps are open to anyone with the link and have no sign-in, so keep real data for a version behind sign-in.
Can I import our staff list into the prototype?
You could paste a CSV into it, but it would live in that browser and anyone using the published link wouldn't see it. Use sample data instead.
Can the prototype draw an org chart?
Yes. Give each sample person a manager and ask for an expandable chart; the app works out the tree from those links.