1. Research to Understand

I start by grounding the work in business context, market realities, customer needs, and product goals. I look for signals in existing data and artifacts so decisions are anchored in evidence, not assumption.

Activities

• Content audits and site reviews
• Competitive and comparative analyses
• Heuristic evaluations against UX best practices
• Stakeholder interviews and alignment sessions

2. Listen to Learn

Once the context is clear, I focus on people. I design research activities that uncover goals, motivations, pain points, and mental models through interviews, contextual inquiry, and early evaluation.

Activities

• Research screeners and questionnaires
• One-on-one and small-group interviews
• Contextual inquiry and usability evaluation
• User stories and experience snapshots

3. Synthesize to Define

I translate raw research into clear problem definitions. By identifying patterns in behaviors, needs, and emotions, I help teams align on what matters most and why it is worth solving.

Activities

• Personas and archetypes
• Empathy maps and jobs-to-be-done views
• Mind maps and affinity clusters
• Experience maps and service blueprints
• User needs analysis and opportunity framing
• End-to-end journeys

4. Generate Concepts

With the problem clearly defined, I guide collaborative ideation. The goal is to explore broadly, then converge on the most promising directions before committing to solutions.

Activities

• Brainstorming and sketching sessions
• Cross-functional ideation workshops
• Concept grouping and prioritization
• Problem reframing and “how might we” prompts
• Storyboards and scenario sketches

5. Visualize the Interaction

I turn concepts into tangible flows and structures. By mapping paths, states, and edge cases, I create a shared understanding of how the experience should work.

Activities

• Use cases and task flows
• Wireframes from low to mid fidelity
• User flow and state diagrams
• Site maps and information architecture outlines

6. Communicate the Idea

I evolve sketches and flows into prototypes that communicate intent with the right level of fidelity. These help stakeholders, engineers, and users react to something concrete and actionable.

Activities

• Rapid prototyping in design tools
• Click-through or paper prototypes for early feedback
• AI-assisted or interactive prototypes for realistic behavior
• Visual mockups aligned to the design system

7. Test the Prototype

I validate solutions through lightweight and structured testing. The goal is to uncover friction, confusion, and unmet needs before more development effort is invested.

Activities

• Moderated and unmoderated usability testing
• Card sorting and navigation validation
• A/B or multivariate testing where appropriate
• Guerrilla testing and quick intercept feedback

8. Refine and Repeat

Insights from testing feed directly back into the design. I refine flows, adjust interactions, and revisit assumptions so each iteration moves the product closer to the desired outcome.

Activities

• Prioritize issues by impact and effort
• Iterate designs and prototypes based on findings
• Document learnings to inform future work
• Partner with product and engineering on continuous improvement

Foundations

• Insight: Grounded in evidence and real-world context.
• Empathy: Designed for people, with people.
• Systems Thinking: End-to-end, connected, and scalable.
• AI Acceleration: Smarter workflows. Faster outcomes.

A governed approach to rebuilding and presenting a token-based design system. How design judgment, controlled AI execution, and verification turned a fragmented library into a usable system for design and engineering.

Context: The Starting Point

A robust library existed, but it was hard to use and hard to present. The task was not to replace the system. It was to preserve its intent, organize it, and make it governable.

• Source inventory: Components, variants, and product patterns were piled onto working pages. The source needed protection, not cosmetic rearrangement.
• Inconsistent presentation: Documentation pages lacked a consistent visual model and readable hierarchy for reviewers or future contributors.
• Binding gaps: Raw values and historic styling existed alongside foundations. A blanket “fix everything” pass would have created risk.

The problem was operational: make the system maintainable without breaking the implementation surface.

Strategy

Separate the working library from the presentation layer. Source pages remain accurate. Specimen pages show how the system is intended to be used.

• Source system: Foundations, Components, Patterns. Preserve source structure, variants, properties, and live component relationships.
• Presentation system: Specimens, Read Me, Interview narrative. Use live instances, readable layouts, and clear documentation to explain intended use.

This distinction made the library safer to evolve and easier to demonstrate.

Method: The Governed Delivery Model

AI accelerated execution; human judgment controlled the decisions. Every live mutation was scoped, reviewed, and verified.

The model runs in seven steps: Assess, Propose, Review, Approve, Execute, Verify, Publish.

• Human responsibility: Set standards, approve mappings, decide exceptions, and own publishing.
• AI responsibility: Inventory, propose, execute approved scope, and report verification.

Execution: Buttons Became the Controlled Test

One specimen pattern proved the model before it scaled. Instead of forcing spacing into a component-set boundary, the system used a separate specimen page with live instances and true auto layout.

