CASE STUDY
API Client Enhancements
Expanding API management capabilities on EG Console, Expedia’s self-service platform for travel partners.
Overview
EG Console, part of Expedia’s Core Services product, exists to facilitate the externalization of existing capabilities to travel partners and to develop new capabilities that help them better manage their business/product across the Expedia brand via centralized configuration management + self-service adoption. These configurations include managing API clients used across a partner’s organization, as well as the permissions of who can access what within that org’s accounts hierarchy.
MY ROLE
Product Designer II
User research
UX mapping & flows
Information architecture
Interaction design
Component design
Prototyping
TEAM
Platform XD
Team lead: Michelle Hazan
PM: Benaz Meyer
Lead/guidance: Eric Hung
UX writer: Sarah Thompson
TOOLKIT
Figma, Figjam, Miro, JIRA, Confluence
TIMELINE
8 weeks
Goals
Giving partners more control over managing and assigning API credentials (using roles and scopes) associated with their organization and its accounts.
Better call outs for expiring APIs and the highlighting the importance of rotating out credentials.
Creating new components using EG’s design system to accommodate this functionality.
Problem Statement
EG Console has been building out its collection of API products available to its partners, and enhancements must be made to the API clients creation/selection product to accommodate new, more robust controls and functionality.
Example of EG Console products available to partners
Research
I begin by doing a deep dive into APIs, a space I wasn’t very familiar with prior to this project. I meet with engineers on our team to get a better understanding of how our APIs function around organizational permissions, and the technical requirements involved in maintaining and updating API credentials.
I then spend focused time on competitive analysis, investigating the way that roles / scopes functionality differs across competitive products. I create a list of notes and questions to bring back to our internal team, as well as the larger team of stakeholders, for review and open discussion.
Research and competitive analysis of API Scopes and Naming Standards
Research and competitive analysis of API Roles and Role Based Access
Compiled notes and open questions following cross-functional team meeting
Design
Ideating using the wireframes and research above, I create designs for what I believe are the best case and most frictionless solutions to achieve project goals, adhering to the company's design system and modifying components where necessary. Here are some of those components, assembled with variant states and content for presentation.
A badge can be added to the individual cards on the API clients list, signifying the state of the API (active/expired) as well as the amount of time left before credentials expire and/or how long before an old set of credentials is permanently deleted from the system database. These badges will be color coded and use iconography in alignment with design system standards to e.g. convey urgency of action on soon-to-expire credentials, or no action needed on recently renewed credentials.
As an additional means of reminding users that their API credentials are set to expire, a dialog window can be added to the API clients list prompting users to rotate their credentials, triggered to display only once a certain number of days are left before expiry.
When rotating credentials, user will now have the option of choosing the duration of credentials, determining when the next rotation will be required. "Credential duration" will be added as a field on the rotate credentials page, with a drop down menu to select duration options.
The selection/maintenance of scopes permissions can be added to the API details page as an editable checkbox list, with roles determining which scopes are available to which users. Scopes can be selected when an API is first created, and can be edited at any time from an existing API.
I met with stakeholders and presented these options, offering variants for several of the solutions and components to A/B test with the group. For instance I created an alternate design for the rotate credentials notifications that utilized banners instead of the dialog seen above. However, we decided as a team that the dialog, while more disruptive, was also more impactful in conveying urgency, and offered a clear call to action with its "Rotate Credentials" button.
Discovery
Having finished the research phase of the project with a better understanding of how roles and scopes interact with APIs and how these elements are handled by other organizations, I next set out to determine how to best achieve our projects goals given scope and back-end limitations.
To help with this, I created user flow charts for the enhanced Create API, Edit API, and Rotate Credentials workflows to visually map all of the ways that APIs are touched within EG Console. I also created a Site Map of these workflows using wireframes and modified versions of existing screens that incorporate new components and functionality.
Diagram showing the user flows for creating and/editing API clients and rotating credentials
Site map with wireframes of modified existing screens showing the same workflows
High Fidelity Mock-Ups
Reflection
Following sign off from my team and design leads, I create a detailed prototype to be used in usability testing by the Product team. I work cross-functionally with engineers and PMs to ensure that the designs and functionality are translated correctly. The API enhancements are shipped on schedule, an important step in scaling EG Console's capabilities and customizations, offering travel partner more control and visibility over their APIs.
This was my first assignment after joining the Platform XD team, and my first time working on EG Console. As such, I had to do a lot of contextual learning along the way to make sure I was fully capturing the functionality and visual identity of the product. I relied on my design leads to help me fill in those gaps and confirm my work along the way, and frequently referred back to the reference materials I assembled to refresh myself on the nuances of API credentials and the hierarchical structure of roles and scopes.