Back to Works
HP2026-03-16Approx. 1 week

Visiting Nursing Station HP + Recruitment Site

HP and recruitment site for a visiting nursing station focused on nurse hiring. Designed the full recruitment funnel with LINE inquiry flow, online seminars, and job listing filters.

HTML/CSSJavaScriptResponsive Design
Visiting Nursing Station HP + Recruitment Site
Visit Site

Note: Service names, images, and figures in this case study have been replaced with fictional equivalents for portfolio purposes. Details differ from the actual project.

Project Overview

Built the HP and recruitment site for a visiting nursing station. Facing a critical nurse shortage, the client needed a site that both showcases the station's strengths and guides potential applicants through to inquiry or application — all under a single domain.

Client Requirements

  • A site that directly drives nurse recruitment
  • Casual inquiry flow via LINE messaging
  • Promotion of facility tours and online info sessions
  • Design that reassures both patients and families
  • Detailed job listing pages with salary breakdowns

Our Approach

Adopted a navy and gold palette to balance medical credibility with warmth. Analyzed the reference site's UI/UX patterns and implemented equivalent recruitment features: filterable job listings, detailed job pages with sticky sidebars, online seminar pages, and floating CTAs.

Deliverables

5-page structure:

  • Station HP (stats, service overview, staff profiles, access with Google Maps)
  • Recruitment Top (recruitment message, culture showcase, open positions, LINE CTA)
  • Job Listings (role/employment type filters, job card grid)
  • Job Detail (salary breakdown table, qualifications, selection process, sticky sidebar)
  • Online Seminar (seminar details, casual talk info, FAQ)

Key features:

  • Scroll-responsive pill-shaped header
  • Floating CTAs (LINE inquiry + online seminar)
  • Mobile fixed CTA bar (phone, LINE, apply)
  • JavaScript job filtering
  • Google Maps embed
  • Scroll animations and counter effects

Technical Highlights

  • Recruitment funnel design: Staged flow from HP → Recruit Top → Job Listings → Job Detail → Apply/LINE inquiry
  • 3-layer LINE CTA strategy: Floating buttons, mobile fixed bar, and in-section CTAs to minimize drop-off
  • Single-domain integration: Station HP and recruitment site share one domain with seamless navigation
  • 2-column job detail: Detail table + sticky sidebar balancing information density with clear CTAs
  • Responsive design: Optimized across 3 breakpoints (1024px / 768px / 480px)
  • CSS variable architecture: Design tokens for consistent styling across all pages

Timeline

Approx. 1 week (typical agency: 6–8 weeks)