We have a small web app consisting of only a couple screens, with different panels and view states (you can collapse some panels, enlarge others, etc.). When we track an event like “Report Download”, as a designer I’m also interested in:
- what the screen looked like when that event fired—what panels did they have open, etc., and
- more generally, what are common sequences of UI changes that users make (e.g., if a user opens and closes a panel a lot without doing anything, we might want to look at the title and content of that panel).
What is the best way to track these kinds of UI changes that might only affect a portion of the screen, and can be combined to create many possible states? Should they be individual events (“List Panel Open”, “Detail Panel Expand”), or maybe one “View Change” event with boolean (super?) properties for the state of each part of the UI?
I think we’ll learn more about what we want after trying something and seeing if we’re able to segment in useful ways, but I was hoping to find some guidance on this kind of thing in the docs (I haven’t found anything yet). Any tips would be great. Thank you!