Diego Prieri

Public Site New Enrollment Flow Accessibility Public Site New Enrollment Flow Current Version UX - Incomplete accessibility support - Information hierarchy - Disruptive escalation flow Front-end - Lack of semantic tags and WAI-ARIA attributes - Headings hierarchy 2 Public Site New Enrollment Flow What we propose to improve Design Take a “Mobile First” approach. Refactor escalations into a linear flow Update the boxes styles for better readability. - Remove background colors. - Addition of shadows to group content together. Adjust color scheme for a better contrast. Change font family for a better readability. Merge all “Submit Proof” views into a unique screen. 3 Public Site New Enrollment Flow What we propose to improve Implementation Take a “Mobile First” approach. Use Semantic HTML Tags. Make correct use of HTML heading tags. Add WAI-ARIA attributes. Use HTML5 Form validation. 4 Public Site New Enrollment Flow Enrollment Current status - The background color in the content boxes and the forms cause readability problems because the color contrast. - The modals used for Escalations and Household Worksheet break the flow an force the user to go back. - Hierarchy for titles & contents is not consistent - The submit proof flow takes up several screens, creating a nonlinear, unclear flow path. 5 Public Site New Enrollment Flow Enrollment Material We propose to take the “Material Design” concept to redesign the section, keeping elements and principles from the rest of the site. “A material metaphor is the unifying theory of a rationalized space and a system of motion. The material is grounded in tactile reality, inspired by the study of paper and ink, yet technologically advanced and open to imagination and magic. https://material.io/guidelines/ 6 Public Site New Enrollment Flow Enrollment Mobile First The main idea is to update the look and feel of the user interface, minimizing functional changes and prioritizing the user experience. Given the high number of entries to the site from mobile devices, we decided that the proposal is mobile first, which helped to sort and hierarchize the content. 7 Public Site New Enrollment Flow Enrollment Lineal Flow We propose to remove the escalations and HHWS modals, because it force the user to go back in the flow to review the information provided. Instead we use new views for each state, where the user can review and edit de information in the same view that is notified about the error. 8 Public Site New Enrollment Flow Enrollment Background Color We remove the background color to get better legibility and contrast, and use shadow to delimitate the boxes. Also, we work in the content hierarchy to organize it. 9 Public Site New Enrollment Flow Enrollment Color Scheme In order to get a better contrast betwen background and text, we adjust the color scheme, keeping the base colors. 10 Public Site New Enrollment Flow Enrollment Submit proof We group all the information and proposeed actions into an accordion UI control. This way, we avoid loading a new screen for each user action, offering a simpler solution to the user. 11 Thank you for your attention Any ideas, questions, or follow-up activities, please contact-