Skip to main content

Review the visual changes

Summary of the changes​

The first page of the test validation, summarize all the involved interaction beheviours from the initial load URL (of the initial starting page), until the end of the e-commerce needed flow.

Valido session review summary related to real case e-commerce validation

This view is pretty useful, the possible actions are:

  1. review the e-commerce flow status, country by country (switching on the specific tab)
  2. review the visualization on different devices (using the devices drop down)
  3. show all the actions, even the accpeted one, using the toggle "show every tested page"
  4. get a visual summary of the changes for each involved action of the current e-commerce flow
  5. get some help, activating inline help
  6. validated in one shot all the actions for the current e-commerce flow

Understand immediately what changed​

The summary gives an instant overview of the changes detected thanks to the visual check executed over each action. The following example highlight differences detected on a cart page about- apparently- prices and shipping charges:

Valido session review summary related to real case e-commerce validation highlighting differences about prices and shipping charges

The validation of the change would be confirmed on the session detail page accessible clicking directly the desired screenshot (from summary page).

Details action by action​

The session review details contain the core feature: the slider allowing the visual validation:

Valido session review details related to real case e-commerce validation

The possible actions on this view:

  1. review the percentage of similarity respect the expected version
  2. the e-commerce page name and the actual action under review
  3. review detailed data about the validation check (brand, operating system of the client, browser adopted by the client, execution time, device and country of the client)
  4. navigate throw the different actions (next and previous)
  5. activatie inline help
  6. zoom in
  7. advanced features
  8. compare, with the slider, the actual version respect to the expected version
  9. validate or reject the rendered changes

The main action​

The main scope of the session details view is to define the nature of the changes detected by the visual validation, for the specific action. One of three possible options are selectable to define why UX changed:

  1. Validate
  2. Reject
  3. Validate with new screenshot

Validate​

Valido session review details related to real case e-commerce validation If the detected changes are expected, the validation button should be selected. Once confirmed, it will generate a new golden screenshot (the baseline) to be taken as expected UX for the following validations.

Reject​

Valido session review details related to real case e-commerce validation If the detected changes are not expected, the reject button should be selected. In this case, it will be not generated a new golden screenshot; the baseline- for the future validation- will still be the old one.

Validate with new screenshot​

Valido session review details related to real case e-commerce validation If the detected changes are expected and, respect the golden screenshot (baseline), represent a variation (probably result of A/B) testion, the validation with new sreenshot button should be selected. It will generate an additional golden screenshot to be taken as expected UX for the following validations (in addition to the existing baselines).