1. Preserve the source: The 45 Button variants remained in the master component set. No variants were deleted or recreated.
2. Build a specimen: Live instances were organized by size, type, and state inside padded, auto-layout documentation sections.
3. Reuse the pattern: The same documentation-card model scaled to navigation, forms, feedback, and data.

The right fix was structural: source masters for implementation, specimens for explanation.

Normalization: A Controlled Pass, Not Blind Cleanup

Token binding required a controlled pass. An audit separated clear mappings from intentional exceptions. The result was a stronger foundation without visually distorting components.

Bindings clarified: 94 color · 191 typography · 303 spacing · 72 radius (660 total).

• Pilot before scale: A low-risk Cover-page pilot exposed a corner-radius API quirk before it could affect the broader system.
• Exceptions stay visible: Values without a sensible nearby token were retained and documented rather than force-mapped.
• Platform exception: Figma page canvases matched neutral/700 visually; page backgrounds cannot be live-bound to variables.

Quality Control

Verification protected the things users of the system depend on. Each completed pass had structural and visual checks. The point was not merely a cleaner file; it was continued trust in the library.

• Source integrity: Components page remained structurally intact: same 40 top-level nodes and 83 components.
• Live relationships: All 120 specimen instances remained linked to their main components. Nothing was detached.
• State safety: Button focus and semantic strokes were preserved; an obsolete purple root stroke was safely removed.

Verification turned AI output into a reviewable system change, not a leap of faith.

Deliverables

The system now has a usable operating surface and a clear story. The deliverables support both day-to-day design work and an interview walkthrough.

• Foundations: Tokens for color, typography, spacing, radius, and elevation.
• Source components: Preserved masters, properties, variants, and implementation relationships.
• Specimen pages: Readable live-instance references for Buttons, Navigation, Forms, Feedback, and Data.
• Read Me: Usage, governance, maintenance, and engineering-handoff context.

The Figma file is now both a working system and a credible demonstration artifact.

What This Demonstrates

Design-system leadership is more than a Figma skill. It is the ability to set standards, create a practical operating model, and make cross-functional work easier.

• Governance: Changes have owners, guardrails, review gates, and a publish decision.
• Architecture: Foundations, source components, patterns, specimens, and documentation each have a job.
• Engineering readiness: Consistent variables and naming support JSON, CSS variables, and React handoff workflows.
• Responsible AI use: AI accelerates inventory and controlled implementation while humans retain decision authority.

Key Takeaways

A modern design-system process is controlled, evidence-based, and human-led.

• Start with evidence: Audit the product or source library before standardizing it.
• Protect implementation surfaces: Preserve source components; use specimens to explain them.
• Use AI responsibly: Pilot, scope, verify, and document exceptions.
• Show the operating model: The strongest portfolio proof is the judgment behind the system.

Walkthrough: open the Read Me, Foundations, Components, and one or two specimen pages. Explain one tradeoff, one safeguard, and how the system would be owned after launch.

The Live System

The finished system is ready to walk through. Use the live file to make the architecture tangible. These are the actual Colibri system pages: live specimen references and a usage guide, not detached mockups. (Buttons: Specimens; Forms: Specimens; Read Me.)

The story is strongest when the strategy, system, and working artifact can all be shown together.

A continuous improvement model for complex Intel product experiences. Intel product teams needed a more disciplined way to identify high-value UX issues, document recommendations, prioritize improvements, and communicate decisions across product, engineering, and business stakeholders.

Overview

The initiative helped move UX work from isolated fixes toward a repeatable operating model for identifying, prioritizing, and improving product experiences.

Why it mattered: Intel product teams needed a practical way to make continuous UX improvements visible, measurable, and easier to prioritize.

• Product experiences were complex and touched different user groups, technical workflows, and business needs.
• Improvement requests arrived from many channels without a consistent triage model.
• Teams needed a clearer connection between research findings, design recommendations, and implementation priorities.

My contribution: I helped turn fragmented UX feedback into a repeatable improvement model that teams could understand, prioritize, and act on.

• Established a continuous improvement process grounded in user research and measurable UX criteria.
• Conducted interviews, usability reviews, heuristic analysis, and stakeholder alignment sessions.
• Translated user feedback into prioritized recommendations, design updates, and reusable documentation.
• Helped cross-functional teams make better product decisions by connecting UX findings to business and user impact.

Problem Statement

Intel needed a more reliable method for identifying high-value UX issues and turning them into prioritized product improvements.

What was not working:

