Page Comparison

...

We all know what star ratings are ⭐ ⭐ ⭐ ⭐ ⭐ , preezie has the ability to display them on your journey results page for each product.*

At this stage we do not display the count of reviews, purely the stars displaying the score.

What it looks like:

...

How to implement:

*Please note this only works if your product feed is populated with rating data.

...

1. On the workflow select Actions > Settings > Edit

2. Navigate to the tab UI Result & behaviours

3. Midway down the page find and select the checkbox Show star ratings

   Image Modified

4. Scroll down and click Save.

...

1. Open Test Guide Widget to style here you can add a:

   1. Filled star colour

   2. Empty Star outline colour

2. Couple things to note

   1. Star Rating positioning sits under product name/above price (please see supporting notes for rationale)

   2. Standardised/same sizing cross all devices

Style

1. On the workflow select Actions > Settings > Test Guide Widget

2. Expand the RESULTS tab

3. Scroll and expand the Star rating tab

4. Here you can set the configurations

   1. Filled star colour

   2. Star outline colour

To note

1. Star Rating positioning always sits above price (please see supporting notes for rationale)

2. Standardised/same sizing cross all devices

Behavioural psychology, Kris White - Supporting notes:

...

”Consumer and user research demonstrates a consistent pattern for English readers – from top left to bottom right (See Gutenberg diagram https://vanseodesign.com/web-design/3-design-layouts/ ). Webpages typically create visual hierarchy based on this principle, with the higher order information required to make sense of subsequent information placed at the top.

...