WearWorks
Designing an accessible mobile application for a creative haptic studio
Context
WearWorks is a startup based in Brooklyn, NY. Their first product is a wearable wristband and coordinating mobile application that navigates visually impaired users through haptic feedback. Our team was tasked with designing a partner mobile application to create, discover, and share haptics.
Problem
Users want to disconnect from their phones, but can't be totally disconnected from important notifications. They are interested in changing the intensity of their haptics based on priorities and their environment. The current market offering is very limited and not intuitive.
Role
Led Prototyping, Interaction Design, and UI Design
Time Frame
3 weeks
Team
3 UX Designers
What are haptics?
Technology that creates an experience of touch by applying forces, vibrations, or motions to the user. Haptic technology can be found on iPhones, Apple watches, game controllers, and other wearable devices but are most commonly known as vibrations on your mobile device.
Research Goals
Determine potential of marketplace product for the client
Analyze competitors to determine gaps in the marketplace and potential opportunities
Identify use cases and main features
We conducted a competitive analysis of direct and indirect competitors and found that the two main industries exploring customizable haptics are the video gaming and sex toy industries.
While the iPhone allows users to customize haptics, we found that most users weren’t utilizing this feature because either they didn’t know it existed or because it doesn’t allow them to edit the intensity of vibrations.
Lofelt Studio: Haptic technologies for developers and creatives. Allows the user to upload an audio file, analyze it on their desktop, and scan it on their mobile app to play it instantly.
Findings: Has a steep learning curve and requires some prior knowledge of haptics. Users utilizing assistive technology may have difficulty using the hold to play button. It took me 2 minutes to get the full haptic to play when utilizing voice control.
Lush 2 by Lovense: A bluetooth, remote control vibrator that uses haptics patterns. Our client wanted a similar application that allows users to draw their own haptic patterns. Through user testing, I validated my assumption that the application wasn’t intuitive or easy to use.
Findings: Intuitive and easy to use but users with motor or dexterity issues may have difficulty operating sliders. They also don’t work well with assistive technology.
User Interviews
11 interviewees | Ages 22-29 | 3 Male, 8 Female
“I always think my phone is vibrating, different strengths of vibrations would help.”
Key Findings & Insights
We synthesized the data from our user interviews through affinity mapping and came up with a few key insights:
iPhone haptics are limited - users want options to change the intensity of the haptics
Limited consumer understanding of haptics - users need a simple, intuitive interface
Use cases - users want distinctive haptics for timers, alerts, navigation, exercising, and contacts
Wellness - users want haptic reminders to breathe, meditate, or stretch
Navigation - sighted and visually impaired users want to free their hands while navigating, including while exercising
We successfully validated the marketplace potential - 50% of users were interested in creating customized haptics. While tech savvy users wanted to create customizable haptics, other users were only interested in changing the length and intensity of the haptic feedback they receive.
User Personas & Journey Mapping
We created user personas and journey maps to emphasize with users and gain a better understanding of their needs, goals, and challenges. Below is one of the personas, Jonathan. Jonathan has low vision and wants more control over the intensity of the haptic feedback he receives. He wants to be able to differentiate the different alerts he receives without checking his phone.
Solutions
Create a default library of presets for users to easily edit the length or intensity of vibrations.
Offer a design studio for the tech savvy users to create customized haptics.
Design a haptic cloud for users to discover and share haptics with the community.
Design Studio
Our team conducted a design studio remotely via Zoom to quickly identify the main features and functions.
Style Guide
I created a style guide for our team to begin ideating the branding before we began designing. I utilized the colors from their partner app, the Wayband, to maintain brand identity and designed a custom logo.
Components
I created a set of reusable components for our team so we could maintain consistency while designing. The client liked the visual design of the Robinhood app, so I created a dark theme to create a clean, futuristic look. We used the same green from their partner app to maintain the brand identity, along with high contrast iconography and text to ensure the application would be WCAG 2.0 compliant.
Usability Testing
We conducted 3 rounds of user testing with our prototype: 15 users - 2 visually impaired, 13 sighted.
As the prototype and interaction lead, my teammates conducted the majority of the user testing and I quickly iterated upon their findings and insights. I made updates to our prototype with each round of testing to improve the ease of use, user flow, eliminate any accessibility issues, and address any user pain points.
Accessibility
Since many of our users may have visual impairments, it was imperative that all interfaces support portrait and landscape orientation. We prototyped adaptive layouts in landscape and portrait mode for the main features. Landscape mode is optimal for:
Users with dexterity impairments, ie. mounted device on wheelchair
Users with visual impairments as it increases the text size
We also added plus/minus icons to give all users the same capabilities to edit or draw haptic patterns. This allows users to change the length or intensity through the keyboard controls or other assistive technology with ease.
We created a full screen tutorial instead of pop ups, as pop ups can cause frustration for users utilizing assistive technology.
Key Features
Home: Returning user’s favorite haptics are shown first, followed by navigation for different categories.
Default library: A library of haptic presets with key categories of haptics that allows users to easily edit the length and intensity.
Creative Studio: Users can design, edit, and save custom haptics with the creative studio.
Discover: Find custom haptics from the community to use instantly or share with friends.
Prototype
Since this product is in development, I will not be sharing the link to the final interactive prototype at the client’s request. If you’d like to know more about my process, please contact me.
Results
Our client said that we surpassed their expectations by identifying use cases and features they didn’t foresee. We met the clients success metrics for this project, including:
Validated market potential and identified main features
Identified use cases
Designed an interactive prototype that is WCAG 2.0 Level AA compliant
Retrospective & Next Steps
We handed off the prototype and annotations to the lead engineer and they are currently working on the development of the mobile application. This project was incredibly humbling, I learned that you can create creative, innovative solutions without sacrificing usability or accessibility.
Next Steps
Design a web application that sends a PIN during sign up (similar to Hulu) to give users the freedom to access the application on their preferred device
Add an indoor/outdoor mode toggle switch for users to uniformly increase/decrease their haptic intensity based upon their environment
Design adaptive landscape mode layouts for all screens to improve accessibility