[APM] Design review [meta]: ML Correlations UX

[formgeist]

Summary

This is a meta issue containing all related UX and design review notes for the new ML correlations feature in APM. The intent is to go through these issues and proposals with the ML team who are responsible for carrying out the implementation in this first iteration and open separate tickets for the issues we're going to include in this release scope.

Review

Legend

• 📌 TBD for later iteration - see corresponding issue
• ⬜️ Awaiting implementation
• ✅ Done

Initial loading experience of the tab content

1. 📌 I saw this mentioned elsewhere, but the initial waiting on data experience can be improved. One suggestion would be to render the expected containers in the panel, like the chart and tables and show a loading state for both. (Opened [APM] Latency correlations: Display skeleton loaders in place of chart and table for initial loading experience #102981)
2. ✅ We could aim at displaying the overall latency distribution chart and not wait on correlation results as they'd still be loading for some time. (Fixed in [ML] APM Latency Correlations #99905)

Progress bar and reload option

Opened #102984

3. ⬜️ Based on the above suggestion, the progress bar indicating the background loading of correlation results, could be moved to show in the table of correlations instead of being its own progress bar.
4. ⬜️ Move the "Reload" option down near the table of results. The chart above is a reference but the action of reloading should be closer to where the results might change

Table improvements

5. ✅ Do we need the KS-test value? (Fixed in [ML] APM Latency Correlations #99905)
6. 📌 Can we display the correlation value in an indicator like the impact indicator we have on the existing correlations feature? We could opt to show the actual value upon hover, or simply state it next to it in the table. (Opened [APM] Latency correlation: Display correlation value in relative or similarly intuitive representation #102988)
7. ⬜️ EuiBasicTable has an option to focus on a selected row. I think we should use this for indicating we select the first item and focus on this in the chart above. (related previous iteration issue [APM] Correlations: Allow users to focus on one of the items in the table #93907)
8. ✅ Are we paginating the table, and if yes, at how many rows? Would be good to always show the controls so the user is aware that all results are shown. (Fixed in [ML] APM Latency Correlations #99905)

Chart visualization

9. ❌ Will we add additional percentiles? APM typically operates from average (mean), 95p, and 99p. I wonder if these should be included as markers? (Not for the time being)
10. 📌 Will there be a tooltip indicating the values as you hover across the domains, e.g. displaying the duration value even on the x log axis? (Opened [APM] Latency correlations: Explore ways to present metrics for both overall and selected value distributions #102989)
11. ⬜️ Can we decrease the number of labels on the y-axis? If we show too many the log axis is kind of hidden. Additionally, we should display a proper unit label next to the values; "transactions" or "trans." shortened. (Opened [APM] Latency correlations: Show fewer y-axis labels and use unit label for the chart #102990)
12. ✅ Why does it say "9e-7 s" here on the x-axis? (Fixed in [ML] APM Latency Correlations #99905)

Misc

13. ⬜️ Do we need to display a toast when the correlation is done? The loading state and reload button should indicate when the results are complete. Unless there's a reason to show a toast if the results cannot be returned? (To be removed - Opened [APM] Latency correlations: Remove "finished" toast when the background job fetching correlation results is done #102991)
14. ⬜️ We should update the introduction copy to reflect that this is a new algorithm. Basically a new and improved analysis. (The ML tech writers are working on improving the copy)
15. ✅ The flyout size was made bigger - what was the reasoning for that? (Fixed in [ML] APM Latency Correlations #99905)
16. 📌 There was a suggestion of always showing the service name and environment in the flyout? I also think it might be good to reiterate what data the correlation analysis is based on, as we do if any filters are added. Will also become handy when we show the flyout in the context of a specific transaction group. (Opened [APM] Latency correlations: Show service name and environment as metadata in the flyout #102997 awaiting design proposal)

cc @peteharverson @qn895 @sophiec20 @stevedodson @alex-fedotyev @cyrille-leclerc @sqren @ogupte

[elasticmachine]

Pinging @elastic/apm-ui (Team:apm)

[elasticmachine]

Pinging @elastic/ml-ui (:ml)

[cyrille-leclerc]

Table improvement: for the "Field Value", in addition of showing the value that is correlated with the slowness, I would like to see what are the other values that are not correlated with the slowness.

For example, if labels.paymentType=PayPal is an important correlation of slowness, I would like to see that the other values for labels.paymentTypeare Visa and Amex

[formgeist]

@cyrille-leclerc Is this similar to the original request from Luca here? #95272

[cyrille-leclerc]

@formgeist yes

[cyrille-leclerc]

Additional proposals

• "Correlations" column could be a percentage rather than a decimal between 0 and 1 like 0.6557
• "KS Test" column: could it be hidden? What's the user benefit?
• Replace the content of the existing "Latency" tab by this new content instead of introducing a third tab "ML Correlations" next to "Latency" and "Errors"
• Can we clarify our medium term vision of what the user should do next after looking at the "apm trace latency correlations" report? I have in mind that, in my RCA workflow, the "trace latency correlations" report is a step to narrow down the list of distributed traces I want to scrutinize to confirm some hypothesis.

[peteharverson]

Expanding on 7. EuiBasicTable has an option to focus on a selected row having some way to select a row is a should have. Currently the interaction for selecting rows for display in the chart is not accessible is it - only mouseover seems to trigger the selection?

[formgeist]

I've updated the description after our sync earlier today where we went through the items and discussed priority and scope. I've created new issues for the specific implementations and where we need further discussion. You can track the issues by looking at the full list of issues here or follow the links for each of the items above.

@qn895 I think a lot of the open implementation issues may have already been addressed in your PR - could you make sure to reference appropriately so they're closed when the PR is merged? Thank you 😊

I want to specifically call the issue of visualizing the correlation value, which was a hot topic in our sync. I've opened #102988 to discuss further - I would like to get input from others on the team. If we want to have the feature release with an indicator, we should make a decision soon so we have enough time to implement it.

I've opened #102997 to propose a design for showing the service name and environment including the existing query params in a better way. Will work on this tomorrow and hopefully have a proposal ready by EOD.

[formgeist]

Closing this review as most of the issues have been addressed or have separate issues already.