Writing Sample
Quting Lin
Jan 9, 2025
Introduction
Accessibility is a crucial aspect of UX design. Approximately 1 billion people worldwide have a disability, and around 40% of individuals over the age of 65 have visual impairments. As UX designers, we need to ensure that everyone, no matter their body condition and their culture can use the products we create in their most comfortable and intuitive way. In this writing sample, I will share my collaboration project with DiDi, where I worked with three other designers from diverse backgrounds to create a concept for the future of robotaxis.
This project covered various aspects, including the interior and exterior design of the robotaxi, and the UX design for mobile app and in-car screens. However, I will only focus on the accessible UX design of the mobile app in this writing sample. The primary function of this app is to facilitate robotaxi bookings, along with a series of additional features throughout the process.
Color Contrast Check
Before starting the high-fidelity design for any of my project, I first established the design system. At this stage, I finalized all the colors to be used, including the text colors. During the design process, to achieve a visually pleasing and readable layout, I usually use black text for headings or emphasized content, while gray text is often used for paragraphs or less prominent information.
To ensure sufficient contrast, I conducted color contrast tests on WebAIM, testing the most extreme scenarios. After completing the high-fidelity design, I performed another round of testing to verify that the contrast remains adequate for all interfaces.
In this DiDi project, the lightest text color I used was #525252, and the darkest background color was #F5F5F5, which resulted in an excellent contrast ratio.
One Hand Operation
The accessible design of the mobile app needs to take into account one hand operation scenarios, as everyone may find themselves using the app with one hand. For one-handed operation, the lower half of the screen (which differs between right-handed and left-handed users, focusing on the bottom-right and bottom-left respectively) is the most accessible. Therefore, the majority of the app’s key interactive elements are concentrated in the lower half of the screen, while the upper half is reserved for displaying information. This allows users to complete most operations within the lower half of the screen.
In addition, based on both my primary and secondary research, nearly all users only use the “enter location” function when opening a ride-hailing app, and after confirming, they simply wait for the car to arrive. Therefore, I have minimized the number of elements on this interface and emphasized this single most important feature in the design. When users open the app, if they have granted the app permission to access their location, their pickup location will be automatically filled in.
Text with Icon
In many places with short text, I added icons alongside the text to prevent users from misunderstanding either element. For example, on the main page, “Pickup Point” and “Drop-off Point” are paired with icons, and on the second page, each type of location, such as Home and Work has its own unique icon as well.
Large Color Blocks
The three pages below are the interfaces users see after placing an order for a robotaxi. Before the robotaxi arrives, they can adjust the color of the car’s underbody light projection, the interior temperature, and the interior lighting. I used large color blocks here to allow users to intuitively perceive the values they set. However, in this context, we must consider the experience of users with color blindness.
Initially, I aimed to keep this section as simple as possible. However, after converting the interface to black and white to simulate the perspective of color-blind users, I realized:
1. The car’s projected color was difficult to distinguish.
2. The temperature colors lost their contextual meaning.
Therefore, I made the following changes:
1. Added text to display the car’s color in the bottom-left corner of the card.
2. Adjust the size of the color blocks to reflect temperature levels visually while maintain the color changes.
Below is a comparison between my initial and updated designs.
AR Finder
In addition to aiding people with disabilities, accessibility design also benefits other specific groups, such as the elderly or those with impaired vision. After interviewing over 20 taxi drivers, we found that elderly often struggle to identify their vehicles. To provide a more intuitive way for them to locate their rides, we designed an AR feature for recognizing robotaxis. By simply pointing their phone at the street, the app will highlight the robotaxi they ordered using a high-contrast color, allowing them to find their car quickly.
AI Voice Ordering
With the rapid advancement of AI technology, we believe that in the next five years, AI will be able to accurately recognize every word users say. This opens up new possibilities for accessible design in the ordering process, such as voice-based ordering. After the user talks to the AI, states their needs, the AI will extract useful information such as location and time. If the user finds the AI’s extraction inaccurate, they can inform the AI through voice or click on the extracted information to make corrections. This feature can significantly enhance the ride-hailing experience for the following groups:
1. Elderly individuals: Many elderly people are not familiar with smartphones. AI can simplify various steps and complex information in the ride-hailing process, helping them better understand what they are doing and improving their overall experience.
2. Visually impaired or blind individuals: Currently, most blind users rely on screen reader. However, many apps have limited compatibility with the screen reader, and even when it is compatible, it often takes considerable time to complete a ride-hailing order. Voice-based ordering can address this issue effectively.
3. Individuals with hand disabilities: Voice-based ordering can replace traditional manual operations, allowing them to complete most steps through voice commands, effectively reducing the difficulty of operation.
Conclusion
In conclusion, accessibility has always been a crucial part of UX design. I have tried to achieve this goal in most of my projects. After completing some of my projects, I conduct user testing with real disabled individuals, elderly groups, and others to gather feedback and improve my work. Additionally, when designing web-based products, I will go through the WCAG (Web Content Accessibility Guidelines) to ensure the website meets these standards. I hope that everyone can interact with the same product in the way that is most comfortable for them.