Choose a frequent path through the application. On a project dashboard, a user opens the page, filters by status, and opens a record. Capture the current interface and note the decision that takes the most effort. Investigate information priority before adjusting spacing or colors.
Convert observations into rules
Suppose the filter controls squeeze the primary action off a narrow screen and the empty state gives no direction. Define a wrapping rule for the toolbar, keep the primary action reachable, and distinguish a first-use empty state from an empty filter result. Reuse the existing component and token system where it covers those behaviors.
Implement one path and its states
Exercise the default, loading, no-result, and failed-request views. Tab through the controls and check the labels and visible focus. Test the narrowest supported viewport and inspect the action area and list for overflow. Confirm that a user can clear the filter and recover the original list.
Compare the same scenario
Capture before-and-after views at the same size with the same data. Attach one observation to each acceptance rule. Use the linked frontend-design skill to work through visual structure and the webapp-testing skill to organize interaction checks. Keep the evidence for layout and the evidence for behavior separate.