• Improvement work was often reactive, fragmented, and difficult to compare across products.
• UX issues were identified inconsistently across teams and product areas.
• Support feedback, stakeholder requests, and usability concerns were not always translated into a clear roadmap.
• Teams had limited shared criteria for deciding which UX issues mattered most, and tools for gathering data were fragmented.
• Design recommendations needed stronger evidence, clearer prioritization, and better communication.

The design challenge:

• Create a continuous improvement model that connected research, design recommendations, prioritization, and measurable product impact.
• Make research findings actionable for product, engineering, and business stakeholders.
• Create a practical framework for ranking severity, effort, value, and user impact.
• Build a shared language for continuous improvement across teams.
• Ensure changes could be tracked, communicated, and refined over time.

Design Goals

Create a practical improvement system that helped teams move from subjective requests to evidence-based UX decisions.

1. Improve evidence: Ground recommendations in research, usability patterns, and observed user friction.
2. Support prioritization: Give teams criteria for deciding what to fix first based on impact and effort.
3. Increase transparency: Make UX issues, status, and rationale easier to communicate across stakeholders.
4. Enable reuse: Create methods and templates that could be applied across teams and products.
5. Close the loop: Track whether shipped changes reduced friction and improved the experience.

North star: make continuous UX improvement easier to understand, prioritize, ship, and measure.

Discovery and Research

The work combined research, stakeholder input, expert review, and repeatable documentation to expose the highest-value improvement opportunities.

• Interviews: Discussed product needs, pain points, success criteria, and recurring UX concerns with stakeholders and internal teams.
• Usability reviews: Reviewed critical flows to identify friction, unclear labeling, task interruptions, and inconsistent interaction patterns.
• Heuristic analysis: Evaluated experiences against usability principles, information architecture, content clarity, accessibility, and visual consistency.
• Support signal review: Used known user and stakeholder feedback patterns to identify repeat issues that needed prioritization.
• Comparative analysis: Looked across similar experiences and product patterns to clarify what good looked like and where standards could improve.

Research goal: turn scattered signals into clear, comparable, and actionable product recommendations.

Design Process

A repeatable path helped the team move from discovery to prioritized improvements and stakeholder communication.

1. Understand: Gather research, support signals, and stakeholder input, and usability concerns.
2. Define: Identify patterns, severity, user impact, and business relevance.
3. Prioritize / Design: Compare issues using severity, user impact, and measurable impact; translate findings into IA, flow, interaction, and visual recommendations.
4. Communicate: Package rationale, next steps, and value, and implementation guidance for teams.

Operating Principles

The model was designed to be practical enough for teams to adopt and rigorous enough to support decision-making.

• Evidence first: Use research and observed behavior before opinions.
• Clear criteria: Make prioritization visible and understandable.
• Practical delivery: Translate insight into specific product actions.
• Continuous loop: Measure, learn, and refine after release.

Solution

The solution was a continuous improvement operating model for turning research into prioritized, trackable UX improvements.

Process

• Established an intake and evaluation flow for usability issues and enhancement opportunities.
• Created a shared method for documenting findings, severity, recommendations, and next steps.
• Helped teams connect user pain points to roadmap priorities.

Model

• A decision framework for ranking UX opportunities.
• Balanced user value, business value, effort, confidence, and risk.
• Made tradeoffs easier to discuss with product, design, engineering, and leadership.
• Reduced the chance that design work was driven only by preference.

Enabler

• Reusable templates and communication artifacts.
• Research templates for interviews, usability notes, and evaluation findings.
• Design recommendations translated into concrete IA, flow, and visual updates.
• Follow-up mechanisms to measure whether shipped improvements reduced friction.

Continuous Improvement Framework

The framework gave teams a practical way to evaluate, prioritize, and communicate improvement work.

1. Intake: Capture issue, source, user impact, and business context.
2. Assess: Rank severity, frequency, confidence, effort, and risk.
3. Recommend: Define the design response, rationale, and expected outcome.
4. Track: Follow the issue through delivery and compare results after release.

Measurement and Prioritization

The system connected qualitative evidence to practical prioritization criteria, making UX improvements easier to compare and discuss.

1. User impact: How much friction or confusion the issue created.
2. Frequency: How often the issue appeared across users, tasks, or products.
3. Business value: How closely the issue aligned to product and organizational goals.
4. Effort and risk: How difficult the change would be to design, build, test, and support.

Results and Impact

The initiative helped create a stronger foundation for measurable UX improvement across complex Intel product experiences: clearer UX priorities, better team alignment, and a repeatable improvement loop: shared criteria, cross-functional clarity, research to action.

