MedaPhysical · Case study

Comprehensive occupational health services.

The MedaPhysical logo in clear 3D
Project overview
A healthcare service website that makes occupational health exams, testing, payment, and booking easier to understand.
Services
  • Discovery
  • Page structure
  • Responsive design direction
  • QA and refinement
Date
June 2024
Client
MedaPhysical
Location
Tampa, FL
Site tour of medaphysical.com: the homepage, two inner pages, the site on phones and the MedaPhysical logo

What the website had to do.

MedaPhysical needed a website direction that made the business easier to understand before a prospect reached out.

LER Web Services shaped the experience around clearer hierarchy, stronger visual trust, and a more direct path to action.

  • 4Core pages, one hierarchy
  • 4Workstreams in scope
  • 1Primary path to contact
  • 2024Launched
Sections of the MedaPhysical website laid out at an angle

What had to change.

  1. The offer needed to be easier to scan for first-time visitors.

  2. The brand needed a sharper first impression without overcomplicating the experience.

  3. Mobile users needed the same clarity as desktop visitors.

  4. The site needed a structure that could support future proof, content, and campaign updates.

  • The homepage scrolling, recorded from medaphysical.com
  • The homepage arriving, recorded from medaphysical.com
  • The main menu, recorded from medaphysical.com

Screens

Every page, one system.

Home, physicals, dot, and screening share one hierarchy, so a visitor moves from the offer to the next step in a few scrolls.

  • The Employment Physicals page scrolling, recorded from medaphysical.com
  • The DOT Physicals page scrolling, recorded from medaphysical.com

The same clarity on a phone.

Most visitors arrive on a phone: the offer, the proof, and the contact action keep the same order on mobile.

The phone menu opening, recorded from medaphysical.com on a phone
The homepage on a phone, recorded from medaphysical.com on a phone
The Employment Physicals page on a phone, recorded from medaphysical.com on a phone

Wireframes

The structure underneath.

The same pages with the styling stripped away: one grid, one type scale, and the same set of components on every route.

MedaPhysical pages drawn as wireframes, laid out at an angle: outlined cards, buttons and fields, grey bars for text, and line drawings of the photos

Visual system.

The site's own palette over the LER paper, Inter for headings, and real screens of the live site instead of stock scenes.

Type · Inter

  • #17233C
  • #5A78B8
  • #8EA6D8
  • #6B778E
  • #EEF2FA

Outcome.

MedaPhysical now has a clearer digital direction for explaining the offer and supporting better inquiry paths.

MedaPhysical is presented with stronger hierarchy, clearer trust cues, and a more direct path for visitors to understand the next step.

How this one came together.

The four steps behind this build, and what each one had to settle.

  1. Discovery

    I clarified the audience, offer, and practical questions the website needed to answer.

  2. Page structure

    I organized the page flow around service clarity, proof, and the next action a qualified visitor should take.

  3. Responsive design direction

    I shaped the visual system and core screens so the experience could stay polished across devices.

  4. QA and refinement

    I reviewed the experience for visual consistency, responsive behavior, and clear paths to contact or purchase.