kkia design system
KKIA, or King Khalid International Airport, is a major international airport located in Riyadh, Saudi Arabia. It serves as a key gateway for both domestic and international travel in the region. In my portfolio, I highlight my experience in designing a comprehensive design system for KKIA, ensuring a cohesive and user-friendly digital experience across their platforms.
goals
The main goals of the project were to create an accessible and cohesive design system for KKIA, ensuring compliance with WCAG standards for improved usability. This included developing a color palette aligned with their branding, defining typography, and establishing UI components that enhance consistency and accessibility across digital platforms.
button chips
It is a chip but functions as a button. Clicking on it redirects to another place on the page.
filter chips
It is located in the filters section.
tags
Primarily used in categories and statuses.
time selector
The Time Selector supports both time formats: 12-hour (with AM/PM) and 24-hour. It consists of two main parts: a text field and a dropdown list. The text field allows users to input the time directly via keyboard input. The entered value is validated and formatted in real-time to adhere to specified time standards. The dropdown list contains predefined times for selection. Users can browse and select from the list using either mouse or keyboard. Options in the dropdown list are dynamically generated based on available hours within the selected range.
learned
This project was a highly complex and extensive design system, which allowed me to refine my skills in managing design tokens, creating scalable color palettes, and ensuring accessibility compliance. I also gained deeper experience in structuring components efficiently, maintaining design consistency across platforms, and improving documentation for seamless developer handoff.