Paramount Asia
PASIA Recruitment Portal · Homepage Directions
Internal review · July 2026
For review · 3 directions + foundations

Three homepages.
One brand. Pick the base.

A ground-up build of the Paramount Asia recruitment portal. Every direction shares one design system – the badge's deep-green mountain identity, a single gold accent, Fraunces + Inter, and a warm, calm canvas – trilingual-ready for EN · 繁 · 简. What changes is how the tokens are spent. Click through, react with your gut, then we tighten the winner.

3
Homepage directions to review
1
Shared design system & component kit
1
SEO & GEO playbook
~5 min
To click through everything
How to use this review

Feel the mood, not every word.

Open each direction below in a new tab. Don't read line by line – react to the overall feel. Copy is placeholder, pricing shows $X,XXX ranges, and photos are stock stand-ins. Note what you'd want more of, less of, or borrowed across directions – we combine the winning moves into the final build.

Homepage directions

Pick one base – we refine from there.

Same system, three theses. Topbar, footer, and the mountain hero identity stay consistent across all three so they read as one brand; the structure underneath carries the personality.

Direction A

Trust-led & editorial.

The institution speaks first. Licence and accreditation chips in the hero, a director's note, kind words from Hong Kong families – then services and helpers. The quietest, most credibility-forward lane; closest to "rooted in trust".

Visual mood
Editorial · calm · institutional
Hero
Type-led, trust chips
Signature moment
Director's note + testimonials
Best for
Brand authority & referrals
Licence trust chips Director's note Editorial services list Testimonial cards Quiet helper strip
View Direction A
PASIA · Direction A preview
Hover to scroll the preview ↓
Direction B

Search-forward.

The portal is the product. A search panel with filters sits right in the hero, live helper cards appear immediately, and everything downstream backs the shortlist – how it works, the trust band, pricing, then booking. The most conversion-driven of the three.

Visual mood
Energetic · practical · premium
Hero
Search panel + filter chips
Signature moment
"Available now" results grid
Best for
Self-service & conversion
Hero search panel 6 live helper cards Quick-filter chips FINAS pooling split 3-step strip
View Direction B
PASIA · Direction B preview
Hover to scroll the preview ↓
Direction C

Guided & service-led.

For employers who want to be guided, not to browse. The hero asks one question – "What do you need to do?" – and answers with three paths: Hire, Renew, Transfer. Then a four-step process, published price ranges, and the consultation scheduler. Concierge clarity.

Visual mood
Calm · concierge · clear
Hero
3 path cards (Hire / Renew / Transfer)
Signature moment
Booking scheduler + 4-step process
Best for
First-timers & guided buyers
3 path cards Mock scheduler 4-step process 6 service cards FAQ accordions
View Direction C
PASIA · Direction C preview
Hover to scroll the preview ↓
Foundations

The system every page is built from.

The design system and the search rulebook. Whichever direction you pick, these stay the shared backbone – and the inner pages come next.

Design system

The deep-green mountain identity and gold accent, Fraunces + Inter, colour tokens, the HK-style helper card, rate cards, and motion rules. Mirrors css/tokens.css.

Open design system →

SEO & GEO playbook

How the portal gets found on Google and in AI answers – trilingual hreflang strategy, local SEO with EA-licence trust signals, and EmploymentAgency / JobPosting / FAQ schema.

Open playbook →

Coming next

Once a homepage base is picked, the inner templates follow on the same system:

  • Helper search results + filters
  • Helper profile page
  • Services & transparent pricing
  • Consultation booking flow
  • 繁 / 简 language variants
Side by side

At a glance.

Dimension
A · Trust-led
B · Search-forward
C · Guided
Mood
Editorial · institutional
Energetic · practical
Calm · concierge
Hero
Type-led + trust chips
Search panel + filters
3 path cards
Helper cards
Quiet strip, mid-page
6-up grid, right under the hero
Quiet strip, late
Pricing
Teaser, 3 rate cards
Teaser, 3 rate cards
Full section + "From $X,XXX" chips in hero
Consultation
CTA band
CTA panel beside testimonial
Scheduler teaser with date & time pills
Best for
Brand authority & referrals
Self-service & conversion
First-timers & guided buyers
Our steer

Don't pick. Borrow.

You don't have to ship just one. Choose the dominant direction that gives the right first impression, then borrow the moves from the others that punch above their weight.

If you want a starting point: B as the base – the self-service search is the portal's signature feature, so lead with it – with A's trust framing (licence chips and the director's voice early), and C's three-path clarity and scheduler so first-timers who don't want to browse still see their route in one glance.

If we had to pick one
B, rooted in A's trust
  • Search-forward hero & live helper grid from B (the base)
  • Licence trust chips + director's note from A
  • Hire / Renew / Transfer path row from C
  • Scheduler teaser from C on the booking page
  • Transparent $-range rate cards across all three