TripIt
Settings Refresh: Bringing Clarity and Consistency to the Basics
Giving Attention to an Overlooked, Yet Fundamental Part of Good UX
The settings home screen for the new TripIt web application.
Elevating Web Settings to Match Modern User Expectations
TripIt’s web app settings had become outdated, cluttered, and difficult to use, lacking the quality, responsiveness, and accessibility users expected. As TripIt continued to improve its mobile app, it was time to bring the web experience up to the same standard, especially for high-impact areas like the settings menu.
🙈
The Problem with the Legacy Web Settings
The settings menu had been left untouched for a long time and faced several major issues:
Outdated UI and poor accessibility, making it cumbersome for users to navigate.
Cluttered layout and confusing information architecture, leading to user frustration.
Limited time and resources: The lead designer for the web app couldn’t focus on the settings page due to other web priorities.
Reimagining Web Settings for a Better User Experience
I volunteered to lead the settings refresh project, coordinating with the lead web app designer to ensure consistency across the platform. Working with the product manager, we decided that rebuilding the settings page would be more efficient than trying to update the existing one.
Key goals for the new design included:
Responsiveness and accessibility to meet modern UX standards.
Scalability to accommodate future features and updates.
Intuitive information architecture that aligned with best practices from the mobile app.
I used data metrics on user behavior from research for the mobile app to prioritize features for the web MVP, focusing on core functions like email management and account security. Based on research into Information Architecture, I grouped features for clarity, moving some items from “Settings” to a more relevant location within the user profile.
A Scalable Solution for TripIt's Web App
The result was a settings menu that was responsive, scalable, and tailored to the needs of TripIt’s EU users in the MVP release. Key updates included:
Email Management: Adding, verifying, setting a primary email, and removing emails.
Account Merging functionality.
Password Management: Enabling secure password updates.
Alerts and Notifications: Including the most crucial notifications initially, with plans to expand.
Highlights of the New Design:
Left Sidebar Navigation: A clean sidebar with labeled sections for easy navigation.
Card-Based Layout: Each function—like email and password management—sits within its own card, making it easy to initiate separate flows.
Subscription Management: Checkboxes and help text allow users to select email updates quickly and easily.
Display Preferences: Dropdown menus allow users to set preferences for date, time, distance, and weather formats, offering customization options for an international audience.
Two introductory settings screens contained account, security, and display features.
Takeaway
The web app settings refresh resulted in a modernized, user-friendly menu that meets TripIt’s accessibility and usability standards. Positive feedback from early users highlighted the clarity and ease of navigating the new settings, creating a strong foundation for ongoing enhancements.