Contact
zeb.abalos@gmail.com
The Human app was envisioned as a companion to Human Headphones, guiding the user through setup, providing helpful device feedback like battery level and connection status, while unlocking additional features such as Blend, Speaker Mode, Translate, and Assistant.
Since we planned on releasing new features to the hardware itself, the app would also need to facilitate the over-the-air update process.
Walk user through first time connection and provide a guide on basic functionality.
Indicate system status to user like power, battery level, and connection status.
Allow user to manage and switch between known connections (audio sources).
Provide a dedicated area for users to adjust their device and app defaults.
Notify user when an update is available and guide them to a successful update.
Translate one or multiple languages directly into your headphones.
Enable hands-free voice assistance via keyword and dedicated gesture.
Transform headphones into a portable speaker by clasping them together.
Provide levels of sound transparency including a quick gesture to engage.
iOS + Android present different opportunities and limitations. I didn’t want to pass on a better user experience simply for the sake of parity, so I made sure to grant users the conveniences they expect.
If Bluetooth is off during FRE connection, Android users were given a shortcut to turn on Bluetooth with the tap of a button, while iOS users were instructed on how to manually turn on Bluetooth due to iOS limitations.
I tried to find a way to avoid the tab bar at first, inspired by gesture-based navigation. However, in the end, due to the number of features yet undefined and an understanding of what our engineering team could deliver within the remaining time left, I recommended the simplest and most flexible solution and incorporated elements of modality wherever it made sense.
When the team first began tackling Translate, there was a big push to reduce screens, attempting to solve all scenarios in one robust screen. What resulted however was confusion: users were presented too many options with no clear understanding of what each did.
So I scrapped the whole thing and headed the opposite direction. Rather than focusing on less screens, I focused on less per screen. I created 3 separate flows and customized each screen based on what was relevant in context. The result was more screens but each flow was drastically more useful and usable than before.
One of the most unique things about our headphones was that you could snap them together to turn them into a portable speaker. Once snapped together you could share your music or video with a friend at a louder volume than your phone.
At the end of the day, it didn’t matter how great of an app experience we designed for enabling Speaker Mode, I knew if we could come up with a way to enable Speaker Mode without the app and perhaps even without the phone, that would make it a much more appealing and functional feature. So after many white-boarding sessions a solution emerged.
When the headphones are first clasped, they immediately disconnect by default. The user then has 3 minutes to tap on the speaker button in the app before the headphones fully power down.
The first change was to expose the Speaker button while unclasped as a hint to users who may not even know how the feature works. Once tapped, a prompt to clasp the headphones appears.
Next, I designed a way to get into speaker mode without opening the app by treating the headphones like any other bluetooth speaker. Just connect via your phone settings while they're clasped and voila!
Finally, to achieve the most seamless transition to Speaker Mode, I planned on introducing a gesture that would prepare the units to go into Speaker Mode when clasped instead of turning off as usual.
While it’s important to help users recover from errors, it’s always better to prevent the user from encountering those errors in the first place. Since I knew updating the headphone firmware could be a landmine of unhappy paths, I made sure the user was guided into a good situation before even being given the option to begin the update.
→ Require phone battery to be at a minimum level or charging.
→ Require headphones to be placed on charger to begin update.
→ Caution user on amount of time update will take prior to beginning.
Throughout the design process, I explored various visual and motion executions. The brand and product were still being defined up to the last minute, I had to design a system that would work regardless of what our brand and product colors end up being and made sure not to invest in hard-coded motion animations that would break if a feature changed or was scrapped altogether.
