Release Date:

New Features

NEW Cloud UI Product Detail Page

Aspenware is excited to introduce our newly redesigned PDP for Cloud UI. The new PDP leverages Aspenware’s design system and component libraries, which bring a fresh, contemporary look and feel and a consistent, streamlined UX to the shopping pages. All newly designed elements have undergone extensive testing in usability studies and A/B testing.

Simplified Information Flow: We've streamlined the design and organized information more predictably, reducing clutter and scrolling, especially on mobile devices. This involves a linear attribute selection process, eliminating the dynamic box on the right, providing concise access to short and long descriptions, offering an intuitive and detailed item summary, keeping calls-to-action (CTAs) and quantity selections consistently visible on both desktop and mobile and enhancing the clarity of attribute selections with titles and optional descriptions. A/B tests and usability studies have revealed that excessive clutter and mandatory options below the visible screen on shopping pages hinder mobile users, resulting in lower conversions.

Simplified and Data-Driven Add-to-Cart Optimization: The Cloud UI PDP enhances the cart-adding process with a new, user-friendly interface. On mobile, the interface remains visible and straightforward, featuring only the essential call-to-action and quantity selection. For desktop, the add-to-cart button, quantity selector, and item summary stay together and are visible as users scroll. These improvements, informed by successful A/B test results for both mobile and desktop, led to a 9.5% to 16% increase in cart additions using the simplified mobile method. Additionally, there was a 1% to 4% boost in revenue per visitor

Improved Item Summary and Savings: Savings information can be added to more products and highlighted more clearly in the item summary. Advance purchase behavior is rewarded with discounted pricing throughout the shopping experience by highlighting the savings.

Ability to add accurate savings information for non-dynamically priced products: Defining a max price for non-dynamically priced variants enables more robust discount visibility.

Theme Designer and Design System Utilization: The introduction of a design system also comes with clearer guidelines on what can and cannot be customized. This simplifies the development of new themes and ensures a consistently improved user experience across all resort sites. Theme adjustments for these pages can be made on-the-fly with the assistance of your Aspenware Service Agent, without the need to wait for a code deployment.

Optimized components and control types: We’ve introduced easy-to-use control types that require less vertical real estate, are more mobile friendly, and ensure the information that is presented is easily consumable and improves add-to-cart rates. The refreshed components include:

• Radio button

• Drop down (aka Select)

• Checkbox

• Inline date picker

• Drop down date picker

• Item Summary

• Product Description

• Product image

• Item summary

• Add to cart button

• Quantity selection

• Related products

• Coach messages

See the Redesigned PDP for Cloud UI documentation to learn more about this new refresh.

Enhancements

PDP Page Title

A page title now appears when on a Cloud UI PDP within the tab in the browser. This aides accessibility.

PLP (Category Page) Refresh - New Language String

Included in our ongoing visual refresh of the Product Listing Page (PLP), we now offer resorts the opportunity to customize the “Upgrade Your Experience” label that precedes the display of add-on products.

Admin users can edit a configurable language string, product.productattributes.addons.label, which will allow replacement of the default text (Upgrade Your Experience) with custom copy. While the design is responsive, font and size are determined by theme settings, so best practice would be to limit the custom text to a single line.

PDP - Language String for Attributes

new language strings are
productattributes.selectoption - "Select Option"
optional - Optional (parens are added by code, so don’t add parentheses)
required - Required (parens are added by code, so don’t add parentheses)

• 

  • Select Option (Required) is a new language string defaulted to “Select Option (Required)” - unless created via a separate ticket - same language string across control types

  • Product use number of days attribute (can use same product in cycle e when ready): https://qa-current.aspenwarecommerce.net/s/purchase-team-products/p/attributed-product-with-dynamic-pricing-and-simple-add-on-copy (confirmed for qa current- will need to update cycle e if testing there)

• If a date is not required and has not yet been selected, the “Select Option (Optional)” message shows in grey (See Mobile 1.7 for example)

  • Select Option (Optional ) is a new language string defaulted to “Select Option (Optional)” - unless created via a separate ticket - same language string across control types

  • Product use insurance add on attribute (can use same product in cycle e when ready): https://qa-current.aspenwarecommerce.net/s/purchase-team-products/p/attributed-product-with-simple-and-hidden-attributed-add-on (confirmed for qa current- will need to update cycle e if testing there)

Standard Date Picker - Date Selection

If using a standard date picker and you want default text to load before a date is set, like mm/dd/yyyy, add it in the text prompt for start date. Ensure that start and end date settings are set to YYYY-MM-DD.

Resolved Issues

Product-level and Store-wide Cut-off Times

• Previously, on the Cloud UI PDP and Redesigned Calendar, product-level and store-wide cut-off times were not firing on the resort’s timezone, causing products to be unavailable for online purchase prematurely. Now, these cut-off times work as expected, honoring the resort’s timezone on the Cloud UI Redesigned Calendar.

Pricing Calendar Display for Future Dates

• The Redesigned Full-Page Pricing Calendar only displays and enables selection for dates in the month that is being viewed.