(Case study · 04)
Parsley
Parsley Management places people in jobs across Uttar Pradesh, mostly at car and two-wheeler dealerships, banks and insurers. Job seekers never pay; employers do. The site has to work for a fresher checking jobs on a budget Android phone and for a dealership HR manager who needs four sales consultants this month, and the recruiters have to keep it current without a developer.
Client work for Parsley Management Pvt. Ltd., a recruitment firm in Hazratganj, Lucknow. The figures on the site (7,500 registered, 240 companies, 2,000 placed) are the client's own. The admin screens show sample leads, not real applicants.
(Why this site)
How do you make a website feel premium without making it harder to understand?
Parsley Management fills jobs across Uttar Pradesh, mostly at dealerships, banks, insurers and growing local businesses. Job seekers never pay; employers pay for the search.
The brief had three jobs for one website: earn trust in the first screen, turn visits into conversations, and stay current without a developer.
The client also asked for Material 3, real motion and 3D, with nothing that looks templated. The risk was a beautiful site that a fresher on a budget phone couldn't use.
(The problem)
Where a visit could stall
Design hypothesis · drawn from the brief
- Job seekers
- Employers
- Training enquiries
- First screenIs this genuine? Is it really free?
- Choosing a doorCandidates and employers want opposite things
- JobsOpenings change every week
- Getting in touchA resume has to reach a recruiter fast
- Follow-upRecruiters need every lead and its status
(What I looked at)
Before I opened a design file
There was no competitor scan for this project, and I'm not adding one after the fact. What shaped it was the client, their audiences and their hosting.
- The client's own material
- What is genuinely theirs? The leaf logo, its green and orange, the 47 businesses they recruit for, and the figures they supplied.
- The two audiences
- Who is on the other end? A fresher checking jobs on a budget Android phone, and a dealership HR head who needs four sales consultants this month.
- The hosting
- What can it run on? Hostinger shared hosting: PHP, no database server, no build step.
- Material 3
- What did the client ask for? An M3 system, so the colour scheme, shapes and motion curves come from it.
(What changed because of it)
Finding, decision, screen
Each one is on the live site
Candidates far outnumber employers.
Two unequal doors from the first screen; the bigger green one faces candidates.
Two ways in
47 client logos of mixed sizes wouldn't read on a phone.
Turn them into rows of names, grouped by industry, drifting as you scroll.
Businesses we recruit for
Recruiters change jobs every week, and the firm has no developer.
An admin they run themselves; a job change reaches the site within a minute.
Admin
Many candidates will only ever see the site on a phone.
A phone layout designed on its own, a lighter 3D mode, and 48 px tap targets.
Mobile
(Information architecture)
Every section has one job
Every page leads to one of two actions: send a resume, or describe a hiring need. The header carries both, so neither audience has to hunt.
The only numbered list on the site is the placement process, because it's the only real sequence.
parsleymanagement.com
- Header
- Jobs
- For employers
- Training
- About
- Contact
- Hiring solutions
- Looking for a job?
- Home, in order
- The leaf film: 7,500 · 240 · 2,000
- Two ways in
- How a placement happens: 5 steps
- Free for job seekers. Always.
- Open jobs, live
- Businesses we recruit for
- Training
- In their words
- One form, three intents
- Admin
- Leads: list, filters, CSV export
- Lead: status, private notes, resume, delete
- Jobs: add, edit, close, reopen
Three people, three doors
- Job seeker Jobs, apply in one tap or on WhatsApp, send a resume
- Employer The process, who they recruit for, a short hiring form
- Recruiter Every lead, its status, and the jobs on the site
(Flows)
From the form to a recruiter's phone
01 · A lead
- Visitor sends the form
- Origin, spam trap and rate limits checked
- Saved; resume stored outside the web root
- Email alert to the team
- New
- Contacted
- Placed or closed
02 · A job
- Recruiter adds a job
- Live on the site within a minute
- Apply fills the form with that job
- Or WhatsApp, with a ready-written message
03 · A removal request
- Request
- Delete the lead
- Its resume is deleted too
(Scope)
One form, three intents
Rather than three forms, one form changes to match who's writing: job seekers get a resume upload, employers get a company field, and the message label rewrites itself.
Looking for a job
- Name and phone
- Resume: PDF or Word, up to 5 MB
- Or continue on WhatsApp
Hiring
- Company
- The role, the headcount, the city
- A short message
Asking about training
- Three programmes in tabs
- The six-module HR course as accordions
- One message field
(Structure)
Two doors, and a page with one job per section
The audience cards are deliberately unequal: the larger one faces candidates. The page below them is a stack where each section answers one question.
Drawn for this case study, after the fact.
(Values)
What I refused to compromise
Clarity before spectacle
Within seconds a visitor knows what Parsley does, where it is, and that candidates pay nothing.
Every page converts
Each section ends in one of two actions: send a resume, or describe a hiring need.
The brand is the client's own
The 3D leaf is traced from their logo, and the whole colour scheme is generated from its green and orange.
Works without the fireworks
With reduced motion, no WebGL or no JavaScript, the film becomes plain stacked text with the same content.
Resumes are personal data
Stored outside the web root, served only to a signed-in admin, deleted with the lead.
(Mood board)
Material 3, grown from a leaf
The full Material 3 scheme was generated from the logo green, with the logo orange as the tertiary colour: green for people looking, orange for people placed. One variable font, Roboto Flex, does everything from condensed display numbers to body text.
From the site's own colour scheme and screens
- Primary
#006B1B - Container
#008725 - Secondary
#D5E8CF - Tertiary
#FFDCBD - Brand orange
#B96D00 - Surface
#F8FAF2 - Night
#0C0F0B
- Premium, not puzzling
- Green is looking, orange is placed
- Thumb-sized
- Honest numbers
(What I built)
A website and the admin behind it
I built the whole thing on my own: design, front end, the 3D film, the backend and the admin, on the client's shared hosting with no build step.
- 3D scroll film from the leaf logo
- Two ways in
- Live jobs board
- One form, three intents
- WhatsApp hand-off
- Training tabs
- Recruiters' admin
- Material 3 from the logo
The screens
A new website for a Lucknow recruitment firm: a 3D scroll film built from the company's own leaf logo, a live jobs board, one form for three kinds of visitor, and an admin the recruiters run themselves.
(Up close)
The decisions, on the screen
12345- Both audiences' buttons, always in the header
- The bigger door faces candidates, who far outnumber employers
- "Free for candidates. Always." comes first
- Employers get their own door, smaller and offset
- "You interview a shortlist, not a pile": what they're paying for
12345- Counts by status, at a glance
- Every lead says who it is: job seeker, employer or training
- Export to CSV, with spreadsheet formulas neutralised
- New, contacted, placed, closed: one status per lead
- Search by name, phone, job or company
(System)
A backend that fits shared hosting
The client is on shared hosting, so the backend is PHP 8 with SQLite: no database server to manage, no build step, no Composer. It runs wherever PHP runs, and the whole dataset is one folder to back up.
From the build's own documentation
- VisitorSends the form
- APIOrigin, spam trap, rate limits, field checks
- StorageSQLite row; resume outside the web root
- AlertEmail to the team over SMTP
- AdminNew, contacted, placed or closed
- HTML, CSS, JS, no build step
- Three.js 0.186
- GSAP and ScrollTrigger
- Lenis
- Material 3 tokens
- Roboto Flex
- PHP 8.2+ · SQLite
- Hostinger
(States)
Beyond the happy path
- No JavaScript, no WebGL, reduced motionThe film becomes plain stacked text with the same content.
- The jobs feed failsA built-in fallback list, so the board is never empty.
- SpamA hidden trap, plus 8 posts per 10 minutes and 20 a day per network.
- The wrong fileOnly PDF or Word up to 5 MB, checked by content as well as extension.
- A removal requestDeleting a lead deletes its resume too.
- A spreadsheet trapCSV export neutralises formulas in typed cells.
- Too many login attemptsThrottled to 6 per 15 minutes; sessions end after 8 hours.
- Would rather chatThe same details go to WhatsApp in one tap.
(Quality)
Works without the fireworks
Skip link, visible focus, one h1 and labelled sections. Tabs, drawer, carousel and form all work from the keyboard. Counters are hidden from screen readers, which read the final number instead.
Three.js loads after the text, so the headline renders first, and the 3D loop stops once it's off screen.
- Without WebGL or JavaScript
- Same content, as plain text
- Tap targets on phones
- At least 48 px
- Handover
- A go-live guide in Hinglish for the client's team
(What I learned)
Parsley taught me that premium doesn't have to mean harder to understand. The 3D film earns attention, but every section still has one job, and the site still works when the fireworks are switched off.
Need something like Parsley?
Tell me what you want to build. I'll reply with how I'd build it, a rough timeline and a cost range. Free, and no obligation.
Next project
ORA