The catalog had to support participants with different goals, reward balances, product interests, and browsing behaviors without making enterprise program rules feel like interface friction.
Enterprise loyalty ecommerce · Case file 002
Make the next reward easier to find.
Redesigning product discovery, filtering, comparison, and redemption so loyalty participants can move from available value to a confident choice.Senior Product DesignerFrontend Engineer5–7 minute read
- Product
- Enterprise loyalty shopping and redemption
- Role
- Senior Frontend / Product Engineer
- Core stack
- React · TypeScript · Responsive UI
- Evidence boundary
- Qualitative outcomes · no invented conversion metrics
The project in ninety seconds.
Loyalty participants plus the sponsors, marketers, administrators, and delivery teams supporting them.
Led workflow evaluation, navigation and filtering redesign, reusable React and TypeScript interface patterns, accessibility and responsive implementation, stakeholder review, QA, UAT support, release coordination, and production verification.
Documented qualitative outcomes include clearer discovery, simpler filtering and navigation, a more direct redemption workflow, stronger UI consistency, and higher release confidence. No numeric conversion or engagement analytics were located in the source record.
One continuous decision—not five disconnected screens.
The redesign organized the catalog around the questions participants asked while moving from available value to a confident choice.
- 01
Browse
What is available to me?Clarify catalog structure, balance context, and useful entry points.
- 02
Filter
How do I narrow the field?Make active criteria visible, predictable, and easy to reverse.
- 03
Compare
Which reward fits?Expose reward value, category, availability, and product identity together.
- 04
Redeem
Can I commit confidently?Preserve selection rationale, eligibility, validation, and recovery.
- 05
Verify
Will it survive release?Carry the experience through accessibility, QA, UAT, and production checks.
Evidence followed the decision path.
FindingDiscovery and task hierarchy required clearer visual and interaction priorities.
DecisionOrganize the experience around participant questions rather than platform structure.
FindingBrowse, filter, compare, and redeem form one continuous decision, not separate pages.
DecisionPreserve criteria, value context, and feedback throughout the flow.
FindingFiltering and product card hierarchy carried the greatest daily decision load.
DecisionPrototype reusable interaction patterns before committing to implementation details.
FindingParticipant needs, program rules, and operational maintainability had to move together.
DecisionEvaluate each interface choice across user value, business policy, and delivery cost.
FindingRole behavior, responsive states, and release coordination were part of product quality.
DecisionTreat testing, UAT, and production verification as design evidence.
Four choices carried the redesign.
Make filtering visible and reversible
PressureParticipants need to narrow a large catalog without forgetting why results changed.
ChoiceKeep active criteria observable, easy to remove, and stable as the participant continues browsing.
TradeoffPersistent filter state uses more interface space, but reduces memory load and accidental dead ends.
Turn product cards into decision units
PressureImages attract attention, but reward value, category, and availability determine feasibility.
ChoiceUse a consistent card hierarchy that supports comparison, not just browsing.
TradeoffMore explicit information can reduce visual minimalism while increasing decision confidence.
Preserve context through redemption
PressureA participant should not lose their balance, selection rationale, or eligibility context at commitment.
ChoiceTreat browsing through redemption as one task with clear validation, feedback, and recovery.
TradeoffThe flow needs more state coordination, but avoids making redemption feel like a separate system.
Scale patterns, not isolated screens
PressurePrograms with multiple brands and legacy surfaces make custom UI costly to maintain and verify.
ChoiceImplement reusable React and TypeScript patterns for navigation, filters, sorting, cards, and operational workflows.
TradeoffShared patterns require governance and migration discipline in exchange for consistency and maintainability.
04 / Solution anatomy
The interface helps people decide, not merely scroll.
A product card became a compact decision unit. Persistent criteria reduced memory load. Balance and eligibility stayed visible through commitment. Shared React and TypeScript patterns made the experience more consistent across changing program surfaces.
- Clear category entry points
- Visible, removable criteria
- Consistent comparison hierarchy
- Validation and recovery at redemption
- Reusable accessible controls
Available value42,500 pts
24 rewardsActive criteriaHome ×Under 50k ×Available ×
Release confidence was part of the product outcome.
Verified process
✓ Manual QA and focused release testing
✓ Participant role and permission workflow validation
✓ Feature flag and DEV / PROD verification
✓ UAT support and release readiness review
✓ Responsive, accessible control, and visual regression practices
What I would measure next
→ Instrument browse, filter, compare, detail, and redemption transitions.
→ Run moderated sessions across balance and intent scenarios.
→ Set baselines for task time, recovery, abandonment, and comprehension.
Product discovery
The catalog structure and product hierarchy were redesigned to help participants locate relevant rewards more efficiently.
Filtering and navigation
Patterns were simplified so narrowing and revising a product set became more predictable.
Redemption workflow
The path from browsing to commitment became more direct and easier to understand.
Frontend maintainability
Reusable React and TypeScript patterns strengthened consistency across catalog and administrative surfaces.
Release confidence
QA, UAT support, role validation, and production verification were integrated into delivery.
Behavior and conversion
No numeric analytics were located; conversion, speed, and satisfaction claims remain intentionally unmade.
“The strongest opportunity was not making the catalog look better. It was making the decision easier to navigate, revise, and complete.”
Evidence register and confidentiality notes Open +
Anonymized enterprise work. Client, program, catalog, and participant identifiers are intentionally omitted.
S01Loyalty Shopping Catalog RedesignPrimary case study narrative, scope, role, approach, impact framing, and evidence guardrail.S02Loyalty shopping catalog redesign, Portfolio CMSPublished summary, problem, approach, qualitative outcome, slug, and project tags.S03Rewards PlatformPlatform context, users, risks, architecture, validation practices, release status, and qualitative outcomes.S04Senior Product Designer + Senior Frontend Engineer, 2026Experience scale, responsibilities, tools, delivery practices, and broader enterprise ecosystem context.
Need clarity across product and implementation?
I’m exploring senior product design and frontend engineering roles with teams solving consequential interface problems.