UI8-mockups4K-macbook.jpg

UX Design

UI8-mockups4K-macbook.jpg
 
 

Image Enhancer

Self-directed ongoing project (2019)

 

Overview

In digital space, image contents take up the significant portion of information. However, perceiving these image-based contents are often challenging for people who are struggling with visual impairment. Although there are accessibility tools help them to perceive images, it does not always work perfectly with people with low vision. Through this project, I explore image enhancement technology as an alternate means to perceive image-based contents for people with a mild to moderate vision loss.

 
 

 

Problems & Research Questions

According to WHO(World Health Organization), approximately 1.3 billion people live with some form of vision impairment. Among them, about 188.5 million people have mild to moderate visual impairment. Despite its black-and-white nuance, vision loss is a complex disability. Depending on its type and severity, each individual’s visual condition significantly varies. Therefore, there are many users only get a minimal advantage from the existing vision aid tools.

 
 
comparison@2x.png

Above are accessibility options available for users who prefer perceiving images with their residual vision: a color inverter, a color filter(color blind specific), magnifier, and image-to-text. Except for image-to-text, these are the tools that directly modifies the attributes of the image. However, these tools only provide a modification that is too simple to be effective for various visual impairment. The idea of my project started with the questions:

Do current low vision accessibility tools provide enough support to its users?”

“What are the missing points when perceiving the online image contents
when using accessibility tools?”

“How image enhancement technology can help people with low vision
to have better access to image-based contents?
 
 

 

Solution

 

I built a Chrome extension which users can easily install on their web browser. It enables users to build their own photo filter which is quickly applied to images shown on the web browser.

 

 

User Research

During a user interview, I was able to collect information about what vision aid tools they use in everyday life, and what strategy they use when they fail to perceive images on the device screen with those tools.

 
 
 
 

Findings

1. Some users rely on additional software and hardware, sometimes even their peers and friends to cover the disparity that accessibility tools cannot be help of. In the case of using additional software, they often encounter with difficulties in using it, as it is not designed to support people with visual impairment.

2. Modifying the hardware setup is another option, but takes too much time.
e.g. adjusting monitor settings every time they load the image.

3. In the case of requesting help to their family, friends and peers, they are not always available to assist them.

 
 
 

What affects the perceived visibility?

From both academic resources and in-person interview, I found the strong evidence that sharpness, contrast plays a critical role for increased visibility for people with low vision. Leat’s scholarly article compares various image processing techniques and it draws a conclusion that moderately sharpened images with enhanced contrast have the highest perceived visibility among people with low vision. Interestingly, popular accessibility tools do not include image modification features as professional photo editors do.

 
 

 

Prototype V1: testing the hypothesis.

Process

I decided to go with an add-on plugin due to its high compatibility with browsers. The popup window for Chrome extension can have various dimensions, therefore I started with a series of rough sketches to find the best form that can contain necessary image enhancement features.

 
 
sketch – 1@2x.png

In my first iteration cycle, I decided to test the two most important variables affect perceived visibility in Leat’s research experiment: contrast and sharpness.

 

Here you can see how the prototype works with the web browser.

 

Feedback

I ran a usability testing with a focus group. Each session was about an hour, it consists 40 minutes of observation and 20 minutes of user interview. These were the main questions I investigated during usability testing:

  1. How does the app improve perceived visibility on the images for users?

  2. How well does the app integrate with the user’s internet browser use?

  3. Is there any additional features can help users “read” images?

 
 
questionaire@2x.png
 

Overall, test participants responded that the app is quite helpful. From the respondents who gave a score below 3, one of the common feedback was that it would have been more helpful if the app displays image on a separate tab because it can increase the effectiveness of the app by eliminating any unnecessary information. Some respondents also mentioned the text in the pop-up window being too small. The most interesting feedback I received was that the readability of the text in the image decreases when the filter is applied.

 
 
 

 

Prototype V2: fixing the parts not working

process

Based on the feedback collected from the testing, I made some changes:

 
 

1. More customization options.

Providing an ideal solution for each individual with limited image customization is challenging. I provide more control on image filter to fulfill more diverse user needs.

2. Displaying image on a separate tab.

I learned that image resolution is as important as sharpness and contrast in perceived visibility. Usually accessing the full-size image requires multiple mouse-click, and this is a big problem for some people with low vision. in prototype V2, I made the app to display the full-size image on a separate tab, and apply the filter immediately with a single click.

3. Increased readability of UI.

For people with low vision, securing am optimal readability is an important goal. I increased font size, added an eye icon to display app status(on/off) and used primary colors to make UI more visible.

4. Additional features to assist users.

Besides the image filter, it has features automatically display the image in full-screen mode, adjust background color to maintain ideal contrast value, and detect text in the image.

 
 
 

 

Results

I ran another usability testing with different users. According to the survey, there was a noticeable improvement in usability rating. The average rating of the app increased to 4.0! The minimum rating and the maximum rating goes up to 2.5 and 5 respectively.

 

Future project direction

insta.png
 

In social media spaces, sharing a snapshot of pictures is being a popular way of communicating with their family and friends. However, things like post length, styled text, and AR filter has low visibility for people with visual impairment. I am currently exploring how text detection and image enhancement technology can help in tackling these problems.