What improved:

• Created a more disciplined way to identify usability issues, document recommendations, and prioritize product improvements.
• Improved stakeholder alignment by making UX findings easier to understand, compare, and act on.
• Helped shift conversations from individual preference to evidence, user impact, and measurable value.
• Established reusable practices that could support future research, design reviews, and continuous improvement cycles.

Key Takeaways

The project strengthened how design insight was captured, prioritized, communicated, and converted into product action.

1. Evidence created alignment: Research and usability findings made product discussions less subjective and more actionable.
2. Structure improved velocity: A clear operating model reduced ambiguity and helped teams understand what needed to happen next.
3. Reusable practices scaled better: Templates, criteria, and documentation made the approach easier to repeat across other initiatives.
4. UX became easier to measure: Teams had a stronger path from issue identification to implementation and follow-up learning.

Why This Project Matters

This project shows how I approach complex product environments where teams need structure, alignment, and practical design leadership.

• Systems thinking: I looked beyond isolated UI fixes and helped define a model that could support ongoing improvement.
• Research to action: I connected qualitative evidence, heuristic findings, and stakeholder input to concrete product recommendations.
• Cross-functional clarity: I helped make UX priorities easier for product, engineering, and business stakeholders to understand and support.
• Reusable impact: The work created repeatable practices that could continue delivering value beyond a single release.

The Short Version

“This project was focused on creating a more disciplined continuous improvement model for Intel product experiences. The challenge was that UX issues were often identified through scattered feedback, stakeholder requests, and usability observations, but teams did not always have a shared way to compare, prioritize, and act on them. My role was to help structure the process: gather evidence, evaluate severity and impact, translate findings into design recommendations, and make the work easier to communicate across product, engineering, and leadership. The result was not just a set of interface updates. It was a repeatable approach that helped teams move from subjective opinions to evidence-based decisions, making UX priorities clearer, more measurable, and easier to act on over time.”

Close with: “The value was creating clarity in a complex organization, then turning that clarity into measurable product improvement.”

Project focus: Making accessibility guidance usable, repeatable, and easier to adopt at scale. Kaiser Permanente needed a stronger way to help UX designers, developers, and ADA partners apply accessibility expectations consistently. I created a Figma-based ADA documentation library that translated guidance into reusable component documentation, clearer handoff details, and practical training support.

The Problem

Accessibility guidance existed, but it was not easy to apply consistently across teams. The core challenge: teams were solving the same ADA questions repeatedly, often with different interpretations. That created inconsistency, review friction, avoidable rework, and uncertainty during developer handoff.

• Inconsistent interpretation: ADA expectations were applied differently across teams, which increased variability in design and implementation.
• Late discovery of defects: Accessibility issues were often discovered after design decisions had already moved downstream.
• Fragmented documentation: Guidance lived in different places and was not always connected to component usage, states, or content rules.
• Developer handoff gaps: Implementation intent was not always clear enough for developers to preserve accessibility decisions during build.

The issue was not a lack of intent. It was a lack of repeatable, visible, and practical guidance inside the design workflow.

The Product Opportunity

Turn accessibility guidance into a reusable design system asset: make the compliant path the easiest path.

• Before: One-off ADA reviews, repeated questions, scattered guidance, and design decisions that became harder to protect during implementation. High review dependency, inconsistent component usage, unclear implementation details, more rework downstream.
• Solution direction: A centralized Figma-based ADA documentation library with component usage rules, state guidance, content notes, and developer handoff details.
• Outcome: A repeatable system that helped teams make better accessibility decisions earlier: practical guidance in the design tool, reusable documentation patterns, clearer UX and dev alignment, training and rollout support.

My Role and Responsibilities

Principal Product Designer leading structure, documentation strategy, and rollout support. This was equal parts UX strategy, accessibility operations, design systems thinking, and hands-on documentation design.

Design leadership:

• Defined the UX structure and documentation model for the ADA component library.
• Partnered with the Director of the ADA team to establish scope, standards, requirements, and review criteria.
• Identified reusable component guidance needs with UX, development, product, and accessibility partners.
• Created practical Figma documentation patterns for usage, states, content rules, ADA notes, and implementation handoff.
• Supported communication, training, adoption, and ongoing library maintenance planning.

Operating reality:

• Large healthcare ecosystem with multiple teams, products, stakeholders, and delivery cadences.
• Guidance needed to work for designers, developers, ADA reviewers, product partners, and leadership.
• The library had to fit into existing workflows rather than create a new process burden.
• Documentation needed enough detail to improve quality while staying simple enough for adoption.
• Content had to be maintainable as guidance, components, and standards evolved.

