The problem
Expedia’s Homepage migration from Legacy (Flex) to PWA (Flex-Blossom) had stalled due to poor performance (tech, design, content, accessibility, etc.).
Historically, Homepage has been a bit of a revolving door, and so there had been very little strategy or process put in place around what should live on the page, who should own that content, and (when all that content was put together) what story the page was trying to tell.
So under the guise of a “north star swarm,” we began digging into these questions. As we went through the swarm exercises, it became less about a grand UI design for future Homepage and more about defining a shared understanding of the purpose of the page for all contributors today.
Who are the primary contributors to Homepage?
Homepage Team: Wizard primarily, SEO partnerships
MeSo: Sponsored content, display ads, paid partner placements
Merch: Inventory and destination content, campaigns (i.e. Black Friday, etc.), deals
Trips: Trip entry points (users with trip intent i.e. a destination + dates)
Secondary contributors include Surface (site-wide messaging), Comet (other Expedia Group brands), all lines of business i.e. end-to-end search, and programs such as loyalty, member only deals, member only pricing, and more.
Despite being primary contributors to Homepage, none of these teams were talking to each other, which led to duplicate content, conflicting messaging, misaligned hierarchy, and ultimately no page story - instead, it was just a bunch of individual elements living together at random. Bringing these teams together, opening lines of communication, and creating a shared roadmap became a goal.
Defining job of page
First, we set out to define what the job of page is. There were some existing versions of a job of page, so we started there but a single sentence didn’t seem to go far enough. We looked at writing different versions based on user state/trip state, but those ultimately felt too prescriptive.
Because of its high visibility and the sheer number of contributors involved, it went through numerous iterations. This is where we landed:
Homepage helps me make progress on my trip, no matter where I am in the process.
It shows me relevant, timely, and useful information so I can get to where I’m going as quickly as possible
It gets me excited to take the next step when I don’t know exactly what I want yet
It gives me tools to make planning, organizing, and taking trips less painful
It reassures me that Expedia provides the best value for my time and money
Understanding the customer
While the job of the page was a step in the right direction, it’s still pretty high level, and we knew it wasn’t necessarily going to help us prioritize content. We needed more strategy resources.
The UX Research team had just recently come out with the Traveler Journey End to End Airtable, a tool that took the traveler journey map and broke it down into detailed phases, including key actions, traveler goals, and delighters & pain points. We dug into each of the phases to examine:
If it fit the job of Homepage and/or if it fit the job of a different page in the Expedia ecosystem (we wanted to avoid duplicating experiences)
What user states and/or trip states it applied to (to determine size of opportunity)
If we already had content that was fulfilling the needs of this phase today (and how well we thought it was doing that)
Traveler journey end to end Airtable from the UX Research team
Traveler journey phases that apply to Homepage
Of the 48 phases, we identified ~15 phases that fit Homepage, but only ~9 of those phases were considered “prioritized” by Homepage Product at the moment. Of those ~9 phases, we had all the Homepage contributors vote if they were High, Medium, or Low priority based on business opportunity, user need, etc. Four phases were deemed High and would inform the Homepage roadmap for the rest of the year:
Find the destination that matches WHY I want to go on a trip (Pre-book)
Learn more about the logistics of a destination (Pre-book)
I know my destination. Help me find the best/most suitable site to shop for inventory on (Pre-book/Post-book)
Check to make sure reservation is as it should be, make any changes if needed, build itinerary, etc. (Post-book)
(Ultimately, we’d like to circle back and tackle all the phases that we identified as a fit for Homepage, but limited resources - as well as parallel Trips work, particularly in the in-trip phases - forced us to scope to only the High phases for now.)
Incorporating brand voice
In the middle of all of this, COVID-19 came along and turned the travel world upside down. There were teams built to create baseline travel alert messaging (including on Homepage), but outside of that, there wasn’t a specific strategy outlined for the “face” of the brand as it related to COVID-19. We knew users were anxious and confused about travel, but we weren’t sure how that should manifest on Homepage without causing fear or overpromising what our brand could deliver.
If there’s a silver lining to the pandemic, it’s that it gave us an opportunity to work directly with the Expedia Brand team, something there’d be appetite for for a long time. We approached them about creating a brief covering the topics, products, personality traits, etc. that we should lean into during this unprecedented time.
This brief became another tool to further refine the page story for Homepage. In fact, it became such a key rallying point for all the contributors that we’ve asked the Brand team to compose a brief each quarter (or more often, if another crisis emerges, there’s an immediate need to shift strategy, etc., or less often if COVID-19 drags out) that can help align and drive the Homepage content and page story.
Defining & scaling quality
So, what is “quality” anyway?
With the job of page, prioritized traveler journey phases, and brand brief in hand, we mapped all the existing content to see how it laddered up to these new resources. Whatever didn’t fit the bill was removed from the page.
Meanwhile, there was intense scrutiny coming from the C-suite to “level up” the Homepage experience, so work rapidly began to make improvements to existing content and design new solutions to address gaps. The goal was to get to a baseline experience for cold start and anonymous users (the user states that were scoped for immediate focus because they account for ~70% of all Homepage traffic).
There’s a UX working group to define “what good looks like.” This will likely produce a resource for use across the end-to-end product experience. The images below illustrate how Expedia Homepage changed and improved during only 8 short months.
How can we ensure all contributors are meeting the quality bar?
To maintain a level of quality and compliance with these new strategy resources across all contributors on Homepage moving forward, we designed an intake and review process.
This process included:
A confluence hub with easy access to the resources and priorities for the Homepaget space that all of Expedia Group could access
An intake form to vet pitches for new Homepage content before work began (and to reduce randomization of these requests)
Homepage content guidelines and specs to make sure specific copy and images fit module constraints
A Homepage Contribution Checklist to ensure all use cases are considered and to consolidate time needed for feedback
Source Figma files to illustrate a source of truth for the page design and content at any given time
A series of meetings to ensure communication with all stakeholders & contributors:
Monthly Experience Reviews with leadership to keep them up-to-date on optimizations we’ve been making and to catch any issues that need to be resolved.
Weekly Homepage Contributor Syncs to review content and designs from outside teams that wanted to put content on the page
The outcomes
Data
As of August 6th, 2020, Expedia was able to rollout the migrated PWA to 100% of traffic. It took ~17 months between the first PWA pull request to deprecation of the old stack. Now more than 1,000,000 users visit the PWA Homepage. Iteration continues to further align Homepage content with the job of page, user needs, and brand brief.
With the addition of more robust COVID-19 content, Homepage quickly became the leading driver of chat conversations across the Expedia ecosystem, resulting in an increase in NPS scores almost overnight.
Chat Access Point Summary
Expedia NPS Scores
Next steps
Now the process starts over again for different user states: identified and anonymous. It will begin as a close partnership with the Homepage Team and Trips to launch entry points to the Trips experience (namely Trip Overview) from Homepage, but will circle back to Merch and MeSo teams to align the page story with the 2021 Q1 brief focused on bringing trips to the center of the experience (assuming we move into COVID-19 recovery).
Any new content will now be quicker and easier to prioritize and execute on because we have the overall page strategy and resources in place. That’s not to say we have it all figured out. Some things that are still a work-in-progress:
Understanding how marketing (including merch and brand) + UX + product content sounds, looks, and lives together
Understanding how MeSo fits in the hierarchy of the page (Revenue is great, but should we prioritize other brands over our own? Can we create new, more integrated ad products?)
Defining a shared vocabulary (Storefront or Homepage? Module name or headline name?)
Building a reusable pattern library in Figma for all Flex-Blossom components
Producing a content calendar (Merch-led initiative)
Defining how all of this translates (or doesn’t) to app Homepage