Frontend Customer Dashboard Overview in LoyaltyX

Customers who may not be able to easily check balances, view earning opportunities, or redeem rewards end up abandoning loyalty programs altogether.

Our WooCommerce loyalty plugin automatically provides a unique dashboard that we create in the WooCommerce My Account pages. This dashboard provides customers with total transparency of their points, activity history, redemption, and more through a single, intuitive, and centralized experience.

This tutorial shows you exactly what customers see and how customers will interact with their loyalty account.

Accessing the Customer Dashboard #

Customers access their loyalty dashboard through multiple entry mechanisms:

1. Via My Account Menu: Customer logs into their WooCommerce account, and navigates to the My Account page, and clicks “Points and Rewards” from the left sidebar menu. Once they do this, the full dashboard will load with all loyalty information.
2. Direct URL Access: Customers can simply bookmark the loyalty dashboard URL directly: yoursitename.com/my-account/points-and-rewards/
3. Link from Email: All notifications sent to customers by email (e.g. points earned, points expiring, rewards available) include a direct link to the dashboard so customers can access it in one click.

Dashboard Overview Statistics #

At the top of the dashboard, customers will see 6 key stats displayed on a grid:

Row 1 – Primary Stats #

1. Total Earned Points

• This is referring to total points accumulated since joining to program, lifetime cumulative points.
• This is a measure of engagement with the program’s lifetime.
• There is never a decrease in the amount of total points earned, there can be a decrease in points available to spend, but total earned points will never decrease.

2. Available Points

• These are the total points available to spend.
• This is current and will refresh in real time as points are earned or redeemed.
• Overall, this is the total available specie points, live balance to spend, not total, or cumulative but at that moment available to spend.

3. Redeem Points

• Total points redeemed for rewards.
• This is essentially a measure of the value of reward earned as a result of interacting with the program.
• This will indicate customer value through the redemption of points.

Row 2 – Secondary Stats #

4. Expired Points

• Total of expired points.
• This will only show if the expiration feature is turned on.
• This will help inform customers as a reminder that points can expire.

5. Converted Coupons

• Total of coupons produced as points were redeemed.
• This will merely notify customers how many times they have redeemed to provide to the customer for engagement and so on.
• This measures the frequency of activity of redemption services.

6. Total Referrals

• Total referrals to friends that were successful.
• This will only appear if your referral service is turned on.
• This will display “0” if you have not had a successful referral yet.

Tabs for the Dashboard Navigation #

The dashboard provides a summary of the 6 main tabs below the statistics cards:

Tab 1: Logs (Selected tab by default) #

The activity log tab displays a complete transaction history in a sortable table format:

Table Columns:

• Event: Type of activity (Order Completion, Fixed Discount, Daily Login, etc.).
• Points: Amount that was earned (green with +) or redeemed (red with -).
• Description: Explanation of the transaction.
• Related ID: Order number (clickable link) or coupon code.
• Date: Timestamp.

Features:

• Pagination controls (Previous and Next).
• By default shows 10 transactions per page.
• Lists the activities in reverse chronological order (Recent first).
• There are two colors to show points (Green when earning and Red when redeeming points).
• Related orders are clickable links.

Tab 2: Points to Expire #

Displays points that will soon reach expiration with full tracking history:

Table Columns:

• Event: The activity that earned these points
• Points Earned: Amount of points you originally earned (in green)
• Points Used: The number of points you have used from this batch (in red)
• Date: The date for which you earned the points
• Expires On: Date of expiration
• Status: Either Active (in green), Redeemed (in blue) or Expired (in red)

Features:

• Each earning event will be listed separately
• Shows partial use (i.e., earned +220, used -195, remaining 25)
• This will clarify expiring points to redeem for your planning purposes
• Status will help you self-track if your points remain current
• Will be sorted by expiration (used up first to explain how many expire soonest)

The purpose of this is to help customers prioritize the most valuable points to use before they expire.

Tab 3: My Level #

This shows the level status of your tier with the loyalty program:

Features:

• Large badge/icon that shows your current level (e.g. Diamond)
• The level name with Current Level
• A congratulations message (e.g. Congratulations! You have attained the final level in the loyalty program.)
• Visual badge graphic of the level
• Minimalistic design aesthetic that is clean and recognizes achievement

Notes:

