My Role
• UX/UI Design
• Design System Contribution
• Usability Testing
• Developer Handoff
• Design System Contribution
• Usability Testing
• Developer Handoff
The Impact
A new form editing flow for branching logic was created and integrated into the VA design system, enabling teams across the site to build smarter, more efficient forms.
The Project
The discharge upgrade wizard on the site needed to be updated to follow new design system guidelines. Previously, all questions in the wizard would appear on one screen. This was no longer recommended because previous research at the VA indicated that showing one question at a time reduced cognitive load for users.
A new pattern needed to be implemented that only showed one question per page. This is called the sub-task pattern. This pattern has a review page at the end of the flow that allows users to check and edit their answers. While implementing this pattern, the team realized that there wasn’t an existing design that allows users to edit their answers on questions that contained complicated branching logic.
A new pattern needed to be implemented that only showed one question per page. This is called the sub-task pattern. This pattern has a review page at the end of the flow that allows users to check and edit their answers. While implementing this pattern, the team realized that there wasn’t an existing design that allows users to edit their answers on questions that contained complicated branching logic.
The Challenges
While creating a new edit flow, I identified a gap in our documentation. Before quality assurance testing or usability testing, we needed to understand all of the branching logic in the wizard. This would help us ensure that the wizard was correct and would help up properly test it with Veterans. I created documentation that showed all of the possible question branches—which became pretty complicated!
The Solution
The new edit flow that I proposed allowed users to select which question to edit from the review screen at the end of the flow. Once a question was edited, the user would go back through the flow and answer any new questions that appeared as a result of changing their answer. Alerts were strategically placed throughout the editing experience to inform users that they may have new questions to answer.
After I proposed the new edit flow, the next step was to conduct usability testing. We wanted to verify that users could navigate the edit flow with ease and understand why new questions may appear. I lead this effort by writing a research plan and conversation guide, conducted moderated research sessions with 10 participants, and compiled research findings in a report. Usability testing showed that participants were able to navigate the edit flow, making the new design an overall success.
After I proposed the new edit flow, the next step was to conduct usability testing. We wanted to verify that users could navigate the edit flow with ease and understand why new questions may appear. I lead this effort by writing a research plan and conversation guide, conducted moderated research sessions with 10 participants, and compiled research findings in a report. Usability testing showed that participants were able to navigate the edit flow, making the new design an overall success.
