Project Case Study

Customer Advocacy Portfolio

I created this website to turn my experience as a Customer Service Advocate into an experience-first professional portfolio that communicates how I solve difficult customer problems, navigate healthcare support, contribute to team culture, and develop toward leadership.

Role Customer Service Advocate
Project Personal Professional Portfolio
Focus Advocacy + Leadership + Technical Growth
01

The Goal

Create a professional website that shows what customer service advocacy actually looks like when the situation becomes difficult — while connecting my current experience to my future goals in leadership, analysis, quality, and software engineering.

01 / Overview

Why I
built it.

As a Customer Service Advocate, I wanted a way to explain my professional experience beyond a traditional résumé or a list of job responsibilities.

Customer service involves much more than answering questions. In healthcare support, a single customer interaction can involve prescription information, pharmacy processing, claims, benefits, prior authorizations, refills, mail-order logistics, unexpected costs, and multiple steps across a larger system.

I created this website to document the thinking behind that work. Instead of simply saying what my job title is, the portfolio demonstrates how I approach difficult conversations, investigate problems, communicate information, support coworkers, and take ownership of the customer experience.

The website also gives me a place to document my growth as I move toward customer service leadership while continuing to develop interests in business analysis, quality analysis, systems thinking, and software engineering.

✧

I wanted the website to answer a different question than a résumé: not simply "What have I done?" but "How do I think, communicate, solve problems, and support people?"

02 / The Idea

Turning
experience into story.

The central idea was to build an experience-first portfolio instead of a traditional résumé website. Every section was designed to explain the behavior, thinking, and problem-solving behind my customer service experience.

01

Experience

Show the work

I organized the site around real dimensions of customer service instead of simply listing tasks from a job description.

02

Leadership

Show the behavior

I connected everyday customer service behaviors such as accountability, composure, communication, and coworker support to my developing leadership philosophy.

03

Growth

Show the direction

The portfolio connects my current customer service experience with my longer-term development in leadership, business analysis, quality analysis, systems thinking, and software engineering.

03 / Content Strategy

Built around
real experience.

Before designing the interface, I identified the areas of my customer service experience that I wanted the website to communicate.

I intentionally moved away from generic customer service language and organized the content around the situations and behaviors that actually define my work.

  • 01 Customer Experience How I communicate with customers and create clarity.
  • 02 Prescription Logistics How I think through pharmacy, prescription, claims, refill, and delivery-related problems.
  • 03 Member Advocacy How empathy and operational knowledge work together.
  • 04 De-escalation How I approach difficult and emotionally charged conversations.
  • 05 Leadership How accountability, consistency, and support can demonstrate leadership before a formal title.
  • 06 Team Building How encouragement, humor, recognition, and connection contribute to team culture.

04 / Process

How I
created it.

01

Discovery

I started by asking what I wanted an employer, hiring manager, or professional connection to understand about me beyond my job title.

01

Discovery

Identifying the story behind the work

I began by reflecting on my experience as a Customer Service Advocate and identifying the situations that best represented how I work. Rather than treating my role as a collection of responsibilities, I looked for the behaviors underneath those responsibilities.

That reflection helped me identify recurring themes: customer advocacy, difficult conversations, problem-solving, healthcare support, emotional awareness, accountability, teamwork, and growth.

02

Content Architecture

I turned those themes into the structure of the website so visitors could understand both my current experience and future direction.

02

Content Architecture

Organizing the experience

I created a content structure around the different dimensions of my work. The website includes sections for customer experience, human impact, prescription logistics, leadership, team building, professional growth, and systems thinking.

This allowed the portfolio to function as a story rather than a résumé. Each section answers a different question about how I approach my work.

03

Design

I designed the visual experience to feel professional, personal, approachable, and different from a traditional résumé.

03

Design

Creating a professional identity

I used strong typography, visual hierarchy, cards, spacing, subtle motion, theme switching, navigation anchors, and progressive content sections to create an interface that feels like a professional portfolio rather than a static résumé.

The visual direction was also intentionally human. The website needed to communicate professionalism without losing the personality behind the work.

04

Development

I translated the content and design into a responsive interactive website using front-end technologies.

04

Development

Building the experience

I built the website using semantic HTML, CSS, and JavaScript. I created reusable structural patterns for project sections, cards, navigation, buttons, timelines, content blocks, and interactive elements.

The goal was to make the site responsive and accessible while maintaining the visual identity across desktop and mobile screen sizes.

05

Interaction

I added motion and interactive details to make the portfolio feel like an experience rather than a document.

05

Interaction

Making the portfolio feel alive

The website incorporates animated text, background effects, responsive navigation, theme switching, visual reveals, navigation anchors, and interactive project sections.

These interactions were designed to support the content instead of distracting from it. The experience needed to remain easy to understand while still feeling personal and memorable.

06

Refinement

I continued refining the content, hierarchy, responsiveness, accessibility, and overall user experience.

06

Refinement

Testing the experience

I reviewed the website across different screen sizes and considered how someone unfamiliar with my work would move through the portfolio.

This stage helped me refine the balance between storytelling, visual design, navigation, readability, and professional communication.

05 / Technology

How I
built it.

