🎥 Session Replay Player
The GermainUX Session Replay Player lets you watch recorded user sessions and investigate the UX, workflow, and technology events that occurred during each session.
🗺️ The player contains five primary areas
The player contains five primary areas:
|
Area |
Purpose |
|---|---|
|
DevTools |
Investigate console messages, network requests, business-process steps, events, and session metadata. |
|
Events & Overlays |
Review events in context and display behavioral heatmaps over the replay. |
|
Playback Controls |
Play, pause, navigate, filter, and change the playback speed. |
|
Playback Timeline |
Visualize session progress, activity, inactivity, events, and buffered content. |
|
Replay Content |
Watch the user’s recorded application experience. |
Session Replay Player – GermainUX
🛠️ DevTools
The DevTools panel provides technical and functional details about the events, transactions, business processes, and other insights collected during the session.
It contains five tabs:
|
Tab |
Content |
|---|---|
|
Console |
Browser console messages generated during the session. |
|
Network |
HTTP requests made by the monitored application. |
|
Business Process |
Business-process and workflow steps captured during the session. |
|
Timeline |
Session events grouped by category. |
|
Info |
Session metadata and monitoring configuration details. |
📄 Console
The Console tab displays console events in the context of the recorded session.
Available options include:
-
Free-text search
-
Console-event type filtering
-
Export of visible results to CSV
You can also:
|
Action |
Result |
|---|---|
|
Click an event row |
Open the Analysis view for that event. |
|
Click an event timestamp |
Move the replay to that point in the session. |
In addition, you can execute the following actions on each request:
|
Action |
Effect |
|---|---|
|
click on row |
that will open quick RCA screen for that particular event |
|
click on timestamp |
that will move replay to that timestamp |
🌐 Network
The Network tab displays HTTP requests that occurred during the recorded session.
Available options include:
-
Free-text search against the request name
-
Request-type filtering
-
Export of visible results to CSV
-
Export of visible requests to a HAR file
You can also:
|
Action |
Result |
|---|---|
|
Click a request row |
Open the Analysis view for that request. |
|
Click a request timestamp |
Move the replay to that point in the session. |
💼 Business Process
The Business Process tab displays the business-process and workflow steps captured during the session.
Available options include:
-
Free-text search against the step label
-
Export of visible results to CSV
You can also:
|
Action |
Result |
|---|---|
|
Click a process-step row |
Open the Analysis view for that step. |
|
Click a process-step timestamp |
Move the replay to that point in the session. |
🕰️ Timeline
The Timeline tab groups all collected events and transactions into functional categories.
Select a category to expand it and review its events. Select an individual event to open its Analysis view and examine its details, context, and potential causes.
ℹ️ Info
The Info tab displays metadata about the recorded session, including information about the user, application, device, browser, environment, and RUM configuration used during collection.
The following video shows Dev Tools main features in action.
🔍 Events & Overlays
The Events & Overlays panel lets you:
-
Review events, metrics, and transactions as they occur during playback.
-
Display behavioral heatmaps over the replayed application.
-
Investigate clicks, errors, frustration, mouse movements, and scrolling in context.
🔔 Events
The Events tab displays collected facts as they occur during the replay.
Each event can include:
|
Attribute |
Description |
|---|---|
|
Type |
Event type, represented by an icon. |
|
Label |
Name or description of the event. |
|
Timestamp |
Time at which the event occurred. |
|
Details |
Additional contextual information, when available. |
|
Duration or value |
Event duration or measured value, when applicable. |
|
Progress |
Visual representation of the event duration, when applicable. |
Available actions include:
|
Action |
Result |
|---|---|
|
Click the type, label, or details |
Open the Analysis view for that event. |
|
Click the timestamp |
Move the replay to that point in the session. |
The events displayed in this panel can be configured through the Player Settings. See Configure the Session Replay Player.
🌡️ Overlays and Heatmaps
The Overlays tab displays behavioral heatmaps directly over the replayed page.
Available heatmaps include:
|
Heatmap |
What it reveals |
|---|---|
|
Error Clicks |
Clicks followed by an application or JavaScript error. |
|
Rage Clicks |
Repeated clicks that may indicate frustration. |
|
Dead Clicks |
Clicks that produced no visible response. |
|
Clicks |
Where users clicked on the page. |
|
Mouse Movement |
Where users moved their pointer. |
|
Scroll |
How far users scrolled through the page. |
By default, overlay data is based on:
-
The same application and page
-
The previous seven days
-
All users and sessions
Use the Settings panel to adjust the overlay query:
|
Setting |
Purpose |
|---|---|
|
Time Range |
Select the period included in the analysis. |
|
Session Filter |
Select which sessions contribute to the overlay. |
|
Top Clicks |
Limit the overlay to the top N clicks. A blank or zero value applies no limit. |
Available session filters include:
|
Filter |
Data included |
|---|---|
|
All Sessions |
All sessions for the same application and page. |
|
User Sessions |
Sessions associated with the current user. |
|
This Session |
Only the session currently being replayed. |
🎛️ Playback Controls
Playback Controls let you navigate and control the recorded session.
|
Control |
Function |
|---|---|
|
Play/Pause |
Start or pause playback. |
|
Skip Backward/Forward |
Move by a configurable duration. The default is 10 seconds. |
|
Previous/Next Event |
Move to the preceding or following selected event type. User-activity periods are selected by default. |
|
Playback Speed |
Change the replay speed. The default is the original |
|
Event Filters |
Select which preconfigured events appear in the Playback Timeline and Events panel. |
⌨️ Keyboard Shortcuts
|
Key |
Action |
|---|---|
|
Spacebar |
Play or pause the replay. |
|
Left Arrow |
Skip backward by the configured duration. |
|
Right Arrow |
Skip forward by the configured duration. |
⚙️ Player Settings
The right-side settings panel provides access to:
-
Session details and metadata
Session Replay details and metadata - Germain UX -
Session-event export
-
Session Replay portlet settings
See Configure the Session Replay Player.
📈 Playback Timeline
The Playback Timeline provides an overview of the entire recorded session.
It displays:
-
Total session duration
-
Current playback position
-
Events enabled through the Playback Controls
-
User activity and inactivity
-
Replay buffer progress, represented by a gray bar
-
Selected or zoomed time ranges
Select a point or event on the timeline to move the replay directly to that moment.
🔎 Zoom into a Time Range
Use Zoom In to isolate a specific portion of the session. Events occurring before or after the selected range are temporarily excluded.
The selected range is applied consistently to:
-
Replay Content
-
DevTools
-
Events & Overlays
Select Reset Zoom to return to the complete session.
👁️ Replay Content
The Replay Content area reconstructs what the user experienced during the recorded session with pixel-perfect precision.
It supports the original application layout, browser dimensions, multiple tabs, multiple windows, and user interactions captured during the session.
🖱️ Context Menu
Right-click the replayed content to access additional actions:
|
Option |
Description |
|---|---|
|
Copy |
Copy highlighted replay content to the clipboard. |
|
Add Text to Phrases of Interest |
Monitor the highlighted text in future sessions. |
|
Add Watch on This Phrase of Interest |
Create a watch for the highlighted text. |
|
Add Note |
Attach a note to the session and the selected replay location. |
|
Switch to Native Menu |
Close the GermainUX context menu and open the browser’s native context menu. |
📑 Multiple Tabs, Windows, and Content Zoom
GermainUX reconstructs the tabs and windows used during the original session to reflect the user’s actual navigation.
Select a replayed tab header to:
-
Bring a hidden tab into focus.
-
Switch between recorded tabs or windows.
-
Zoom into the selected tab’s content.
This makes it possible to follow user activity across complex, multi-tab workflows without losing the original session context.
Service: Analytics
Feature Availability: 2025.2 or later