• This will only appear if the Levels & Badges feature is on. Toggle on to display
• It will show you your progress to the next level if you have achieved the final tier
• It can also have approved text of special benefits or perks additions.

Tab 4: Earn #

This “Ways You’ll Earn Points” section shows all of the currently active points earning opportunities.

Display: Cards to present the earning methods in a grid, rather than a list.

Cards will have some combination of the following:

• Graphic/illustrative icon
• Name of the earning method that the company offers (i.e. “Base Earning Rate”, “Welcome Bonus”, “Review Rewards”)
• The amount or rate of points (i.e. “+1 Points for every $10.00 spent”, “+100 Points”)
• A short description of the specifics of how to earn points.
• A call-to-action button (i.e. “Shop Now”, “Sign Up”, “Get Referral Link”, “Claim Points”)
• Additional info icon (?) to display more information.

Here’s a list of example earning methods that might be displayed:

1. Base Earning Rate – earn wrt (with respect to) points per dollar spent
2. Product Bonus – earn points for a specific product/category
3. Welcome Bonus – points for signing up
4. Review Rewards – points for reviewing a product
5. Refer a Friend – points for referral program
6. Daily Login – points for logging in
7. Birthday Gift – points for birthday, or specific date/occasion
8. Level Achievement Reward – points awarded for leveling up

Tab 5: Redeem #

The “Ways You Can Redeem Points” section features all the ways to redeem:

Layout: Your redemption options will display as a grid of cards. Each card displays:

• An icon to describe the type of redemption
• Reward type (e.g. Points to cash conversion, $25 off, Free shipping reward)
• Points required for redemption (e.g. 100 points equals = a $10.00 value, -200 points, -350 points)
• Description of your reward
• Value/Benefit of coupon (e.g. Gain $25.00 discount, 10% off)
• Button to Redeem Now
• Info icon (?) for terms & conditions

Examples of common redemption options:

1. Points to coupon value conversion. This reward allows the consumer to enter the exact number of points they want to redeem and use that value toward a coupon.
   • This includes a calculator input field.
   • Points to dollar or cash value convert to cash output. (e.g. “100 = 10 $(USD)”).
   • The number of points redeemed and output value is flexible.
2. Fixed discount rewards that are preset discount amounts (e.g. “$25 off” or “10% off everything”).
   • The discount amount is assigned a fixed point cost.
   • This is a clear value proposition to the customer.
3. Special rewards such as:
   • Free shipping reward
   • Free T-Shirt reward
   • Buy One Get One Free Reward
   • Single product bundles
   • Exclusive product offering

Benefits:

The cards are organized in a grid view of point range for specific rewards. The cards provide customers with identifiable visual confirmation signifying redemption value, and consumers use the app to get something that has special or perceived value. Rewards can be redeemed with a single click and the terms and conditions are available by info icon.

The overall purpose is to allow the consumer to redeem a reward easily and simply so they can use the points.

Tab 6: Rewards #

Displays the coupon codes generated for the customer and their status:

Columns in the table:

• Code – a unique coupon code e.g. ‘PRW-VKW4Z9PN’.
• Type – a reward type (e.g., free product, points conversion, fixed discount, etc.).
• Created On – the date when the coupon was generated.
• Expiry – expire date (typically displays ‘never’ for coupons that do not expire).
• Status – Active (green), redeemed (blue), or expired (red).
• Action – applies to only the active coupons ‘Apply’ button or ‘N/A’ for redeemed coupons or coupons that have expired.

Features:

• Copy button to simply copy the coupon code with a click.
• An info button to give the user more information about the terms of use.
• The “Apply” button can add a coupon to the cart instantly.
• Pagination if the user has many coupons.
• Clear identification of status.
• Filters redeemed coupons with strikethrough or a different style of font.

Purpose: Rewards management is the area that helps customer review all their generated rewards and apply them easily.

Conclusion #

With the LoyaltyX customer dashboard, customers have the ultimate combination of accessibility, easy navigation, and information utility in one location to drive engagement in your loyalty program. The dashboard puts all points information, earning opportunities, redemption possibilities, and transaction history in one easy-to-find location to help customers track and realize the value of loyalty.

The dashboard gives robust organization to the information through the six-tab structure (Logs, Expiring Points, My Level, Earn, Redeem, Rewards) while the visually prominent statistics cards present key metrics at a glance. In addition, the dashboard creates a seamless user experience through one-click action opportunities for engagement and real-time updates related to transactions and points.