TripIt wanted to add a new feature to the app that allowed travelers to keep travel documents, emergency contacts, and other important travel info at their fingertips.
This was also the first team to go fully Agile. We made a squad of Product Managers, Designers, and Developers for the full cycle of the project.
Where did we put this new feature? How would people discover it? How useful would it be?
Easy to use
Role & Team:
Lead UX Designer: Myself
UX Designer: 1
Product Managers: 2
There was an existing feature called Traveler Profile. It had a bit of information about the person who owned the account, such as their home airport, and stats about the trips they had taken. We decided to build out this feature and make it more useful. However, this feature only existed on the web version and not on any of the mobile apps. So we had to add an entirely new feature to both the iOS and Android apps and add to an existing feature on the website.
I started with a sitemap and then began sketching screens. It was important that there was consistency between all three platforms in both functionality and design.
There was a lot of discussion between the UX team and the PMs on the project. UX wanted to add a PIN to lock the information behind the profile as an extra layer of security. There are a lot of personal documents held in this profile. The PMs thought it would be too much of a barrier to entry to require this extra PIN, so we compromised with messaging.
Because the web version had a screen name, we had to carry it over in mobile. We had no specific statistics around whether it was useful, but since it had been there since the beginning of the TripIt platform, we couldn't just remove it. We did add functionality to make sure the screen name was unique, which did not exist before this upgrade.
According to the PMs, the biggest benefit of this upgraded feature would be the ability to store travel documents electronically, such as a passport, visas, or a driver's license.
From a UX point of view, one of my biggest concerns was not having the user have to manually enter the information from all these documents. We added the ability to take a photo with your phone add then used OCR technology to read as much of the information as possible. Once added, the user could view their document info as text or the photo itself.
Because of the sensitive information and new pieces to an existing feature, I focused a lot on the copy to build trust with both existing and new users. I designed null screens, partially filled out screens, and fully filled out edge case screens.
VALIDATING THE DESIGN
As we moved into visual design, I wanted to make it very clear, but also delightful, how to choose various options. I ran a few days of preference testing online and got some good results.
Although the preference testing was only run on the desktop version of the feature, I used it to inform the visual design of all three platforms, while keeping the brand and style guide of TripIt.
Our team performed the best as far as being on time and producing the most work efficiently that the company had ever seen.
Since the web wasn't a totally new feature, when I created the visual specification document, I only called out changed items from the original feature.
After launch, there was a backlash from users about the lack of security built into this feature. We ended up requiring users to create a PIN to access this sensitive information within the apps.
Lead UX Designer
Lead UX Designer