Process

A six-week structure for alignment, requirements, pilot feedback, and rollout planning. Process intent: create enough structure to scale accessibility guidance without slowing teams down.

1. Understand: Stakeholder identification and current-state review across UX, ADA, development, product, and leadership.
2. Define: Requirements, priority components, documentation model, acceptance expectations, and governance needs.
3. Design: Figma documentation structure, component guidance patterns, ADA notes, content rules, states, and handoff details.
4. Test: Pilot feedback with key users; refinement of terminology, structure, and level of detail.
5. Roll out: Training material, communication plan, adoption support, and maintenance approach.

Library Structure

The documentation system was designed around what teams needed to know at the moment of use. The library was built as a decision-support tool, not a static reference document.

• Usage guidance: When to use the component, when not to use it, and how to avoid misapplication.
• States and interactions: Required behavior for focus, hover, disabled, error, keyboard access, and other interaction states.
• Content rules: Labeling, helper text, error messaging, and language guidance to support comprehension.
• ADA notes: Accessibility rationale, key requirements, and considerations connected to component behavior.
• Developer handoff: Implementation intent and details needed to preserve accessibility decisions during build.
• Training support: Reusable education material to help teams adopt the library consistently.

Adoption Strategy

A documentation library only works if teams can find it, trust it, and use it repeatedly. Key insight: adoption had to be designed with the same care as the component guidance itself.

• Audience: UX designers, developers, ADA professionals, product partners, leadership stakeholders.
• Adoption plan: Start with high-impact components where recurring ADA issues were most common. Pilot the structure with key partners and refine based on real feedback. Pair the library with training material to explain both the what and the why. Create a communication plan so updates could be introduced consistently.
• Feedback loop: Collect design and development feedback. Clarify ambiguous guidance. Update examples and documentation patterns. Keep library ownership and maintenance visible.

Results and Impact

The library improved quality, consistency, and confidence across design and development.

• 30%+ reduction in ADA defects: Fewer accessibility defects created by development teams after guidance became clearer and more reusable.
• Increased Figma adoption: Teams had a centralized place to reference ADA guidance and training material.
• Stronger UX–dev alignment: Handoff improved because component intent, states, and implementation details were easier to understand.
• Scalable ADA communication: The ADA team had a more durable way to communicate standards and recurring recommendations.

Business value: The work moved accessibility upstream, reduced repeated questions, and helped teams prevent avoidable issues before they became delivery risks.

Why This Project Matters

This case study shows how I approach complex enterprise design problems.

• Systems thinking: I treated accessibility as a product system that needed reusable patterns, clear ownership, and a path to adoption.
• Practical design systems work: I created guidance that was useful in real workflows, not just documentation that looked complete.
• Cross-functional alignment: I connected ADA leadership, UX teams, developers, product partners, and stakeholders around shared expectations.
• Outcome orientation: I tied the work to measurable operational value, including fewer defects and stronger adoption.

Accessibility succeeds when the right guidance is embedded into the workflow, not buried in separate documentation.

The Short Version

“At Kaiser Permanente, I built an ADA Documentation Design Library to help product teams apply accessibility guidance more consistently across digital experiences. The problem was that ADA recommendations were often handled through repeated one-off reviews, which made guidance harder to scale and increased the chance of inconsistent implementation. Designers needed practical guidance inside Figma, developers needed clearer handoff details, and the ADA team needed a better way to communicate standards across teams.

I partnered with ADA leadership, UX stakeholders, developers, and product teams to define requirements, identify recurring component issues, create a reusable documentation structure, and pilot the library before rollout. The solution brought component guidance, usage rules, states, content notes, and developer implementation details into a centralized Figma-based system.

The result was a more scalable way to support accessible design decisions, stronger alignment between UX and development, increased Figma adoption, and more than a 30 percent reduction in ADA defects created by development teams.”

Best framing: An accessibility operations and design systems project that improved quality, consistency, and delivery confidence.

Project focus: A single destination for authenticated KP.org members. Kaiser Permanente needed a modern global navigation experience that could organize 90+ authenticated features, support regional and profile variation, and make high-value healthcare tasks easier to find.

Problem Statement

Authenticated KP.org had grown into a complex ecosystem, but the navigation model had not kept pace with member needs.

What was not working:

• Members could reach critical healthcare tasks only if they already knew where to look.
• High-value tasks were dispersed across authenticated pages and product areas.
• Members had to rely on memory, search, or multiple clicks to locate common actions.
• Regional, proxy, profile, and capability differences made one-size-fits-all navigation unrealistic.
• New programs needed a scalable destination that would not fragment the experience further.

