Year
2024
My Role
UI/UX Designer
Responsibility
Workflow planning, interaction logic optimization, UI design production, developer handoff documentation
Project Background
This project focuses on the “Response Data” page within the Ryzo Webform module, where users filter, select, and download response records in bulk. While the interface supported basic functionality, the logic lacked clarity and feedback, often resulting in confusion or unexpected outcomes.
Legacy UX Problems
Unclear Download Logic Based on Selection State
When items are selected → Button shows “Download Selected Items,” exporting selected records
When no items are selected → Button shows “Download Filtered Results,” exporting all filtered records (including across pages)
Users struggled to predict button behavior and had to guess the logic
The table’s “Select All” checkbox only applied to the current page, often misinterpreted as selecting all data
Lack of state feedback caused mismatch between user expectations and system behavior
Collaborative Review and Rethinking the UX Logic
After discussing with the original UX designer, I understood their logic: “If nothing is selected, assume the user wants all filtered results, so the button label changes.”
While technically valid, this approach lacked clarity from the user’s perspective: it relied on user assumptions and offered no visual confirmation
I restructured the end-to-end flow—from selection to feedback to download—to improve transparency and predictability
Legacy data table interaction
UX Optimization Strategy
Consistent logic with real-time state feedback
Standardized the download button label as “Download”
Displayed real-time “Selected X / Total Y items” next to the button
Added tooltips explaining what will be downloaded to eliminate uncertainty
Added scope confirmation for select all interactions
When selecting the header checkbox, a confirmation block appears
Users choose between:
Selecting only items on the current page (e.g., 20 items)
Selecting all items across the filtered results (e.g., 108 items)
Displays current selection count and provides a “Clear selection” option
Outcome & Impact
Reduced user errors and mistaken downloads on first use
Improved clarity and confidence in selection and export behavior
Provided engineers with well-defined logic and UI states, reducing handoff ambiguity
This logic is scalable to future modules involving tables, enhancing system-wide consistency and maintainability