I used front-end technologies to turn my professional experience into an interactive and responsive digital experience.

  • 01 HTML5 Semantic page structure, accessibility, navigation, content sections, and meaningful document organization.
  • 02 CSS3 Responsive layouts, typography, visual hierarchy, cards, animations, theme styling, and visual effects.
  • 03 JavaScript Navigation behavior, interactive elements, theme switching, animations, and dynamic interface functionality.
  • 04 Responsive Design Designing the experience to remain usable across desktop, tablet, and mobile screens.
  • 05 Accessibility Skip navigation, semantic structure, readable hierarchy, accessible controls, and responsive interaction patterns.
  • 06 Content Design Turning professional experience into clear, structured, human-centered storytelling.

06 / Challenges

Problems
worth solving.

The Hurdle

How do I explain customer service as a skill?

A résumé can list responsibilities, but it does not always communicate the judgment, emotional awareness, investigation, communication, and patience required during difficult customer interactions.

→
The Fix

Build the portfolio around behavior.

I organized the site around how I work rather than simply what my job description says. This allowed customer advocacy, problem-solving, leadership, teamwork, and communication to become visible throughout the experience.



The Hurdle

How do I make healthcare support understandable?

Healthcare and prescription support can involve complicated terminology, multiple processes, and information that may be difficult for someone outside the industry to understand.

→
The Fix

Explain the thinking behind the work.

I used plain-language descriptions of prescription logistics, claims, benefits, customer advocacy, and problem-solving so visitors can understand the complexity without needing healthcare industry expertise.



The Hurdle

How do I connect customer service to technology?

My professional experience is customer-facing, while my long-term interests include business analysis, quality analysis, and software engineering. I wanted the connection to feel authentic.

→
The Fix

Use systems thinking as the bridge.

The portfolio shows how customer interactions can reveal workflow problems, communication gaps, process issues, and opportunities for better technology. This creates a natural connection between customer experience and technical growth.

07 / Leadership

What the project
taught me about leadership.

Building the website gave me another opportunity to practice the same behaviors I value in customer service: understanding the audience, identifying the real problem, organizing information, communicating clearly, and continuously improving the experience.

01

Ownership

Taking responsibility

I owned the concept, content strategy, structure, design direction, development, refinement, and ongoing evolution of the portfolio.

02

Communication

Making information clear

The project required translating my professional experience into language that people from different backgrounds could understand.

03

Continuous Improvement

Keep refining

Like customer service itself, the website is designed as an evolving project. As I gain new experience, responsibilities, and skills, the portfolio can grow with me.

08 / Human-Centered Design

I designed it
the way I serve people.

My customer service experience influenced the way I approached the website itself.

In customer service, I think about what the person needs to understand, what may be confusing, and what information will help them move forward.

I applied the same thinking to the portfolio. The visitor should not have to work unnecessarily hard to understand who I am, what I do, what I have learned, or where I am going.

That influenced the navigation, content hierarchy, section organization, typography, responsive design, and the decision to tell the story through experiences rather than through a traditional résumé format.

✦

The website became an extension of my customer service philosophy: understand the person, reduce confusion, communicate clearly, and create a better experience.

09 / Systems Thinking

From customer
experience to systems.

Creating this website helped me recognize how closely customer service connects to technology, workflows, and process improvement.

As a Customer Service Advocate, I see situations where a customer-facing problem may actually be connected to something larger: a process, a system, a communication gap, a handoff, or an unclear user experience.

Building my own website gave me the opportunity to think about those same concepts from the other side. I had to consider information architecture, navigation, user experience, accessibility, responsive behavior, and how individual components work together as one system.

That connection is helping me build a stronger foundation for future growth in business analysis, quality analysis, and software engineering.

✧

Customer-facing experience taught me to notice the problem. Building the website is teaching me to think about the system behind the problem.

What I accomplished

The result: an evolving professional platform.

Created an experience-first professional portfolio
Translated customer service experience into professional storytelling
Documented healthcare customer advocacy experience
Explained difficult conversations and de-escalation
Connected customer service behaviors to leadership development
Created dedicated content around prescription logistics
Documented team engagement and coworker support
Built a responsive and accessible web experience
Developed stronger content and UX thinking
Strengthened front-end development skills
Connected customer experience with systems thinking
Created a platform that can evolve with my career

10 / The Insight

What building
this site taught me.

I started this project wanting a better way to present my customer service experience. I ended up creating something that also helped me better understand how I think about my career.

Building the portfolio forced me to step back from individual tasks and identify the patterns across my work: advocacy, communication, investigation, patience, accountability, teamwork, and continuous learning.

It also showed me that my customer service experience and technical interests are not separate paths. They can complement each other.

Understanding people helps me understand user experience. Investigating customer problems helps me think about systems. Looking for recurring issues encourages process improvement. And building the website gives me practical experience turning those ideas into technology.

✦

The portfolio is not finished in the traditional sense. It is designed to grow as my experience, leadership responsibilities, technical skills, and professional goals continue to develop.

11 / The Perspective

Built around
how I think.

This website represents more than my current role as a Customer Service Advocate. It represents the professional direction I am building toward.

I want to be someone who can understand the person, investigate the problem, support the team, and understand the system behind the experience.

Customer service has taught me how important communication, patience, empathy, accuracy, and ownership are. Building this website has given me another way to practice those same principles while developing my technical abilities.

The result is an evolving portfolio that documents where I am now while creating space for where I am going next.

✧

Understand the person. Investigate the problem. Support the team. Improve the system.

Keep exploring

Explore my customer service journey →

View My Experience