The design challenge:

• Create one global navigation system that felt simple to members and flexible enough for enterprise complexity.
• Organize 90+ tasks and features into intuitive categories and submenus.
• Support regional, membership, proxy, and profile-based variation.
• Improve task access and confidence while reducing cognitive effort.
• Create a model that could evolve as KP.org added new authenticated capabilities.

This was not just a header redesign. It was an enterprise information architecture and service-access challenge.

Discovery and Research

Research combined behavioral data, structured evaluation, team workshops, and direct user feedback to reduce launch risk.

1. Tree testing: Validated whether members could find key tasks within the proposed IA and category model.
2. Design workshops: Aligned stakeholders around task groupings, naming, regional needs, and feasibility.
3. Usability testing: Observed whether users could locate high-value tasks, understand labels, and recover from ambiguous paths.
4. User interviews: Gathered qualitative context around how members think about benefits, care, pharmacy, billing, records, and appointments.
5. A/B testing: Compared the new navigation against legacy patterns to evaluate engagement and task completion changes.
6. Comparative analysis: Reviewed healthcare, financial, and large authenticated service ecosystems for scalable navigation patterns.

Discovery moved the team from opinion-based navigation debates to evidence-informed decisions about categories, labels, priority tasks, and launch readiness.

Design Goals

Create a navigation model that was useful, scalable, and flexible enough for Kaiser Permanente complexity.

1. Improve task access: Give authenticated users faster access to high-value tasks and commonly used features.
2. Support scale: Organize 90+ features into structured menus without creating a dense or intimidating experience.
3. Increase confidence: Make the system feel predictable, clear, and connected to the user's authenticated context.
4. Respect variation: Support regional, membership, proxy, and profile-based differences without separate navigation models.
5. Enable extensibility: Create a foundation where new capabilities, including MyChart Evolution, could be added later.

North star: help members reach the right healthcare task faster, with fewer missed paths and less cognitive effort.

From Research to Design Decisions

The findings directly shaped the navigation model, taxonomy, and launch strategy.

• Members needed faster access to common tasks → Prioritized a drop-down global menu with one-click access to high-value tasks.
• Task labels needed to match member language → Refined category names and link labels to reduce ambiguity and improve confidence.
• Regional variation could not be ignored → Built a flexible model that could show or hide features by region, profile, and capability.
• Legacy paths created extra cognitive effort → Grouped related tasks into structured menus and submenus to make scanning easier.
• New programs needed future placement → Designed the model to support future additions without redesigning the entire navigation system.

Before and After: The Solution Model

The new model shifted KP.org from a narrow header pattern to task-oriented menus tied to authenticated member needs.

Before: legacy navigation

• Limited pathways at the top level.
• Common authenticated tasks were buried deeper in product areas.
• The structure did not easily expose the breadth of KP.org capabilities or regional variation.

After: authenticated global menu

• Task-oriented menus expose common actions directly from the authenticated header.
• Supports region, profile, and capability variation without separate models.
• Creates clearer paths into pharmacy, care, benefits, billing, and MyChart tasks.

The Final Experiences

Desktop: The desktop pattern gives members a clear, contextual menu while preserving the KP.org header, search, account, language, and region controls. The task structure becomes visible without overwhelming the member or breaking authenticated context.

Mobile: The mobile model kept the experience focused, readable, and task-oriented for smaller screens.

• The mobile experience needed to support the same information architecture while respecting touch targets, screen constraints, and healthcare task urgency.
• Large, readable type and clear link spacing for scanning and touch interaction.
• A focused back-and-close pattern that keeps members oriented inside the menu.
• Task groupings make care, benefits, pharmacy, messaging, and appointments easier to find.
• The model preserves user context for the authenticated member or proxy profile.

Solution Details

A global navigation model that balanced usability, scale, governance, and enterprise delivery.

• Task-first structure: Organized features around the actions members were trying to complete, not internal team ownership.
• Context-aware menus: Supported menu variation by region, membership, proxy state, profile type, and feature availability.
• Scalable taxonomy: Created a structure that could absorb new services and programs without redesigning the header.
• Cross-functional alignment: Aligned UX, product, engineering, analytics, accessibility, regional teams, and stakeholders.
• Launch readiness: Supported go-live planning with measurement, communications, feedback tracking, and iteration.
• Future extensibility: Prepared the model for MyChart Evolution and additional authenticated KP.org capabilities.

Value and Success Measures

