Transactions drill-down page re-design

[nehaduggal]

Summary of the problem (If there are multiple problems or use cases, prioritize them)

Our current transaction drill-down page abstracts away a lot of the information from the users. For e.g. users can only visualize a subset of transaction traces collected, request metadata is hidden in another tab and subsequent drill-downs to logging/metrics UI requires a user to navigate outside of the APM app which can lead users to lose context. A better transaction drill-down experience will help our users to get to the root cause much faster. In addition, surfacing interesting metadata that can potentially surface root cause will help drive down MTTR.

User stories

• As a SRE troubleshooting an application performance issue tied to a transaction group I want to view the corresponding trace log data within the context of the distributed trace. I also want to easily compare the logs of the distributed traces I look at.
• As an Dev/DevOps/SRE troubleshooting errors thrown by a service I am monitoring, I want to be able to visualize all linked errors thrown by the trace being investigated. Visualizing these errors will help me in quickly navigating to the errors.
• As a Dev/DevOps/SRE troubleshooting slow transactions, I want to be able to compare a subset of my slow transactions to transactions with average response times to see if there is any common denominator that is causing the transaction to perform poorly(underlying infrastructure, a specific user tag/label, service version etc.)
• As a Dev/DevOps/SRE troubleshooting slow transactions, I also want to understand how much time into a trace a span was invoked/run. This is especially helpful in longer traces with. lots of spans.

List known (technical) restrictions and requirements
For example: has to be scalable from 0-15k containers

If in doubt, don’t hesitate to reach out to the #observability-design Slack channel.

[elasticmachine]

Pinging @elastic/observability-design (design)

[formgeist]

Copied from #302

Design update - Dec 22, 2020

I have been meaning to share a design update for a while on this project since it's been developing quite fast over the past months or so. We have been polishing a POC implementation of the significant terms which is available in 7.11 (feature-flagged). Additionally, we have been redesigning basically all of the Transactions views to align them with the new Service overview, and add new capabilities beyond just the significant terms feature, but also new distribution charts and a dedicated trace view.

The placeholder implementation issues have already been created due to planning and I will begin to fill these out with the details for significant terms and the redesigned transactions list.

🎬 Watch the video
🕹 Figma prototype

More screens

Transactions list

Transaction group detail

Trace view

[formgeist]

Design update - Feb 19, 2021

Based on the feedback from stakeholders, we're going to wrap up the initial designs on the Transaction redesign. As previously mentioned, implementation issues have been created and now also created a new issue for the Trace detail view.

I've updated the prototype with some minor new changes to the list of traces, where we've removed the span type breakdown from the table and also updated it with the latest header changes based off of the Service overview and Correlations implementations.

🕹 Figma prototype