Dr. Sarah Khan — Personal Portfolio Website

I designed and built a personal portfolio website for a fictional physician, Dr. Sarah Khan, as a concept project exploring a question I kept running into: why do most doctor websites feel so impersonal?

Patients choose doctors based on trust before they evaluate credentials. But most medical websites lead with services, not the person. I wanted to design something different: a portfolio that feels calm, credible, and genuinely human, one that helps patients feel informed and comfortable before they ever book an appointment.

This is a self-initiated project. No client brief. I identified the problem, defined the scope, and designed and developed the full experience from scratch.

Most medical websites treat patients like transactions. Services listed, credentials displayed, contact form at the bottom. Very few introduce the doctor as a person.

The problem is that healthcare already creates anxiety. If the first digital touchpoint feels cold or cluttered, trust breaks before it starts. The challenge was designing a portfolio that balanced professionalism with warmth while keeping the experience distraction-free.

I started with the questions patients actually have when they visit a doctor's website:

Who is this doctor?

Can I trust them?

What do they specialize in?

What will my visit be like?

What do other patients say?

How do I book?

Every section in the design exists to answer one of these questions. The page follows that natural sequence: introduction, about, areas of care, what to expect, testimonials, FAQs, booking. No detours.

The visual language was built around reassurance: spacious layouts, soft blue accents, generous whitespace, and large readable typography. Nothing competes for attention. The interface stays out of the way so the content can do its job.

Human-first Hero Instead of leading with credentials, the hero introduces the doctor with warmth and confidence. A large portrait establishes familiarity. The copy communicates empathy before expertise.

Trust Through Simplicity Healthcare already creates anxiety, so the interface intentionally strips away visual noise. Generous whitespace, rounded components, subtle dividers, minimal iconography. Every interaction should feel calm, not overwhelming.

Structured Patient Journey Introduction → About → Areas of care → What to expect → Testimonials → FAQs → Booking CTA. Each section answers the next question a visitor is likely to have. No dead ends, no confusion about what comes next.

Visual System Clean, consistent, and intentionally restrained: 8px spacing grid, rounded cards and buttons, neutral grayscale palette with soft medical blue accent, large typography, and minimal motion. Modern without trying to impress.

After completing the UI in Figma, I built the front-end using Google Antigravity.

The implementation closely follows the original design: consistent spacing, typography, responsiveness, and visual hierarchy are all preserved. I added subtle fade and scale transitions to create a polished experience without distracting from the content.

This wasn't a handoff. I designed it and I built it.

The final product is a complete concept piece: designed, developed, and functional.

It shows how personal branding can work in healthcare when the design prioritizes the patient's experience over visual complexity. Calm layout, clear information flow, and honest copy do more to build trust than animations or stock photography ever could.

For me, this project was about proving that I can identify a real design problem, define the scope, and deliver a complete solution from concept through code, without needing a client brief to get started.