The launch showed measurable improvement in navigation engagement and task completion, while creating a more extensible foundation.

• 65% lift in navigation engagement (compared to legacy)
• 4 bp task completion increase (measured after launch)
• 90+ features organized (across menus and regions)

What the metrics suggested:

• Members used the new navigation experience to access a broader range of tasks and features with less friction.
• Engagement increased significantly compared with the legacy experience, indicating stronger discoverability and utility.
• Task completion improved, suggesting that the model helped reduce missed paths for key authenticated journeys.
• The solution provided a scalable foundation for future KP.org capabilities rather than a one-off navigation update.

Voice of Customer Feedback

Post-launch comments reinforced that members noticed the improved access, structure, and usefulness of the new menu.

“Drop-down menus with line-item info per subject excellent. Scheduling improved. General ease of use improved.”

Customer survey feedback (General improvements)

“Thank you for changing the names of the tabs at the top of the page to something more logical.”

Customer survey feedback (Task access)

“Good improvement to website putting the menu items at top of the workspace where I can see them.”

Customer survey feedback (Discoverability)

Key Takeaways

What this project demonstrates:

• Strategic UX: Solved a discoverability and information architecture problem inside a complex healthcare ecosystem.
• Research-led decisions: Tree testing, usability testing, interviews, workshops, A/B testing, and comparative analysis guided the model.
• Measurable impact: Increased navigation engagement by 65% and improved KP.org task completion by 4 basis points.
• Scalable foundation: Created a flexible structure for future authenticated KP.org capabilities and regional variation.

This is the kind of work I enjoy most: taking complex systems, aligning teams, validating decisions with research, and creating product experiences that are easier for real people to use.

Project focus: Turning seasonal buying into year-round subscriber relationships. Harry & David's financial success has been linked to seasonal buying for the past ten years. A subscription program was introduced as one of several efforts to help bring in more sales during the off season, giving customers an easy way to keep their favorite gourmet items on hand.

About Harry & David

Premium gourmet brand inside a ten-brand, e-commerce-led portfolio.

The business:

• Harry & David is owned by 1-800-Flowers and is one of several brands under its umbrella.
• Harry & David's primary source of income is generated through website sales.
• Product pages are considered a high priority and are the focal point in the purchase decision process.

My role:

• Joined Harry & David as a Senior Interaction Designer, one of two Interaction Designers in a company with 18 brands and a rudimentary UX culture.
• Supports design across every aspect of the business and is responsible for leading UX and UI efforts across all brands.
• Has stepped into a variety of UX roles, often taking on the function of Product Designer, as on this project.

Four Years at Harry & David: Key Achievements

Highlights from growing the UX practice across an 18-brand portfolio.

1. Implemented Design Process: Helped the team establish more structure in how design work is conducted and gave other teams visibility into upcoming sprints.
2. Improved Usability Across Brands: UX research and usability testing are now supported on all projects, backed by a fully established center for excellence.
3. Established a Design System: Helped Engineering and Marketing teams understand how and why certain components are chosen over others.

Defining the Problem: Top Considerations

The first task was identifying project goals and how a new subscription product would integrate into the existing experience.

1. Impacted Sections: A new model would touch checkout, product pages, and legal. Several areas of the site would be affected; a complete understanding of impact was critical. This would require changes to the checkout system and informed a review of how Amazon handles subscriptions. A product landing page was needed, plus a way to visually flag subscription-eligible products on product list pages. The biggest challenges on this project would be the planning and the legal process.
2. Differentiation: With an extensive product catalog, subscription-eligible items needed to be easy to differentiate.
3. Functional Requirements: What could be built now versus what would need to wait for a later phase.
4. Legal Requirements: Terms and Conditions placement required close, early work with the legal team.

Building the Team: Planning

Behavioral data justified the redesign; the next step was assembling a diverse, cross-functional team.

1. Team Formed: Recruited a Visual Designer, Lead Developer, Interaction Designer, Marketing Manager, and Customer Service Manager.
2. Setting The Pace: Scheduled a kickoff meeting to align the team on goals and ways of working.
3. Setting Deliverables: Produced a project plan spanning eight weeks from kickoff to delivery.
4. Leading The Effort: Set the agenda for meetings; the team produced mind maps, traffic flow charts, and discussed element positioning.

Management was very supportive of the effort: assembling a diverse team was critical to the project's success.

Methodology: UX Process

Work at Harry & David follows the Double Diamond and Lean UX process: Discover, Define, Ideate, and Implement.

Discovery: Research Overview

