zeryabsial@gmail.com

In my role as a User Experience Strategist, I set the agenda for what internal improvements to make with our process and user experience strategy. To list some recent examples, how we set up and manage projects within the Digital Services team, improvements to tables, how we use filters, screen reader accessibility, an overhaul of our design system, file management conventions, and setting up a breakpoint system.

Taking a closer look at one of those examples, the UX team did not have an established breakpoint or grid system that was aligned with how our developers were building web pages. Our team would typically design for a single desktop width and fill in details for mobile where necessary. Developers, however, were leveraging an existing CSS framework with multiple preset breakpoints that didn’t match up with our designs, leading to confusion and miscommunication. Furthermore, each individual on the UX team had a different approach to setting up design file leading to internal inconsistency. Additionally, specing a design for handoff was a tedious, manual, and time costly process. 

I initiated a project to develop a breakpoint and grid system with the input of the User Experience and Software Engineering teams to address these challenges. Having found analytics revealing 60% of our users were visiting the website on a mobile device, I designed this new system to help us shift our focus to a mobile first paradigm. I worked with Software Engineering to establish a plan to apply these changes to their system to mirror the UX system so the two were aligned and worked together seamlessly. I produced the templates, a guide, and documentation to be used for all projects going forward, removing the additional work to set up files from scratch and any disparities between them. These changes would improve the quality of designs across devices such as tablets and larger monitors, consistency across the user experience, efficiency in setting up files with spec documentation already embedded, and collaboration across teams.

An overview of a the new breakpoint grid system that I developed for improvements in usability, performance, and consistency of the website across devices as well as the improvement of our internal process by increasing efficiency and consistency between design and development.