Shrinkray Labs

~ 3 min read

Senior UX Engineer

Build accessible buttons to handle any framework variation

UNIVERSITY OF MICHIGAN, ICPSR

UNIVERSITY OF MICHIGAN, INTER-UNIVERSITY CONSORTIUM FOR POLITICAL AND SOCIAL RESEARCH ANN ARBOR, MI

Synopsis

Hired to fast track UX Engineering within a newly formed UX product design group. Collaborated with UX researchers and designers to integrate a custom design system. Integrated layouts into Semantic HTML with Modular Sass to create reusable design components. Reported to and supported three Jira teams. Configured Parcel JS framework to render stylesheets for themes to use with frontend and full stack developers. Wrote and maintained technical documentation for engineering teams. Conducted and presented analyses of performance, usability, and SEO evaluations on the internal web properties. Influenced the development of NextJS applications for speed performance and user experience.

Key Achievements

  • Improved end-user experiences through Design Thinking framework
  • Built custom design system library delivered in React components
  • Collaborated across all levels in the organization and directly in Agile teams and documentation
  • Delivered creative design thinking solutions, with a strong visual design eye

ICPSR Design System Documentation is the result of my initial work. The remaining team is adding to this work. This is output from a ParcelJS bundler, with the goal to deliver a design-system based stylesheet for various web application products including legacy websites. I introduced Parcel as a zero-config performance-based solution helping the team deliver cache resistant stylesheets for several anticipated themes. We used Modular SCSS to extend our core designs. During this process, Bootstrap was added, initially as a responsive design framework. Later we adopted Bootstrap’s naming conventions since a newer part of the team was familiar with it and for consistency.

My contributions were heavy in this document. But this will change as time passes. Example components and prototypes I was heavily involved in were

The design system itself was created in Figma. That was the basis of the creative team’s work, where several UX/Product Designers contributed to it. I will provide screenshots and other examples showing the team’s source work.

ResearchDataGov.org is a product of the federal statistical agencies and units, created in response to the Foundations of Evidence-based Policymaking Act of 2018. The site is the single portal for discovery of restricted data in the federal statistical system. ResearchDataGov.org is built by and hosted at ICPSR at the University of Michigan, under contract and guidance from the National Center for Science and Engineering Statistics within the National Science Foundation.

The site was developed in NextJS. Because the entire project was on a rushed schedule, various project systems were broken out into multiple smaller projects to later be combined into a single, larger application. This explains how I was placed on two product Jira teams. I contributed to the creative team, the RDG team, and a third called ReDMAS. This stands for Research Data (Management) Application System. The vision is to develop a single application interface for applying for restricted Data.