# Design
source: https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/index.md

A best-in-class consumer experience when designing Pay with Rewards includes access to:

* The full UX product journeys
* A diagram of the end to end consumer experience or flow diagram
* The moments that matter or key consumer highlights in the product journey   

![Experience prototype](https://static.developer.mastercard.com/content/pay-with-rewards/uploads/prototype.svg)

### Experience prototype {#experience-prototype}

View the reference prototype to get a glimpse of the happy path

<br />

[Open prototype](https://www.figma.com/proto/gPuTo9fZhMTBxSa7eZV3nR/PWR-Prototype?page-id=0%3A1&node-id=1-82760&viewport=-1531%2C-2210%2C0.32&t=8TtYZWOMQbMeAFZt-1&scaling=scale-down&content-scaling=fixed&starting-point-node-id=1%3A82760&fuid=1316298999584552659)
![Figma file](https://static.developer.mastercard.com/content/pay-with-rewards/uploads/figma.svg)

### Figma file {#figma-file}

Find the end-to-end product experience for all use cases to duplicate and customize in your own environment

<br />

[Access file](https://www.figma.com/design/C4yKUgg7IQ7b3FaFQ9S92h/PWR-Guide-Final-Journeys?node-id=4-26&fuid=1316298999584552659)
![Figma theming guide](https://static.developer.mastercard.com/content/pay-with-rewards/uploads/figma-theming-pre2.svg)

### Figma theming guide {#figma-theming-guide}

Apply your brand's font and colours in a few simple steps to fully customize the product experience.

<br />

[View guide](https://www.figma.com/proto/8WQ6mCYIP4pvUgoILgSB7v/Figma-Theming-Guide?page-id=0%3A1&node-id=1-2232&viewport=364%2C170%2C0.45&t=R00guWiCk30s5tXf-8&scaling=scale-down-width&content-scaling=fixed&hide-ui=1&fuid=1316298999584552659)

### UX journeys {#ux-journeys}

**Redemption Options**
[Pre-Purchase Redemption](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/redemption/pre-purchase-redemption/index.md)   
[Post-Purchase Redemption](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/redemption/post-purchase-redemption/index.md)   

**Settings and Help**
[Card Switching](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/settings-and-help/card-switching/index.md)   
[Notifications](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/settings-and-help/notifications/index.md)   
[Help](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/settings-and-help/help/index.md)   

**White Label Mobile App**
[Onboarding](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/white-label-mobile-app/onboarding/index.md)   
[Add a New Card](https://developer.mastercard.com/pay-with-rewards/documentation/experience-design-guide/design/white-label-mobile-app/add-new-card/index.md)