How FullStory works in a web app
FullStory is a digital experience analytics platform that provides insights into user interactions with websites and web applications. It captures a comprehensive dataset encompassing clicks, page transitions, mouse movements, and more, to help teams understand, measure, and improve the user experience. While specific implementation details might evolve, the core functionality revolves around capturing and replaying user sessions to identify usability issues, bugs, and opportunities for optimization. Here’s a broad overview of how FullStory operates:
1. Integration with Web Applications
To start collecting data, website administrators integrate FullStory into their web applications by including a small JavaScript snippet in their site’s code. This script is asynchronous and designed to minimize impact on page load times. Once integrated, it begins capturing data from user interactions.
2. Data Capture and Session Recording
FullStory's script captures a wide range of interactions and events as users navigate through the web application. This includes:
- DOM Changes: It records changes in the Document Object Model (DOM), allowing FullStory to reconstruct the visual state of the webpage at any moment in a user session.
- User Interactions: Clicks, scrolls, mouse movements, and keyboard inputs are captured. This enables a detailed replay of user actions.
- Network Requests and Responses: By monitoring AJAX and Fetch API calls, FullStory can help identify issues with network interactions that might affect user experience.
- JavaScript Errors: Capturing frontend errors and stack traces helps in diagnosing issues that users encounter.
FullStory is designed to respect user privacy, with features that allow businesses to exclude sensitive information from being recorded.
3. Session Replay
One of the hallmark features of FullStory is session replay, which reconstructs a user's interaction with the site. This replay isn’t a traditional video but a reconstruction of the recorded data, accurately reproducing the user’s experience. This capability is invaluable for identifying usability problems, debugging issues, and understanding user behavior in detail.
4. Analytics and Insights
Beyond session replay, FullStory analyzes the collected data to provide actionable insights. This includes:
- Heatmaps: Visual representations of where users click, move, and scroll on a page, helping identify areas of interest or confusion.
- Funnel Analysis: Understanding where users drop off in a conversion process or navigation flow, highlighting opportunities to improve the user journey.
- Error Analysis: Identifying and prioritizing JavaScript errors based on their impact on the user experience.
5. Privacy and Security
FullStory provides tools and configurations to ensure that sensitive information is not captured or is obscured within the session recordings. This includes automatically excluding input fields marked as sensitive and offering APIs to manually specify data that should not be recorded.
6. Integration with Other Tools
FullStory can integrate with various other tools in the software development and customer support ecosystems, such as CRMs, support ticketing systems, and project management tools. This allows teams to leverage FullStory insights across different aspects of their operations.