How can we assist individuals who
are blind or visually impaired in navigating?
UX / UI Design | Jan - May 2023 | Brooklyn NY
HapticNav is a navigation tool available on iOS & Android. Initially, HapticNav worked solely on a physical device called the way Wayband, conceived by WearWorks' founders, Kevin and Keth. The Wayband was a wearable device that utilized haptic vibrations to guide individuals with visual impairments to an end location. I joined the team to bring what was only possible on the Wayband, to anyone's phone or smart watch creating a more accessible world.
Background
In a 2021 study, it was found that worldwide, there are 43 million individuals who are blind and 295 million who have moderate-to-severe visual impairment. Developing an accessible navigation tool for blind and visually impaired individuals is a crucial step toward a more accessible society.
Improving
WearWorks Identity
As WearWorks evolved, inconsistencies emerged over time due to various contributors. To address this, I've prioritized consistency as a core principle. Now, every new feature is conceptualized and designed with a unified approach across all our platforms.
Website
App Logo
Marketing Material
HapticNav
How does it work?
Research Partners
Simon Wheatcroft
Blind Ultra-Marathon Runner
Joey Down
Lighthouse Guild Florida Director
Markeith Price
Visually impaired Paralympian
Marcus Engel
Blind Advocate, Author & Speaker
Primary User Research
We partnered with Lighthouse Manhattan to conduct a comprehensive survey, engaging over 100 individuals with varying degrees of visual impairment. We aimed to gain deeper insights into how these users navigate cityscapes from one location to another. This survey focused on understanding the challenges they face with current navigational tools, specifically in terms of haptic vibration feedback and voice-over guidance. Our objective was to identify areas for improvement in HapticNav, ensuring it effectively meets the unique needs of low-vision users in urban environments.
Selected Interviews
Angie
"As my vision has declined, I find the visual map on HapticNav unusable, it’s too small and I can’t tell if I am heading in the right direction by looking at it.”
Bill
“The “Go” button stands out and works well because of its bright color and its able to be easily picked up by the voiceover.
User Journey Map
Conclusions
Research findings guided our app reconstruction, prioritizing improvements in the user interface, performance, and features.
Main Pain Points
Users have difficulty hitting the correct buttons when voice-over is enabled.
Voice-over jumps around from text to text and is sometimes not in the correct order of importance.
For people who have limited vision but can still see partially, small text, icons, and graphics prove to be hard to discern.
Key Takeaways
Information architecture is chaotic
Contrast: different contrasts can indicate different functions.
Focus on color (60/30/10), Size, Font, and Alignment should also be adjusted Gestalt Principles: Focus on proximity, continuation, similarity, focal points
Functional Type: all large types must be interactive
Numbers: people respond to numbers more than text
Call to Action: Actionable button states (change in color, fill, padding, etc.)
System Design
As one of the designers on the team, I contributed to the app's architecture. There were many pain points in the existing app which needed to be simplified and/or removed completely.
HapticCompass
Why does someone visually impaired or blind need to look at their phone when they have haptics? This made me realize a simplified UI feature could improve the user experience, especially with voiceover enabled. I was placed in charge of designing the HapticCompass while the other members of the team worked on various other elements of the app.
Initial Concept
High Fidelity Design Iterations
Refined various versions of the HapticCompass to enhance element contrast, aiming for accessible design. Initially, it featured red and green colors with numerous moving parts, which user feedback showed to be problematic for those with color blindness and low vision. Subsequent versions simplified the UI and heightened contrast for better usability.
Initial Prototype
Currently Integrated Design
Onboarding
Apple and Android Watch (NDA)
Coming Soon…
HapticNav Today
Despite our budget constraints as a small start-up company, the basic concept of the HapticCompass has been implemented into the live app on IOS and Android. There are still many improvements that need to be made to the app, but I am happy with the progress the design team and company this size has made in such a short period.