2018 / Design for America

Accessibility Design - Virror

October 2018 - May 2019

8 month

My Role

Interaction Design, HCI


Esther Lin, Leon Zhang, Joyce Lin, Sherry Zhang,​ Naomi See, Aliya Shabbir

Project Overview

As the UX designer of the team, I focused on user research, prototyping and user testing of our year long project VIRROR, a sight-based interactive mirror that compensates auditory barriers through a visual medium for efficient communication in a home environment.

Full process walk through

1.0 Research

1.1 Initial Design Thinking:

The quote, “The Deaf World, where lack of hearing is an identity to be celebrated, not a disability to be cured” will be the guiding narrative theme for our design project, Empathy.

The phrases ‘designing with empathy’ and ‘inclusive design’ are thrown around quite often nowadays. To really understand this problem space, we set up multiple conversations with Professor Lance, the Director of the ASL Language at UW.

After our talks we concluded two interesting takeaways:

  • The design of the house may block visual communication
  • Difficulty in getting DHH people’s attention

1.2 Naturalistic Observation:

After two potential pain points worth designing for, we set out to investigate ASL and the Deaf community ourselves. We were able to join UW ASL groups to observe and take notes, and we set up sessions to observe hard of hearing students within the UW campus during their ASL sessions. This gave us a better understanding of the community in order for us to sharpen our interview questions.

Participants did not want to be photographed, not an actual photograph of UW's ASL events.

1.3 Interviews & Directed Storytelling:

Because of the low amount of survey responses we got from the deaf community, we noted that not everyone was willing to share their situation and experiences publicly. To conduct further research we reached out to participants who were willing to talk. We emphasized the ethics of our research and how we would ensure their privacy. With recommendations and referrals, we were able to interview over 10 more users in the following weeks. In one session, we interviewed the hard of hearing individual alongside her roommate. We were able to understand their difficulties and struggles more in depth from listening to their experiences communicating with one another. 

This also broadened our vision. We realized we should also be exploring the unique relationship between deaf and non deaf individuals living together.

We were able to conclude that:

  • accessibility was an issue with their home appliances 
  • there was a lack of inclusivity in big group discussions
  • there was a lack of public awareness and understanding of the deaf culture

1.4 Synthesize Data:

After observing and listening to our potential stakeholders, we created affinity diagrams from synthesizing our research and found key takeaways.

Originally, our project lead approached the problem space with the mindset of designing a housing space. However, we also decided to explore the social challenges hard-of-hearing individuals face on a daily basis.

1.5 Proposed Problem Statement:

Based on our synthesized data, our team came up with a specific problem statement.

2.0 Design

2.1 Building User Personas:

Building user personas helps us put all of the useful information together and reminds us to focus on the problems that we identified from our user interviews.

2.2 Finalize Requirements Gathered

These 3 design requirements helped us identify the scope and goals of our end product. This step was crucial to ensure we narrowed down our ideas enough to add internal and external constraints to what we could accomplish.​

1. Visualization

To visualize the layout of the living space with regards to where other people are.

2. Notification

To be notified of the status of home appliances

To be notified of emergency situations

3. Communication

To communicate with housemates in different rooms

To communicate effectively with hearing people who lack ASL knowledge

2.3 Brainstorm & Ideate

Before any prototyping was done, we wanted to thoroughly explore all of our creative options, so we created multiple mind maps during our weekly sessions for innovative solutions.

2.4 Narrowing Down the Selection

Our project lead divided our team into two smaller groups to further develop our ideas before deciding on the final solution.

One idea that gained traction amongst our team was a visual card game designed to help raise awareness and help deaf or hard-of-hearing individuals bond better with their roommates. However, this did not tie well with our design requirements and we were cautious about proceeding with this idea.
After further deliberation, we went with another idea that tied closer to our design requirements. We decided to create an interactive smart mirror that would be a piece of accessible home technology. The down side of this solution was affordability for students or low income families.

2.5 Wire Frame

Since this product has UI interfaces, we chose wire framing as our main prototyping method. This allowed for easier user testing as we were able to animate the frames in Figma.

3.0 Usability Testing

3.1 Usability Testing (Peer critique)

We handed off our design to our peers in the design school to test and give feedback.

Since they are by nature not our direct stakeholders, we asked them to focus on how well we presented our visual information, and if there was enough visual hierarchy. (Since visual information is very important for our deaf users)

Some key feedback:

  • Include more shining or eye-catching alerts for notifications and alarms.
  • Remove unnecessary features and unclutter the setting, because they don’t need too many setting options.
  • Touch gestures are great, include more swiping gestures, since those come more naturally with a touch interface.

3.2 CO-Design and Testing with Stake Holders

We asked four of our users to join us in a CO-Design and testing workshop. This gave our users the opportunity to be more open about their suggestions and more critical of the current design.

For the user testing we focused on prompting simple navigation tasks such as sending your roommate a message or accessing the alarm of appliances. We wanted to see how well they could complete it without assistance.

Some key feedback: 

  • Showed the cooking timer on the homepage to remind users the status of the home appliances
  • Added tracking pet feature in the floor plan feature
  • The notification light would change based on the importance of the massage

3.3 Proposed Redesigns

Based on feedback from both our peers and our users, we decided to focus on how we wanted to present notifications and alarms visually. We created a glowing light bar around the mirror that would signal the user of a notification; this could be turned off with a click if they wished to not be disturbed.

However, when emergency alarms take place, we designed a large glowing red that took up the entire screen to differentiate it from normal notifications since our users could not have audio feedback.

4.0 Final Deliverable

4.1 Interaction Showcase

VIRROR has put serious thought into the privacy of users since it will be installed in private bed rooms. Therefore it has no camera features, and all locations are presented in an abstract way called the floor plan. Other primary features of the app include the easy productivity and communication tool of the white board mode, alongside the ability to link with smart home appliances and Alexa.

Since an individual who is Deaf has trouble keeping track of who is in the house and where they are, this feature is easily accessed from the home screen.

Communication is also an interesting challenge to overcome creatively. During our user interviews we found out many Deaf and Hard of Hearing individuals favorite assistive technology was simply just a whiteboard for them to write BIG TEXTS

Home appliances are also one of the key issues. Is anyone still using the shower? Is water boiling? These small things become big inconveniences for the Deaf and Hard of Hearing individuals. Having the smart mirror glow to notify the users will make their lives a lot more convenient.

4.2 Mockup Analysis

Here is a mock up of some of the visual ways VIRROR presents valuable visual information to its user, no unnecessary clutter is present and all UI elements serve a purpose.

4.3 Presentation at Aretfact

At the end of May, my DFA team presented at Aretfact Seattle our high-fidelity mockups and a product video. We received positive feedback as well as feedback for potential next steps of the project.