Expedia: Project Ping
During a 1-year contract at Expedia, I worked as part of a cross-functional product and technology team to redesign a bespoke responsive web platform providing a centralized place for employees to access information they need to do their jobs effectively. I was responsible for all UX design, UI design, user research and testing.
Project Background
The goal of Project PING was to create a centralized location for all employees to access information they needed to do their jobs more efficiently. On an existing employee portal we were able to determine through analytics that 3 sections of the site were used most frequently, and confirmed in user interviews that these were the 3 most important features & content to current users:
Search
Daily Challenges
Articles
The main pain points discovered in user interviews were:
Search was missed or not clear enough, often produced no results
They sometimes missed required or critical content
Lacking personalization in notifications
User interviews & Affinity Mapping
User interviews were done with 12 employees with varying roles and locations in the UK and USA. Affinity Mapping was done remotely in Miro helped synthesize insights from user interviews.
Sketches & Team Reviews
Taking these insights into account I came up with an initial round of sketches to review with the team. The designs were based on a feed system with an improved search, filters, and added notifications.
What they liked:
They all loved the shift to a feed based design, they thought it would be easier to see the most recent and relevant information first.
Categorization of content with tags.
Prominence of the search bar, with auto-complete and suggested search results.
Clear visual indication of the most important content.
Notifications in the top navigation that tell you when there are new important messages.
Painpoints:
A few users found the 2 searches confusing. They were not clear on the difference between a site-wide search and a feed search.
About half were not clear on how to use the filters, or not sure when they would use them.
Most were not clear on how to tell if notifications were new or old, or how to dismiss them.
Medium Fidelity Wireframes
Next step was to move into medium fidelity wireframes done in Sketch. Then another team review where we started to discuss some visual/ UI elements. Primarily how users would differentiate levels of importance in content and make sure they don't miss the most important information.
These medium fidelity wireframes went into usability testing with 5 employees who currently use at least 1 other employee portal or similar product.
High Fidelity Wireframes
Feedback from usability testing along with team review feedback was taken Into consideration and integrated into high fidelity wireframes. UI decisions were based on the Expedia brand guidelines and adapted for the purpose of this project to fit with visual patterns in other internal tools.
Responsive screens shown on mobile (Home, Menu, Filters, Notifications)