Comparative analysis was the key research tool, since the solution needed to work for all brands under the 1-800-Flowers umbrella long term.

1. Contextual Inquiry Interviews: Interviewed participants within the key persona demographic to understand real reactions to a subscription model.
2. Comparative Analysis: Reviewed 20+ companies with subscription programs for inspiration, and for what not to do.

Amazon was the only directly comparable company operating in a similar multi-brand space.

Research Findings: Contextual Inquiry

The interviews surfaced far more insight than initially expected. (Sentiment captured during interview sessions.)

• Initial Thoughts: Participants loved the idea. The concept of not being required to re-order every year was appealing.
• Offer A Discount For Sign-Up: Three out of five participants said they would be more inclined to sign up if a discount was offered.
• Cancellation Concerns: Two participants were concerned that cancelling a subscription might prove difficult.

Research Findings: Comparative Analysis

Reviewing twenty companies surfaced patterns in best-known methods, functionality, and layout.

1. Challenges: Few comparable companies existed in this space. Of twenty reviewed, Amazon was the only comparable company in the multi-brand space.
2. Discounts For Signing Up Are Common: Most companies reviewed provide a discount for signing up for a subscription.
3. Legal Terms Position Is Subtle: Terms and Conditions placement was typically located in checkout or close to the product page call to action.
4. Keep It Simple: Some companies' subscription options were confusing, since they weren't clearly identified as an ongoing commitment.

From Research to Design: Design Process

With research complete, the team moved into wireframing the product page update, checkout, and subscription landing page.

1. Team Workshop: Scheduled and attended a workshop with the team. Created low-fidelity wireframes.
2. Legal Requirements Checkpoint: Produced low-fidelity wireframes for the Legal department covering terms placement and comparative-analysis context. Approved after two weeks.
3. Polishing The Wireframes: Moved from low-fidelity to hi-fidelity wireframes. One final review meeting and the wireframes were approved.

Design: Product Page

The key goal at this point was to identify how this new design would perform. Visual Scent: a continuous-shipping icon. Value Proposition: “Make this a recurring Shipment” copy, with Frequency and Duration giving a quick reference to how the program works; the selector's drop-down provides cancellation guidance.

Design: Subscription Landing Page

A dedicated destination makes it easy to browse every subscription-eligible category in one place. Visual Scent and Value Proposition copy carry over from the product page, giving customers a quick reference to how the program works.

Design: Checkout Update

A basic update added delivery frequency to checkout to avoid any confusion for the customer. Each line item in the order summary clearly states its delivery cadence: a one-time shipment versus a recurring subscription.

Validation

The key goal at this point was to identify any usability concerns before launch. What we validated:

• Additional Testing: Is the value proposition producing interest? Do customers understand how the program works?
• Performance: Is conversion on track?

The responsive experience was validated across desktop and mobile. The best feeling is knowing your efforts have made a difference.

Impact: Results

Results are still coming in, but the early data is encouraging. ($5–8M projected additional sales, 2020 holiday season.)

1. Customers Are Responding Well: Customer feedback surveys show customers are very happy with the subscription offering.
2. Projected Sales: Forecast is in line with current product offerings, as conversion tracks alongside existing performance.
3. New Functionality Coming: Phase 2 of the subscription program is already underway, adding new functionality like skip, pause, and change frequency of delivery.

What's Next: Subscription Requirements, Phase 2

Mapping the system triggers behind each new piece of functionality: pause, skip, change frequency, cancellation, payment, and recipient updates. Each interaction was mapped against its system triggers (billing cycle impact, customer notifications, and edge cases) before development began.

Reflection: What I Learned

Always think of how a design may impact the entire experience. This was a key takeaway.

• Legal Timing: Get with Legal as early as possible. Reviews can take time.
• Plan Ahead: Think ahead and plan for future functionality early. It's easier to document ideas in the middle of a project when it's fresh in mind.
• Patience With Results: Results don't always present early. Continue to be patient, if the customer experience is positive, favorable results will follow.

Key Takeaways

What this project demonstrates:

• Strategic UX: Solved a cross-functional commerce challenge inside an 18-brand e-commerce ecosystem.
• Research-Led Decisions: Contextual inquiry interviews and a 20+ company comparative analysis guided the model.
• Measurable Impact: Forecast of $5–8M in additional sales for the 2020 holiday season, with strong early customer response.
• Scalable Foundation: Created a flexible structure ready for Phase 2 functionality: skip, pause, and change frequency.

This is the kind of work I enjoy most: taking complex systems, aligning teams, validating decisions with research, and creating product experiences that are easier for real people to use.