Designed to inspire additional purchases, the How About These Widget is another AI-powered recommendation tool in InStore, offering accessory suggestions tailored to the items in the basket.
![8-2.png](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/8a3e880f-3383-4377-a408-bc9a7a24682c/8-2.png)
How It Works
![Basket.png](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/ed3b9d71-1ab6-42eb-aee8-995d6183806a/Basket.png)
Powered by our Fashion AI, Sariya, the How About These Widget suggests complementary items relevant to the basket’s contents.
For example:
- If jeans are in the basket, the widget might recommend belts or socks.
- If there’s a hoodie, suggestions could include a beanie or cap.
This intelligent feature ensures customers are offered relevant, thoughtful options to complete their shopping journey.
Quick Add to Basket for HAT Widget
Streamline the shopping process by allowing customers to add items directly from the widget without opening the PDP.
How It Works
![1. Quick Add to Basket button](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/c41c04d5-ba1e-4e8c-a98e-6df15f61fc7f/Basket.png)
- Quick Add to Basket button
![2. Triggering the feature](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/037854a9-4362-4bc9-9cf5-c60cc77d0d60/Basket-1.png)
- Triggering the feature
![3. Interacting with the feature](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/3b24d7ef-2951-47d0-bf29-1d184bcb79c6/Basket-2.png)
-
Interacting with the feature
-
Quick Add to Basket button:
- Located on each product card within the widget, it enables users to initiate the feature.
-
Triggering the feature:
- Pressing the button opens selectors for size, color, and length (if applicable).
- Product media and color name update dynamically when a new color is selected.
-
Interacting with the feature:
- Users can scroll through selectors to choose their desired options.
- Unavailable sizes or lengths are grayed out or marked with diagonal lines, consistent with the PDP.
![4. Making a Selection](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/1f035c71-5a84-4487-80ce-c300608fa70d/Basket-3.png)
- Making a Selection
![5. Adding to Basket](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/4af2f8d3-2754-4c26-b39d-0eaebe488497/Basket-4.png)
- Adding to Basket
![6. Dismissing the feature](https://prod-files-secure.s3.us-west-2.amazonaws.com/0ca57469-11f7-472b-a6a6-0f0d7bac3f53/697bc6f6-5335-4d44-9ec1-6366f867b4a1/Basket-6.png)
-
Dismissing the feature
-
Making a Selection:
- Once a size and length are selected, the Add to Basket button becomes active.
-
Adding to Basket:
- Pressing the button adds the item to the basket.
- The button changes to ‘Added!’ for 3 seconds, then reverts.
-
Dismissing the feature:state.
- After 3 seconds, the modal closes automatically.