John e Evanofski

Stitch, Gap Inc. Design System

I have been working on the User Experience team at Gap Inc. since 2017. During my time at Gap I have been promoted from fledgling Web Developer to Sr. Web Engineer to Sr. Engineering Manager acrosss the entire UX organization. I currently have a small team of developers working under me to maintain our design system as well as aid in other UX driven initiatives.

Roles & Responsibilities

Sr. UX Engineering Manager

  • Collaboration with product management and UX Director on roadmaps, timelines and resource allocation
  • Team growth and learning initiaves such as training and team building
  • Continued technical support and consulting across engineering projects
  • Interviews and talent recruitment
  • Intern managment

Stitch Design System

A design system is a living styleguide with a library of documenation for best practices, design files and usable code for engineers and designers to work together on cohesive user experiences. Stitch is a multi-brand design system used actively by all of our brands to cater to their particular styles and brand missions. See below for the case study

  • Lead technical strategy for design system architecture including styling, documenation and delivery of components
  • Maintaining a React component library and Storybook
  • Maintining a robust documentation site with live examples for each brand
  • Technical consulting for teams across the organization using the design system
  • Integrated testing strategy for code quality assurance

Web Accessibility at Gap Inc.

Accessibility for the web is a huge part of my work at Gap Inc. both working directly on universal design as well as consulting for technical teams on best practices. My team and I are all W3C Web Accessibility Certified.

  • Consulting both designers and developers on a11y best practices
  • Working with legal teams on a11y audits
  • Contributing to the company a11y newsletter

Case Study: Stitch Design System


  • Stitch Home Page
  • Accordion Component

Tools

Notable Languages, Libraries and Frameworks

  • Typescript
  • Webpack
  • React JS
  • Storybook
  • Mocha, Chai, Enzyme, Testing Library
  • Handlebars, Jekyll

Administrative

  • GitHub
  • Jenkins
  • Pivotal Cloud Foundry
  • Jira
  • Confluence
  • Microsoft Office Suite
  • SmartSheets
  • Figma, Sketch
  • Miro
  • Zeroheight