Irfan Mir's Portfolio

Bishop International Airport

Preview

Preview video of Voice Over assistive technology navigating tiered menu—full video and more information available in Details section

Summary

Front-End Development and UX and Accessibility strategy and implementation for a high-traffic website.

Description & Timeline

  1. Contributed to the Front-End Development while with a team at Addis Enterprises in 2017
  2. Presented to developers on importance of UX and Accessibility in this and all projects
  3. Led the development of Experience and Accessibility Design in production until launch

Prompt

To design accessible interactions and a strategy in the design and Front-End development of Flint Bishop International Airport’s new website.

Strategy

In addition to developing cross-browser experiences, I aimed to make these sites as accessible as possible to promote discoverability, user retention, and potential audience. I regularly advocated for AE’s creations to be accessible and usable. I presented at conferences to spread a vision of Universal and Inclusive Design and Development across Michigan.

Challenges

In developing the FNT Airport site, I worked to foster a recognization and advocation for all people, of all abilities, to my fellow developers and all stakeholders through presenting on the WCAG standard and leading a strategy I developed to create accessible interactions; e.g., the navigation.

Response

Through my strategy, the entire development team aimed for maximum accessibility within the stakeholders' (client & leadership) vision. I led this effort and focused on a keyboard & screen-reader friendly navigation as per the WCAG 2.0 web app menu/menuitem guidelines.

Solution

Final homepage of the FNT Flint Bishop International Airport
Final homepage of the FNT Flint Bishop International Airport. View the live version.
Screen-recorded video of the Bishop International Airport website working with keyboard controls and a screen-reader.
Notice the use of various keyboard keys as well as ARIA labels, descriptions, and more to make the menu accessible and operable.